@import url("workspace-icons.css");
@import url("workspace-insights.css?v=20260918-theme");
@import url("workspace-assessments.css?v=20260918-theme");
@import url("workspace-findings.css?v=20260918-theme");
@import url("workspace-login.css?v=20260919-reset");
/* Shared workspace design for login, staff and portal pages. */
.workspace-nav-backdrop[hidden] { display: none; }
:root {
  --bg: #f5f5f6; --surface: #fff; --surface-2: #f7f7f8; --surface-3: #efeff1;
  --border: #e9e9ec; --border-strong: #dcdce1;
  --text: #202024; --text-2: #36363e; --muted: #565660; --faint: #565660;
  --primary: #252528; --primary-hover: #3b3b40;
  --accent: #42424b; --accent-hover: #151518; --accent-tint: #eeeef2; --accent-ring: #77778b26;
  --side-bg: #fff; --side-bg-2: #f3f3f5; --side-text: #676770; --side-muted: #565660;
  --side-active: #28282e; --side-line: #efeff1; --side-mark: #33333a; --side-mark-text: #fff;
  --radius: 13px; --radius-sm: 7px; --shadow: 0 1px 3px #18181b04;
  --side: 224px;
  --table-header-bg: #f5f5f6; --table-row-border: #f0f0f3;
  --table-header-radius: 6px;
}
/* Shared theme tokens. System reacts to device changes without a page reload.
   Component light-dark() values preserve the reference's exact light palette. */
html.workspace {
  color-scheme: light dark;
  --bg: light-dark(#f5f5f6, #17171b);
  --surface: light-dark(#fff, #202025);
  --surface-2: light-dark(#f7f7f8, #27272e);
  --surface-3: light-dark(#efeff1, #303038);
  --border: light-dark(#e9e9ec, #363640);
  --border-strong: light-dark(#dcdce1, #51515f);
  --text: light-dark(#202024, #ededf1);
  --text-2: light-dark(#36363e, #d5d5de);
  --muted: light-dark(#565660, #b5b5c3);
  --faint: var(--muted);
  --primary: light-dark(#252528, #454551);
  --primary-hover: light-dark(#3b3b40, #575765);
  --accent: light-dark(#42424b, #d0d0e0);
  --accent-hover: light-dark(#151518, #fff);
  --accent-tint: light-dark(#eeeef2, #33333e);
  --accent-ring: light-dark(#77778b26, #aaaac34d);
  --side-bg: var(--surface);
  --side-bg-2: light-dark(#f3f3f5, #303038);
  --side-text: light-dark(#676770, #b5b5c3);
  --side-muted: var(--muted);
  --side-active: light-dark(#28282e, #ededf1);
  --side-line: light-dark(#efeff1, #363640);
  --side-mark: light-dark(#33333a, #b5b5c3);
  --side-mark-text: light-dark(#fff, #202025);
  --table-header-bg: light-dark(#f5f5f6, #27272e);
  --table-row-border: light-dark(#f0f0f3, #363640);
  --ok: light-dark(#3f6212, #a5c97c);
  --ok-tint: light-dark(#eef4e4, #283329);
  --warn: light-dark(#b45309, #e6b36b);
  --warn-tint: light-dark(#fbf1e3, #393024);
  --bad: light-dark(#8b1a1a, #f29b9b);
  --bad-tint: light-dark(#f7e6e6, #40282d);
}
html.workspace[data-theme="light"] { color-scheme: light; }
html.workspace[data-theme="dark"] { color-scheme: dark; }
/* SVG brand artwork is monochrome on dark surfaces; uploaded raster logos keep their colors. */
html.workspace { --workspace-logo-filter: none; }
html.workspace[data-theme="dark"] { --workspace-logo-filter: brightness(0) invert(1); }
@media (prefers-color-scheme: dark) {
  html.workspace:not([data-theme="light"]) { --workspace-logo-filter: brightness(0) invert(1); }
}
html.workspace nav.side .brand .logo[src$=".svg"],
html.workspace .workspace-login-brand img[src$=".svg"] { filter: var(--workspace-logo-filter); }
html.workspace .workspace-wordmark,
html.workspace .workspace-auth-brand .logo[src$=".svg"] { filter: var(--workspace-logo-filter); }
nav.side .brand .workspace-wordmark { width: 132px; max-width: 100%; height: auto; object-fit: contain; }
body { font-size: 14px; }
svg.lucide { stroke-width: 1.65; }
nav.side { z-index: 55; border-right: 1px solid var(--side-line); padding-bottom: 16px; width: 224px; }
nav.side .brand { height: 65px; min-height: 65px; gap: 6px; padding: 0 22px; margin-bottom: 17px; font-size: 15px; letter-spacing: -.5px; }
nav.side .brand .logo { width: 36px; height: 36px; object-fit: contain; }
nav.side .group { padding: 0 12px; margin: 3px 0 9px; }
nav.side .label { display: none; }
nav.side .scroll > .group { margin: 0; }
nav.side .scroll > .group:has(> .label:only-child) { display: none; }
nav.side .scroll { display: flex; flex-direction: column; }
nav.side .scroll > .group { flex-shrink: 0; }
nav.side .scroll > .group:nth-child(3) { margin-top: 16px; }
nav.side .scroll > details.settings:first-of-type { margin-top: auto; padding-top: 24px; }
nav.side .group a, nav.side details.settings > summary { gap: 11px; padding: 9px 12px; border-radius: 7px; font-size: 13px; font-weight: 450; }
nav.side .group a.active { color: var(--side-active); background: light-dark(#f0f0f2, var(--surface-3)); font-weight: 550; box-shadow: inset 0 1px 2px #18181b03; }
nav.side .group a.active::before { display: none; }
nav.side .group a.active svg { color: light-dark(#34343b, var(--text)); }
nav.side .group a svg, nav.side details.settings > summary svg { width: 15px; height: 15px; }
nav.side details.settings > a { padding-left: 38px; font-size: 12.5px; }
nav.side .foot { margin: auto 12px 0; padding: 16px 6px 0; }
nav.side .brand-name, nav.side .foot .who > * { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
nav.side .foot .who b { font-size: 12px; }
nav.side .foot .who span { font-size: 12px; }
nav.side .foot details > summary { padding: 7px 8px; margin: -7px -8px 0; border-radius: 8px; transition: background-color .16s ease, color .16s ease; }
nav.side .foot details > summary:hover,
nav.side .foot details[open] > summary { background: light-dark(#f3f3f5, var(--surface-2)); }
nav.side .foot details[open] > .group { animation: workspace-account-menu-in .18s cubic-bezier(.2, .7, .2, 1) both; transform-origin: bottom left; }
.workspace-account-chevron { display: inline-flex; align-items: center; flex: none; margin-left: auto; color: var(--side-muted); }
.workspace-account-chevron svg { width: 14px; height: 14px; transform-origin: center; transform-box: fill-box; transition: transform .18s cubic-bezier(.2, .8, .2, 1); will-change: transform; }
nav.side .foot details[open] .workspace-account-chevron svg { transform: rotate(180deg); }
nav.side .avatar { width: 31px; height: 31px; }
.workspace-topbar { position: fixed; z-index: 35; top: 0; left: var(--side); right: 0; height: 65px; padding: 0 26px; display: flex; align-items: center; gap: 18px; background: light-dark(#ffffffed, color-mix(in srgb, var(--surface) 93%, transparent)); border-bottom: 1px solid light-dark(#efeff1, var(--border)); backdrop-filter: blur(12px); }
.workspace-nav-toggle.btn { height: 28px; width: 28px; padding: 0; display: inline-flex; align-items: center; justify-content: center; color: var(--muted); }
.workspace-nav-toggle svg { width: 15px; height: 15px; margin: 0; }
.workspace-topbar-divider { height: 15px; width: 1px; background: var(--border); }
.workspace-page-location { display: inline-flex; gap: 9px; align-items: center; color: var(--muted); font-size: 12.5px; white-space: nowrap; }
.workspace-page-location svg { width: 14px; height: 14px; color: light-dark(#565660, var(--muted)); }
.workspace-search { position: relative; margin: 0 0 0 auto; width: 225px; }
.workspace-search input { height: 31px; padding: 0 12px 0 32px; border-color: light-dark(#ececef, var(--border)); border-radius: 7px; font-size: 12px; background: light-dark(#fff, var(--surface)); }
.workspace-search > svg { position: absolute; left: 11px; top: 9px; height: 13px; width: 13px; color: light-dark(#565660, var(--muted)); pointer-events: none; }
.workspace-search input::placeholder { color: light-dark(#565660, var(--muted)); }
.workspace-activity.btn { display: inline-flex; align-items: center; padding: 0 7px; height: 30px; color: light-dark(#565660, var(--muted)); }
.workspace-activity svg { margin: 0; width: 16px; height: 16px; }
main { padding: 98px 38px 88px; max-width: none; }
h1 { font-size: 23px; line-height: 1.35; font-weight: 550; letter-spacing: -.8px; }
.page-head { margin-bottom: 24px; }
.page-head .sub { font-size: 13px; margin-top: 8px; color: var(--muted); line-height: 1.7; }
.page-head > .actions { vertical-align: middle; }
.card, .cols.stacked-columns > .stack > section { border-color: light-dark(#ececef, var(--border)); box-shadow: 0 2px 6px #18181b02; }
.card > h2, .card-head { background: light-dark(white, var(--surface)); border-bottom-color: light-dark(#f0f0f2, var(--border)); font-size: 14px; padding: 18px 20px; font-weight: 550; }
.card > h2 a { font-weight: 400; color: var(--muted); display: inline-flex; align-items: center; gap: 5px; font-size: 12px; }
.card > h2 a svg { width: 13px; height: 13px; }
.card > h2 .muted { font-size: 12px; }
button, .button, .btn { border-color: var(--border-strong); border-radius: 7px; font-size: 13px; box-shadow: 0 1px 2px #18181b04; }
.btn.primary, button.primary { background: linear-gradient(light-dark(#333337, var(--primary-hover)), var(--primary)); border-color: light-dark(#333337, var(--border-strong)); color: #fff; box-shadow: inset 0 1px 1px #ffffff18, 0 1px 2px #18181b14; }
/* Primary action links share the same white label as primary buttons in every workspace toolbar. */
html.workspace .toolbar > a.btn.primary,
html.workspace .toolbar > a.btn.primary:hover,
html.workspace .toolbar > a.btn.primary:focus-visible { color: #fff; }
button.link { box-shadow: none; }
.toolbar { gap: 10px; margin-bottom: 19px; }
.toolbar input:not([type=checkbox]), .toolbar select { border-color: var(--border); }
.seg { padding: 3px; gap: 2px; height: 34px; border-color: var(--border); background: light-dark(#eeeef0, var(--surface-3)); border-radius: 8px; overflow: visible; }
.seg > * { border: 0; border-radius: 5px; font-size: 12px; padding: 0 10px; }
.seg > .active, .seg > label:has(input:checked) { background: light-dark(white, var(--surface)); color: var(--text); box-shadow: 0 1px 3px #18181b12; }
.seg > .active b, .seg > label:has(input:checked) b { color: var(--muted); }
.seg.result { padding: 0; gap: 0; overflow: hidden; }
.seg.result > button { border-radius: 0; }
.tabs { gap: 12px; border-bottom-color: light-dark(#e3e3e7, var(--border-strong)); }
.tabs a { font-size: 13px; padding: 11px 9px; }
.tabs a.active { border-bottom-color: light-dark(#46464f, var(--text-2)); }
.tabs a b { font-size: 12px; }
table { font-size: 13px; }
th, td { padding: 13px 18px; border-color: light-dark(#efeff2, var(--border)); vertical-align: middle; }
thead th { background: light-dark(#f5f5f6, var(--surface-2)); font-size: 12px; font-weight: 450; color: var(--muted); text-transform: none; letter-spacing: 0; border-bottom: 1px solid light-dark(#efeff2, var(--border)); }
tbody tr:hover td { background: light-dark(#fafafb, var(--surface-2)); }
td a { font-weight: 450; }
.chip, .sev-chip { font-size: 12px; border-radius: 6px; }
.chip.status { border-color: transparent; background: color-mix(in srgb, var(--c) 9%, light-dark(white, var(--surface))); }
.chip.status::before { height: 5px; width: 5px; vertical-align: 1px; }
.kpis { gap: 16px; }
.kpis > div { border: 4px solid light-dark(white, var(--border)); background: light-dark(#f4f4f6, var(--surface-2)); box-shadow: 0 1px 3px #18181b09; padding: 16px; }
.kpis b, .kpis strong { font-size: 29px; font-weight: 500; letter-spacing: -1px; }
.kpis span { font-size: 12px; }
.kpis small { font-size: 12px; }
input:not([type=checkbox]):not([type=radio]), select, textarea { border-radius: 7px; }
fieldset { border-radius: 10px; }
dialog.modal { margin: 6vh auto auto !important; border: 1px solid light-dark(#e1e1e6, var(--border-strong)); border-radius: 15px; box-shadow: 0 20px 80px #18181b26; }
dialog.modal::backdrop { background: #27272b38; backdrop-filter: blur(3px); }
dialog.modal header { padding: 18px 22px; }
dialog.modal footer { padding: 15px 22px; }
.cols.stacked-columns > .stack:first-child { flex: 1.1 1 0; }
.cols.stacked-columns > .stack > section > h2 { padding: 18px 20px; font-size: 14px; }
ul.flow form, ul.flow .row { padding-top: 10px; padding-bottom: 10px; }
ul.flow .t { font-size: 13px; }
.workspace-dashboard { max-width: none; margin: auto; }
.workspace-welcome .actions > * { margin-left: 9px; }
.workspace-date { display: inline-flex; align-items: center; gap: 7px; color: light-dark(#6c6c76, var(--muted)); background: light-dark(#ffffffb3, color-mix(in srgb, var(--surface) 70%, transparent)); border: 1px solid light-dark(#e8e8ec, var(--border)); border-radius: 7px; height: 32px; padding: 0 10px; font-size: 12px; }
.workspace-date svg { width: 13px; height: 13px; }
.workspace-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 25px; }
.workspace-metric { background: light-dark(white, var(--surface)); padding: 5px 5px 0; border-radius: 12px; box-shadow: 0 1px 3px #18181b0a; color: var(--text); border: 1px solid light-dark(#ededf0, var(--border)); transition: box-shadow .16s, border-color .16s; min-width: 0; }
.workspace-metric:hover { text-decoration: none; box-shadow: 0 2px 8px #18181b0a; border-color: light-dark(#dddde3, var(--border-strong)); }
.workspace-metric-body { padding: 9px 11px 10px; border-radius: 8px; background: linear-gradient(110deg, light-dark(#f3f3f5, var(--surface-2)), light-dark(#f7f7f8, var(--surface-2))); }
.workspace-metric-label { display: flex; align-items: center; gap: 9px; color: light-dark(#565660, var(--muted)); font-size: 12px; }
.workspace-tile-icon { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; flex: none; border: 1px solid light-dark(#eaeaed, var(--border)); border-radius: 6px; background: light-dark(#fff, var(--surface)); color: light-dark(#555560, var(--muted)); box-shadow: 0 2px 2px #18181b08; }
.workspace-tile-icon svg { width: 13px; height: 13px; }
.workspace-metric strong { display: block; margin: 4px 0 0 33px; font-size: 27px; font-weight: 500; letter-spacing: -1.2px; line-height: 1.15; }
.workspace-metric-foot { display: flex; align-items: center; gap: 6px; padding: 8px 9px; font-size: 12px; color: var(--muted); white-space: nowrap; }
.workspace-metric-foot > svg { width: 11px; height: 11px; margin-left: auto; color: light-dark(#565660, var(--muted)); }
.workspace-indicator { display: inline-block; width: 5px; height: 5px; border-radius: 50%; margin-right: 2px; background: #92929b; flex: none; }
.workspace-indicator.green { background: #57a989; box-shadow: 0 0 0 3px #57a98912; }
.workspace-indicator.blue { background: #739cca; box-shadow: 0 0 0 3px #739cca12; }
.workspace-indicator.amber { background: #c49a5e; box-shadow: 0 0 0 3px #c49a5e12; }
.workspace-indicator.violet { background: #9a89c5; box-shadow: 0 0 0 3px #9a89c512; }
.workspace-count { display: inline-block; margin-left: 5px; padding: 1px 6px; border-radius: 5px; font-size: 12px; font-weight: 450; color: light-dark(#565660, var(--muted)); background: light-dark(#f2f2f5, var(--surface-3)); vertical-align: 1px; }
.workspace-dashboard .card > h2 { border-bottom: 0; padding: 14px 18px; }
/* Filter composition varies by domain; control spacing and surfaces do not. */
html.workspace :is(.assessment-list-filters, .workspace-findings-toolbar) {
  padding: 11px 12px; gap: 9px; background: var(--surface); border: 1px solid light-dark(#ededf0, var(--border));
  border-radius: 11px; box-shadow: 0 1px 3px #18181b03; margin-bottom: 16px;
}
html.workspace :is(.assessment-list-filters, .workspace-findings-toolbar) > a:not(.btn) { font-size: 12px; color: var(--muted); }
html.workspace :is(.assessment-list-filters, .workspace-findings-toolbar) > a:not(.btn):hover { color: var(--text); }
html.workspace :is(.assessment-list-filters, .workspace-findings-toolbar) input.search { background: light-dark(#fafafb, var(--surface-2)); font-size: 12px; min-width: 190px; }
html.workspace :is(.assessment-list-filters, .workspace-findings-toolbar) .picker { min-width: 180px; }
html.workspace :is(.assessment-list-filters, .workspace-findings-toolbar) .tokens { border-color: light-dark(#e9e9ee, var(--border)); box-shadow: none; }
html.workspace :is(.assessment-list-filters, .workspace-findings-toolbar) .seg { background: light-dark(#f1f1f3, var(--surface-3)); }
/* One presentation owner for configurable domain tables and existing library/client lists. */
html.workspace .workspace-table-scroll { min-width: 0; max-width: 100%; overflow-x: auto; }
html.workspace .workspace-table-scroll:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
/* The frame replaces a direct table; generic card prose margins must not add a second inset. */
html.workspace .card > .workspace-table-scroll { margin: 9px 10px; max-width: calc(100% - 20px); }
html.workspace .card > h2 + .workspace-table-scroll { margin-top: 0; }
html.workspace :is(.workspace-dashboard .card, .workspace-assessments) > .workspace-table-scroll { margin: 0 10px; }
html.workspace :is(.assessment-list-table, .workspace-findings-table, .workspace-activity-table) > .workspace-table-scroll { margin: 0; max-width: 100%; }
html.workspace .card > .client-table-scroll { margin: 0 10px 10px; min-width: 0; max-width: calc(100% - 20px); }
html.workspace :is(.workspace-data-table, .assessment-list-table table, .workspace-findings-table table, .client-table-scroll table, .workspace-activity-table table) { font-size: 12px; }
html.workspace :is(.workspace-data-table, .assessment-list-table table, .workspace-findings-table table, .client-table-scroll table, .workspace-activity-table table) > thead > tr > th {
  padding: 9px 13px; border: 0; background: var(--table-header-bg);
  color: var(--muted); font-size: 12px; font-weight: 450; text-transform: none; letter-spacing: 0;
}
html.workspace :is(.workspace-data-table, .assessment-list-table table, .workspace-findings-table table, .client-table-scroll table, .workspace-activity-table table) > thead > tr > th:first-child { border-radius: var(--table-header-radius) 0 0 var(--table-header-radius); }
html.workspace :is(.workspace-data-table, .assessment-list-table table, .workspace-findings-table table, .client-table-scroll table, .workspace-activity-table table) > thead > tr > th:last-child { border-radius: 0 var(--table-header-radius) var(--table-header-radius) 0; }
html.workspace :is(.workspace-data-table, .assessment-list-table table, .workspace-findings-table table, .client-table-scroll table, .workspace-activity-table table) > tbody > tr > td { padding: 14px 13px; font-size: 12px; border-color: var(--table-row-border); vertical-align: middle; }
html.workspace :is(.workspace-data-table, .assessment-list-table table, .workspace-findings-table table, .client-table-scroll table, .workspace-activity-table table) > tbody > tr:last-child > td { border-bottom: 0; }
html.workspace .workspace-data-table > thead > tr > th.workspace-selection-column { width: 38px; padding-left: 12px; padding-right: 0; }
html.workspace .workspace-data-table:has(.workspace-selection-column) > tbody > tr > td:first-child:not([colspan]) { width: 38px; padding-left: 12px; padding-right: 0; }
html.workspace .workspace-data-table :is(.workspace-selection-column input, input[name="ids"]) { margin: 0; vertical-align: middle; }
html.workspace .workspace-data-table > tbody > tr > td.empty { padding: 28px 16px; color: var(--muted); }
html.workspace .workspace-assessment-table { min-width: 940px; }
html.workspace .workspace-supporting-table, html.workspace .workspace-finding-table { min-width: 680px; }
html.workspace .workspace-finding-table:has(th[data-column="assets"]) { min-width: 890px; }
html.workspace .client-user-identity { display: flex; align-items: center; gap: 10px; }
html.workspace .client-user-identity a { overflow-wrap: anywhere; font-weight: 500; }
html.workspace .client-user-avatar { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; flex: none; border: 1px solid light-dark(#e9e5f2, var(--border)); border-radius: 9px; background: light-dark(#f4f1f9, var(--surface-2)); color: light-dark(#86749e, color-mix(in srgb, #86749e 65%, white)); font-size: 12px; font-weight: 550; }
html.workspace .client-state { display: inline-flex; align-items: center; gap: 6px; align-self: center; flex: none; padding: 4px 8px; border: 1px solid light-dark(#e9e9ee, var(--border)); border-radius: 6px; background: light-dark(#f7f7f9, var(--surface-2)); color: light-dark(#73737d, var(--muted)); font-size: 11px; font-weight: 450; white-space: nowrap; }
html.workspace .client-state.is-enabled { background: light-dark(#f1f8f4, var(--surface-2)); border-color: light-dark(#dfede5, var(--border-strong)); color: light-dark(#47836a, color-mix(in srgb, #47836a 65%, white)); }

.workspace-assessment-table th[data-column="name"] { width: 34%; }
.workspace-assessment-table .steps { max-width: 105px; gap: 3px; margin-top: 7px; }
.workspace-assessment-table .steps span { height: 3px; }
.workspace-assessment-table .person { gap: 7px; font-size: 12px; }
.workspace-assessment-table .avatar.sm { width: 24px; height: 24px; font-size: 12px; }
.workspace-assessment-name { display: flex; align-items: center; gap: 11px; }
.workspace-assessment-name small { display: block; font-size: 12px; color: light-dark(#565660, var(--muted)); margin-top: 4px; }
.workspace-assessment-name .t { font-size: 12.5px; }
.workspace-project-icon { flex: none; width: 27px; height: 27px; display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--project-color) 13%, light-dark(white, var(--surface))); color: color-mix(in srgb, var(--project-color) 80%, light-dark(black, var(--text))); border-radius: 7px; border: 1px solid color-mix(in srgb, var(--project-color) 15%, light-dark(white, var(--border))); }
.workspace-project-icon svg { width: 15px; height: 15px; }
.workspace-table-date, .workspace-open-link { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; color: light-dark(#565660, var(--muted)); }
.workspace-table-date svg, .workspace-open-link svg { width: 12px; height: 12px; }
.workspace-dashboard .card > .workspace-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: light-dark(#565660, var(--muted)); font-size: 12px; margin: 0 17px 10px; padding: 12px 3px 2px; border-top: 1px solid light-dark(#f1f1f4, var(--border)); }
.workspace-card-footer > span:first-child { display: flex; align-items: center; gap: 6px; }
.workspace-overview-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 20px; }
.workspace-dashboard .card > .workspace-workload-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; margin: 1px 20px 22px; }
.workspace-workload-columns > div + div { border-left: 1px solid light-dark(#eeeef1, var(--border)); padding-left: 24px; }
.workspace-workload-columns h3 { display: flex; justify-content: space-between; font-size: 12px; font-weight: 450; color: light-dark(#565660, var(--muted)); margin: 0 0 16px; }
.workspace-workload-columns h3 > span { color: var(--text-2); }
.workspace-workload-columns .bars { padding: 0; margin: 0; }
.workspace-workload-columns .bars li { display: grid; grid-template-columns: 88px minmax(16px, 1fr) 14px; gap: 9px; margin-bottom: 15px; font-size: 12px; }
.workspace-workload-columns .bars li > span { width: auto; flex: initial; }
.workspace-workload-columns .bars .bar { height: 4px; border-radius: 4px; background: light-dark(#f1f1f4, var(--surface-3)); }
.workspace-workload-columns .bars .bar i { border-radius: 4px; opacity: .65; }
.workspace-workload-columns .bars .dot { height: 5px; width: 5px; margin-right: 7px; }
.workspace-workload-columns .bars b { font-size: 12px; font-weight: 450; color: light-dark(#565660, var(--muted)); min-width: 0; }
.workspace-dashboard .card > .workspace-queue-list { margin: 0 18px 14px; }
.workspace-queue-list > a { display: flex; align-items: center; gap: 10px; padding: 10px 0; color: light-dark(#60606a, var(--muted)); border-bottom: 1px solid light-dark(#f1f1f3, var(--border)); font-size: 12px; }
.workspace-queue-list > a:last-child { border: 0; }
.workspace-queue-list > a:hover { color: light-dark(#242428, var(--text)); text-decoration: none; }
.workspace-queue-icon { display: inline-flex; align-items: center; justify-content: center; height: 28px; width: 28px; border-radius: 7px; flex: none; }
.workspace-queue-icon svg { width: 14px; height: 14px; }
.tone-1 { color: light-dark(#bd827e, color-mix(in srgb, #bd827e 65%, white)); background: light-dark(#faf0ef, var(--surface-3)); }.tone-2 { color: light-dark(#af965d, color-mix(in srgb, #af965d 65%, white)); background: light-dark(#faf6e9, var(--surface-3)); }.tone-3 { color: light-dark(#7d95b9, color-mix(in srgb, #7d95b9 65%, white)); background: light-dark(#edf2f9, var(--surface-3)); }.tone-4 { color: light-dark(#6d9b87, color-mix(in srgb, #6d9b87 65%, white)); background: light-dark(#edf6f0, var(--surface-3)); }
.workspace-queue-list b { margin-left: auto; font-weight: 500; color: light-dark(#42424a, var(--text)); }
.workspace-queue-list > a > svg { width: 12px; height: 12px; color: light-dark(#565660, var(--muted)); margin-left: 8px; }
.workspace-dashboard .card > .workspace-all-clear { display: flex; align-items: center; gap: 12px; padding: 4px 0 8px; margin-top: 0; }
.workspace-all-clear strong { font-size: 12px; font-weight: 500; color: light-dark(#5e5e67, var(--muted)); }
.workspace-all-clear p { font-size: 12px; color: light-dark(#565660, var(--muted)); margin: 3px 0 0; }
.workspace-empty-state { text-align: center; padding: 28px 16px; }
.workspace-empty-state strong { display: block; font-weight: 500; margin-top: 12px; }
.workspace-empty-state p { margin: 6px 0 16px; color: var(--muted); font-size: 12px; }
.workspace-empty-icon { display: inline-flex; padding: 12px; background: light-dark(#f6f6f8, var(--surface-2)); border: 1px solid light-dark(#eeeef1, var(--border)); border-radius: 14px; color: light-dark(#565660, var(--muted)); }
.workspace-nav-backdrop { position: fixed; inset: 65px 0 0; width: 100%; height: calc(100dvh - 65px); z-index: 40; background: #22222835; border: 0; border-radius: 0; }
.workspace-nav-backdrop:hover { background: #22222835; }
@media (min-width: 761px) {
  html[data-sidebar-collapsed] { --side: 64px; }
  html[data-sidebar-collapsed] nav.side { width: 64px; }
}
@media (max-width: 1180px) {
  main { padding-left: 26px; padding-right: 26px; }
  .workspace-metrics { gap: 10px; }
  .workspace-metric-foot { font-size: 12px; }
  .workspace-metric-label { font-size: 12px; gap: 6px; }
  .workspace-overview-grid { grid-template-columns: 1fr; gap: 0; }
  .workspace-welcome .workspace-date { display: none; }
}
@media (max-width: 1000px) {
  .cols.stacked-columns > .stack, .cols.stacked-columns > .stack:first-child, .cols.stacked-columns.wide-first > .stack:last-child { flex: auto; width: 100%; }
  .workspace-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .workspace-metric-label { font-size: 12px; }
  .workspace-metric-foot { font-size: 12px; }
  .card:has(> table) { overflow-x: auto; }
}
@media (max-width: 760px) {
  :root { --side: 0px; }
  nav.side { position: relative; width: 100%; max-height: 55vh; margin-top: 65px; }
  html[data-navigation-enhanced] nav.side { position: fixed; top: 65px; bottom: 0; width: 224px; max-height: none; margin-top: 0; transform: translateX(-100%); }
  html[data-sidebar-open] nav.side { transform: translateX(0); }
  html[data-navigation-enhanced] nav.side .brand { display: none; }
  main { padding: 88px 18px 86px; min-width: 0; }
  .workspace-topbar { padding: 0 15px; gap: 12px; }
  .workspace-topbar-divider, .workspace-page-location > svg, .workspace-activity { display: none !important; }
  .workspace-search { width: min(190px, 43vw); }
  .workspace-page-location { font-size: 12px; overflow: hidden; text-overflow: ellipsis; }
  h1 { font-size: 21px; }
  .page-head { display: flex; flex-wrap: wrap; gap: 14px; }
  .page-head > *, .page-head > .actions, .page-head > form { display: block; width: auto; padding: 0; text-align: left; }
  .page-head > .actions > :first-child { margin-left: 0; }
  .tabs { overflow-x: auto; flex-wrap: nowrap; gap: 4px; }
  .tabs a { white-space: nowrap; }
  .workspace-workload-columns { gap: 14px !important; }
  .workspace-workload-columns > div + div { padding-left: 14px; }
  .workspace-workload-columns .bars li { grid-template-columns: 1fr 14px; gap: 6px; }
  .workspace-workload-columns .bars .bar { display: none; }
  .workspace-metrics { gap: 10px; }
  .workspace-metric-label { font-size: 12px; }
  .workspace-metric-foot { font-size: 12px; padding-left: 5px; padding-right: 5px; }
  .workspace-metric-body { padding: 10px 8px 12px; }
  .workspace-metric strong { margin-left: 30px; }
}
@media (prefers-reduced-motion: no-preference) {
  .workspace-dashboard > .page-head, .workspace-metrics, .workspace-assessments { animation: workspace-enter .22s ease both; }
  .workspace-metrics { animation-delay: .02s; }.workspace-assessments { animation-delay: .04s; }
  @keyframes workspace-enter { from { opacity: .65; transform: translateY(2px); } to { opacity: 1; transform: translateY(0); } }
}
@media print { .workspace-topbar, .workspace-nav-backdrop { display: none; } main { padding-top: 20px; } }
/* Fine vertical ticks echo the reference's quiet card-edge detail. */
.workspace-assessments::after { content: ""; display: block; height: 7px; margin: 0 17px 8px; background: repeating-linear-gradient(90deg, light-dark(#d9d9df, var(--surface-3)) 0 1px, transparent 1px 5px); opacity: .4; mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
@media (prefers-reduced-motion: no-preference) {
  nav.side { transition: width .18s ease, transform .18s ease; }
  nav.side .group a, .workspace-queue-list > a, tbody tr td { transition: background .16s ease, color .16s ease; }
  .workspace-topbar { transition: left .18s ease; }
  main { transition: margin-left .18s ease; }
  main > .page-head, main > .kpis, main > .card, main > .cols,
  .workspace-overview-grid, .workspace-reports { animation: workspace-enter .24s cubic-bezier(.2,.7,.2,1) both; }
  .workspace-overview-grid { animation-delay: .05s; }.workspace-reports { animation-delay: .065s; }
  dialog.modal[open] { animation: workspace-dialog-enter .18s ease-out; }
  @keyframes workspace-dialog-enter { from { opacity: .7; transform: translateY(2px); } to { opacity: 1; transform: none; } }
  @keyframes workspace-account-menu-in { from { opacity: 0; transform: translateY(-4px) scale(.985); } to { opacity: 1; transform: none; } }
}
@media (prefers-reduced-motion: reduce) { nav.side .foot details[open] > .group { animation: none; } }
/* Fold inside the left navigation; desktop collapse keeps a usable icon rail. */
.workspace-sidebar-toggle.btn { position: absolute; right: 12px; top: 18px; z-index: 2; }
.workspace-mobile-nav-toggle.btn { display: none; }
nav.side .brand { padding-right: 44px; }
.btn.primary:hover, button.primary:hover { background: linear-gradient(var(--primary-hover), light-dark(#303035, var(--primary))); border-color: light-dark(#3b3b40, var(--border-strong)); color: white; }
.workspace-nav-tooltip[hidden] { display: none; }
.workspace-nav-tooltip { position: fixed; z-index: 80; pointer-events: none; padding: 7px 10px; border-radius: 7px; background: #2c2c32; color: #fff; box-shadow: 0 3px 12px #18181b16; font-size: 12px; line-height: 16px; white-space: nowrap; }
nav.workspace-nav-flyout { position: fixed; inset: auto; z-index: 85; min-width: 200px; max-width: 260px; margin: 0; padding: 7px; border: 1px solid light-dark(#e5e5eb, var(--border)); border-radius: 10px; background: light-dark(white, var(--surface)); box-shadow: 0 7px 26px #18181b14; color: light-dark(#5c5c68, var(--muted)); }
.workspace-nav-flyout::backdrop { background: transparent; }
.workspace-nav-flyout > strong { display: block; padding: 7px 10px 9px; font-size: 12px; font-weight: 500; color: light-dark(#565660, var(--muted)); }
.workspace-nav-flyout > a, .workspace-nav-flyout form button.link { display: flex; align-items: center; gap: 9px; width: 100%; padding: 9px 10px; font-size: 13px; font-weight: 450; color: light-dark(#555560, var(--muted)); border-radius: 6px; text-decoration: none; }
.workspace-nav-flyout > a:hover, .workspace-nav-flyout > a.active, .workspace-nav-flyout form button.link:hover { background: light-dark(#f3f3f6, var(--surface-2)); color: light-dark(#27272f, var(--text)); }
.workspace-nav-flyout form { margin: 0; }
.workspace-nav-flyout svg { width: 15px; height: 15px; }
@media (min-width: 761px) {
  html[data-sidebar-collapsed] nav.side .brand { visibility: hidden; }
  html[data-sidebar-collapsed] .workspace-sidebar-toggle.btn { right: 18px; }
  html[data-sidebar-collapsed] nav.side .group { margin: 0; padding: 5px 10px; }
  html[data-sidebar-collapsed] nav.side .group .label,
  html[data-sidebar-collapsed] nav.side .group:has(> .label:only-child) { display: none; }
  html[data-sidebar-collapsed] nav.side .group a,
  html[data-sidebar-collapsed] nav.side details.settings > summary { justify-content: center; gap: 0; width: 40px; height: 38px; padding: 0; margin: 2px 0; font-size: 0; line-height: 0; }
  html[data-sidebar-collapsed] nav.side .group a svg,
  html[data-sidebar-collapsed] nav.side details.settings > summary svg { width: 17px; height: 17px; }
  html[data-sidebar-collapsed] nav.side details.settings > summary .chev,
  html[data-sidebar-collapsed] nav.side details.settings > a { display: none; }
  html[data-sidebar-collapsed] nav.side .foot { margin: auto 10px 0; padding: 14px 0 0; }
  html[data-sidebar-collapsed] nav.side .foot summary { justify-content: center; }
  html[data-sidebar-collapsed] nav.side .foot .who,
  html[data-sidebar-collapsed] nav.side .foot .workspace-account-chevron,
  html[data-sidebar-collapsed] nav.side .foot .group { display: none; }
  html[data-sidebar-collapsed] nav.side .foot .avatar { width: 29px; height: 29px; }
}
@media (max-width: 760px) {
  .workspace-sidebar-toggle.btn { display: none; }
  .workspace-mobile-nav-toggle.btn { display: inline-flex; }
}
@media (prefers-reduced-motion: no-preference) {
  .workspace-nav-tooltip, .workspace-nav-flyout:popover-open { animation: workspace-enter .12s ease-out; }
}

@media (max-width: 480px) { .workspace-page-location { display: none; } }

/* Breadcrumbs share the top bar; narrow screens give the trail its own row. */
.workspace-breadcrumbs { display: flex; align-items: center; gap: 9px; min-width: 0; font-size: inherit; white-space: nowrap; color: var(--muted); }
.workspace-breadcrumbs a { color: var(--muted); }
.workspace-breadcrumbs a:hover { color: var(--text); }
.workspace-breadcrumbs [aria-current] { color: var(--text-2); font-weight: 500; }
.workspace-breadcrumbs > span[aria-hidden] { color: light-dark(#73737c, var(--muted)); }
@media (max-width: 1100px) {
  .workspace-topbar:has(.workspace-breadcrumbs) .workspace-page-location { display: flex; position: absolute; top: 64px; left: 0; right: 0; height: 36px; padding: 0 18px; background: light-dark(#fff, var(--surface)); border-bottom: 1px solid light-dark(#e9e9ec, var(--border)); overflow-x: auto; }
  body:has(.workspace-breadcrumbs) main { padding-top: 126px; }
  .workspace-breadcrumbs { gap: 7px; font-size: 12px; }
}

/* Team column and group headings use one square, consistent header treatment. */
.assessment-team th { border-radius: 0; background: light-dark(#f5f5f6, var(--surface-2)); color: light-dark(#565660, var(--muted)); font-size: 12px; font-weight: 450; text-transform: none; letter-spacing: 0; padding: 13px 18px; }
.assessment-team th:first-child { padding-left: 20px; border-radius: 0; }
.assessment-team th:last-child { border-radius: 0; }