/* Self-hosted Inter (OFL) — body/UI font, pixel-identical across all OSes.
   Two subsets: latin + latin-ext (latin-ext covers cs/pl/etc. diacritics). */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('assets/fonts/inter-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('assets/fonts/inter-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root {
  /* App is intentionally light-only (warm editorial palette). Declaring the scheme
     stops OS dark mode from inverting native inputs, selects, date pickers and
     scrollbars into a dark theme that clashes with the paper background. */
  color-scheme: light;
  /* Keyboard-focused elements scroll clear of the sticky top bar (WCAG 2.2 SC 2.4.11,
     Focus Not Obscured) rather than hiding beneath it. */
  scroll-padding-top: 84px;
  --ink: #111111;
  --muted: #625d52;
  --paper: #f8f7f3;
  --panel: #ffffff;
  --line: #d9d4c7;
  --line-strong: #b8b09f;
  --green: #27745f;
  --green-soft: #e5f3ed;
  --red: #b44642;
  --red-soft: #fae9e7;
  --amber: #ad741c;
  --amber-soft: #fbefd9;
  /* K1: the legacy pre-K1 blue is retired. --blue/--blue-soft now resolve to the
     brand teal so every remaining link/info use reads on-palette; neutral chips
     (planned / low-priority) use --slate so they don't borrow the teal accent. */
  --blue: #12a594;
  --blue-soft: #e3f3f0;
  --slate: #5b615e;
  --slate-soft: #ecefe9;
  /* --accent / --teal were never defined and fell back to blue #1d6fb8 wherever
     used (work-card focus rings, planned-card border, qms-starter). Pin to teal. */
  --accent: #12a594;
  --teal: #12a594;
  --violet: #6d5c91;
  --gold: #c79a32;
  --soft: #eee9dd;
  --shadow: 0 16px 40px rgba(23, 32, 42, 0.08);
  --font-display: "Avenir Next", "Avenir Next World", Avenir, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  line-height: 1.45;
}

button,
input,
select,
textarea {
  font: inherit;
}

/* Field values read at regular weight — `font: inherit` otherwise pulls the
   wrapping label's weight into the value text, making inputs look heavy. */
input,
select,
textarea {
  font-weight: 400;
}

button {
  min-height: 38px;
  border: 1px solid var(--ink);
  border-radius: 6px;
  background: var(--ink);
  color: #fff;
  padding: 8px 13px;
  font-weight: 580;
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    background-color 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.12s ease,
    filter 0.18s ease;
}

button:hover {
  filter: brightness(1.06);
}

button.secondary {
  background: #fff;
  color: var(--ink);
  border-color: var(--line-strong);
}

button.secondary:hover,
button.secondary:focus-visible {
  background: rgba(199, 154, 50, 0.96);
  border-color: rgba(199, 154, 50, 0.88);
  color: #111111;
  box-shadow:
    0 0 0 1px rgba(199, 154, 50, 0.22),
    0 0 22px rgba(199, 154, 50, 0.14);
  outline: none;
}

button.secondary:active {
  background: rgba(199, 154, 50, 0.96);
  border-color: #c79a32;
  color: #111111;
  box-shadow:
    0 0 0 1px rgba(199, 154, 50, 0.3),
    0 0 24px rgba(199, 154, 50, 0.18);
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  margin-bottom: 0;
  font-size: 25px;
}

h2 {
  margin-bottom: 6px;
  font-size: 25px;
}

h3 {
  margin-bottom: 8px;
  font-size: 17px;
}

/* Large brand headlines (page titles, wordmark) — heavier Avenir Next display
   face for KAT visual identity; falls back to Inter off-Mac. */
h1,
h2 {
  font-family: var(--font-display);
  font-weight: 700;
}

.muted {
  margin-bottom: 0;
  color: var(--muted);
}

.eyebrow,
.label {
  margin: 0 0 5px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 680;
  letter-spacing: 0;
  text-transform: uppercase;
}

.topbar {
  min-height: 78px;
  padding: 14px 24px;
  background: rgba(248, 247, 243, 0.96);
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  position: sticky;
  top: 0;
  z-index: 10;
}

.brand,
.customer-bar {
  display: flex;
  align-items: center;
  gap: 12px;
}

.brand {
  gap: 0;
}

.brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.brand-product-name {
  margin: 0;
  color: var(--ink);
  font-size: 28px;
  font-weight: 700;
  line-height: 0.96;
  font-family: var(--font-display);
}

.brand-product-name .tm {
  margin-left: 0.08em;
  font-size: 0.24em;
  vertical-align: super;
  letter-spacing: 0;
  font-weight: 620;
}

.brand-home { cursor: pointer; border-radius: 6px; transition: opacity .12s ease; }
.brand-home:hover { opacity: .82; }
.brand-home:focus-visible { outline: 2px solid var(--accent, #c99a3a); outline-offset: 3px; }
.yistiva-mark {
  display: inline-block;
  font: inherit;
  line-height: inherit;
  letter-spacing: 0;
  white-space: nowrap;
}

.yistiva-mark .brand-initial {
  color: #c79a32;
}

.yistiva-mark .brand-rest {
  color: currentColor;
}

.brand-endorsement {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding-bottom: 0;
}

.brand-from {
  color: var(--muted);
  font-size: 10px;
  font-weight: 620;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1;
}

.powered-by-link {
  display: inline-flex;
  align-items: flex-end;
  gap: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 580;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
}

.powered-by-link:hover,
.powered-by-link:focus-visible {
  color: var(--ink);
  outline: none;
}

.kat-logo {
  width: auto;
  height: 18px;
  flex: 0 0 auto;
}

.powered-by-link img {
  display: block;
  background: transparent !important;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.customer-bar {
  justify-content: flex-end;
  color: var(--muted);
  font-size: 14px;
}

.customer-bar strong,
.customer-bar span {
  display: block;
  text-align: right;
}

.customer-bar strong {
  color: var(--ink);
}

.shell {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  min-height: calc(100vh - 78px);
}

.sidebar {
  padding: 18px;
  border-right: 1px solid var(--line);
  background: #f9fbfc;
}

.workspace-card,
.quick-tools {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.workspace-card strong,
.workspace-card span {
  display: block;
}

.workspace-card span {
  color: var(--muted);
  font-size: 13px;
  margin-top: 4px;
}

.nav {
  display: grid;
  gap: 6px;
  padding: 16px 0;
}

.nav button {
  width: 100%;
  text-align: left;
  background: transparent;
  color: var(--ink);
  border-color: transparent;
}

.nav button.active {
  background: var(--ink);
  color: #fff;
  border-color: var(--ink);
}

.quick-tools input {
  width: 100%;
  margin-bottom: 10px;
}

.setup-demo-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 18px;
  padding: 14px 16px;
  border: 1px solid rgba(229, 211, 160, 0.28);
  border-radius: 10px;
  background: rgba(3, 13, 13, 0.64);
  color: rgba(249, 248, 244, 0.9);
}

.setup-demo-tools .label,
.setup-demo-tools strong {
  display: block;
}

.setup-demo-tools strong {
  margin-top: 4px;
  color: #fff;
}

.setup-demo-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.setup-demo-actions input {
  width: auto;
  max-width: 220px;
  margin: 0;
  color: rgba(249, 248, 244, 0.92);
}

.demo-scenario-control {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: rgba(247, 243, 232, 0.72);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.demo-scenario-control select {
  min-height: 38px;
  min-width: 132px;
  border-color: rgba(229, 211, 160, 0.34);
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}

/* Styled CSV import control: hide the native file input, present its label as a button. */
.csv-import-control {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 13px;
  border: 1px solid rgba(229, 211, 160, 0.34);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  font-weight: 580;
  cursor: pointer;
}

.csv-import-control input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.setup-action-status {
  flex-basis: 100%;
  margin: 8px 0 0;
  font-size: 12px;
  font-weight: 560;
  color: rgba(247, 243, 232, 0.78);
}

.setup-action-status.is-error {
  color: var(--red);
}

.workspace {
  padding: 24px;
  overflow: hidden;
}

.page {
  display: none;
}

.page.active {
  display: block;
}

.landing {
  min-height: 260px;
  padding: 28px;
  margin-bottom: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(23, 32, 42, 0.88), rgba(23, 32, 42, 0.58)),
    url("assets/kat-qa-hero-replaced-core.webp");
  background-size: cover;
  background-position: center;
  color: #fff;
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  align-content: end;
}

.landing h2 {
  max-width: 680px;
  font-size: 30px;
  line-height: 1.18;
}

.landing .muted {
  max-width: 680px;
  color: rgba(255, 255, 255, 0.84);
}

.landing .eyebrow {
  color: #9fd0ec;
}

.landing-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.landing-actions .secondary {
  border-color: rgba(255, 255, 255, 0.72);
}

.scene-page .page-head,
#home.scene-page .landing {
  --scene-image: none;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  color: #f8f7f3;
  border: 1px solid rgba(199, 154, 50, 0.26);
  border-radius: 12px;
  background: #070a0d;
  box-shadow: 0 24px 56px rgba(16, 22, 29, 0.18);
}

.scene-page .page-head::before,
#home.scene-page .landing::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(3, 6, 7, 0.93) 0%, rgba(3, 6, 7, 0.8) 38%, rgba(3, 6, 7, 0.42) 100%),
    var(--scene-image) center / cover no-repeat;
}

.scene-page .page-head::after,
#home.scene-page .landing::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.03), transparent 24%),
    radial-gradient(circle at 18% 22%, rgba(39, 116, 95, 0.18), transparent 32%),
    radial-gradient(circle at 76% 18%, rgba(199, 154, 50, 0.16), transparent 26%);
  pointer-events: none;
}

.scene-page .page-head > *,
#home.scene-page .landing > * {
  position: relative;
  z-index: 1;
}

.scene-page .page-head {
  min-height: clamp(232px, 34vh, 320px);
  padding: clamp(24px, 3vw, 34px);
  margin-bottom: 18px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 18px;
}

#home.scene-page .landing {
  min-height: clamp(260px, 38vh, 340px);
  padding: clamp(24px, 3vw, 34px);
  margin-bottom: 18px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  align-content: end;
  gap: 18px;
}

.scene-page .page-head h2,
#home.scene-page .landing h2 {
  max-width: 820px;
  margin-bottom: 8px;
  color: #fff;
  font-size: clamp(34px, 4.8vw, 64px);
  line-height: 0.96;
}

.scene-page .page-head.module-hero,
#home.scene-page .landing.module-hero {
  min-height: clamp(148px, 22vh, 190px);
}

.scene-page .page-head.module-hero h2,
#home.scene-page .landing.module-hero h2 {
  margin-bottom: 0;
  font-size: clamp(32px, 4vw, 52px);
}

.scene-page .page-head .eyebrow,
#home.scene-page .landing .eyebrow {
  color: #9fd0ec;
}

.scene-page .page-head .muted,
#home.scene-page .landing .muted {
  max-width: 760px;
  color: rgba(248, 247, 243, 0.82);
}

.scene-page .page-head .toolbar,
#home.scene-page .landing .landing-actions {
  align-items: flex-end;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.scene-page .page-head button,
#home.scene-page .landing button {
  min-height: 42px;
  border-radius: 8px;
  font-weight: 600;
}

.scene-page .page-head button.secondary,
#home.scene-page .landing button.secondary {
  background: rgba(255, 255, 255, 0.96);
  color: #111111;
  border-color: rgba(255, 255, 255, 0.82);
}

.scene-page .page-head button:not(.secondary),
#home.scene-page .landing button:not(.secondary) {
  background: rgba(248, 247, 243, 0.96);
  color: #111111;
  border-color: rgba(255, 255, 255, 0.84);
}

.scene-page .page-head .search {
  min-width: 190px;
  color: rgba(248, 247, 243, 0.82);
}

.scene-page .page-head .search input,
.scene-page .page-head .search select {
  background: rgba(8, 12, 14, 0.78);
  color: #f8f7f3;
  border-color: rgba(255, 255, 255, 0.22);
}

.scene-page .page-head .search input::placeholder {
  color: rgba(248, 247, 243, 0.48);
}

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

#home .landing {
  --scene-image: url("assets/yistiva-scene-program.png");
}

#subscription .page-head {
  --scene-image: url("assets/yistiva-scene-subscription.png");
}

#release .page-head {
  --scene-image: url("assets/yistiva-scene-rules.png");
}

#entry .page-head {
  --scene-image: url("assets/yistiva-scene-entry.png");
}

#run .page-head {
  --scene-image: url("assets/yistiva-scene-run.png");
}

#analytics .page-head {
  --scene-image: url("assets/yistiva-scene-analytics.png");
}

#comparison .page-head {
  --scene-image: url("assets/yistiva-scene-reports.png");
}

#profile .page-head {
  --scene-image: url("assets/yistiva-scene-program.png");
}

#people .page-head {
  --scene-image: url("assets/yistiva-scene-manual.png");
}

#access .page-head {
  --scene-image: url("assets/yistiva-scene-database.png");
}

#calendar .page-head {
  --scene-image: url("assets/yistiva-scene-run.png");
}

#shipping .page-head {
  --scene-image: url("assets/yistiva-scene-subscription.png");
}

#schedule .page-head {
  --scene-image: url("assets/yistiva-scene-method.png");
}

#method .page-head {
  --scene-image: url("assets/yistiva-scene-method.png");
}

#rules .page-head {
  --scene-image: url("assets/yistiva-scene-rules.png");
}

#reports .page-head {
  --scene-image: url("assets/yistiva-scene-reports.png");
}

#database .page-head {
  --scene-image: url("assets/yistiva-scene-database.png");
}

#audit .page-head {
  --scene-image: url("assets/yistiva-scene-audit.png");
}

#manual .page-head {
  --scene-image: url("assets/yistiva-scene-manual.png");
}

/* Lab-photo header treatment extended to the remaining module pages so no header
   is a plain black band. Each page maps to the closest-fitting scene photo from the
   asset library; the ::before overlay/gradient keeps the white title legible. */
#command .page-head {
  --scene-image: url("assets/yistiva-scene-dashboard.png");
}

#tasks .page-head {
  --scene-image: url("assets/yistiva-qa-directory-lab.png");
}

#assignments .page-head {
  --scene-image: url("assets/yistiva-directory-lab.png");
}

#capacity .page-head {
  --scene-image: url("assets/yistiva-scene-analytics.png");
}

#scheduleSetup .page-head {
  --scene-image: url("assets/yistiva-scene-method.png");
}

#capture .page-head {
  --scene-image: url("assets/yistiva-scene-entry.png");
}

#chemicals .page-head {
  --scene-image: url("assets/yistiva-scene-database.png");
}

#coa .page-head,
#reportRoom .page-head,
#ranking .page-head {
  --scene-image: url("assets/yistiva-scene-reports.png");
}

#subscription .page-head,
#enterprise .page-head,
#account .page-head {
  --scene-image: url("assets/yistiva-scene-subscription.png");
}

#eqms .page-head,
#qms .page-head,
#resources .page-head,
#training .page-head {
  --scene-image: url("assets/yistiva-scene-manual.png");
}

#equipment .page-head {
  --scene-image: url("assets/yistiva-scene-run.png");
}

#explore .page-head,
#genealogy .page-head,
#inventory .page-head,
#labData .page-head,
#admin .page-head {
  --scene-image: url("assets/yistiva-scene-database.png");
}

#grading .page-head,
#kpis .page-head {
  --scene-image: url("assets/yistiva-scene-analytics.png");
}

#jobs .page-head {
  --scene-image: url("assets/yistiva-scene-run.png");
}

.program-grid,
.method-grid,
.schema-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.program-grid article,
.method-card,
.schema-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
}

.program-grid span,
.method-card span,
.schema-card span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.program-grid strong,
.method-card strong,
.schema-card strong {
  display: block;
  margin: 5px 0;
}

.program-grid p,
.method-card p,
.schema-card p {
  color: var(--muted);
  font-size: 13px;
  margin-bottom: 0;
}

.method-card {
  display: grid;
  gap: 8px;
}

.method-card.active {
  border-color: var(--blue);
  box-shadow: inset 0 0 0 1px var(--blue);
}

.method-card.locked,
.locked-row {
  opacity: 0.55;
  background: #eef2f5;
}

.active-row {
  background: var(--green-soft);
}

.addon-row {
  background: var(--blue-soft);
}

.method-card button {
  justify-self: start;
}

.test-status-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));
  gap: 10px;
}

.test-tile,
.plan-item {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.test-tile {
  display: grid;
  gap: 10px;
  padding: 14px;
}

.test-tile.ok {
  border-color: #9ccab8;
}

.test-tile.review {
  border-color: #e2bf80;
}

.test-tile.hold {
  border-color: #e5aaa5;
}

.test-tile > span,
.plan-item span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.test-tile p,
.plan-item p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.tile-title,
.tile-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.tile-title strong {
  font-size: 18px;
}

.tile-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.tile-metrics span {
  min-height: 28px;
  border-radius: 6px;
  background: #edf2f6;
  color: #334251;
  padding: 5px 7px;
  font-size: 12px;
  font-weight: 580;
}

.tile-actions {
  justify-content: flex-start;
  flex-wrap: wrap;
}

.plan-list {
  display: grid;
  gap: 10px;
}

.plan-item {
  border-left-width: 5px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 12px;
}

.plan-item.due {
  border-left-color: var(--blue);
}

.plan-item.done {
  border-left-color: var(--green);
}

.plan-item.missing {
  border-left-color: var(--amber);
}

.plan-item.hold {
  border-left-color: var(--red);
}

.coverage-list,
.flow-list {
  display: grid;
  gap: 10px;
}

.coverage-list div,
.flow-list div {
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.coverage-list div:last-child,
.flow-list div:last-child {
  border-bottom: 0;
}

.coverage-list strong,
.coverage-list span,
.flow-list strong,
.flow-list span {
  display: block;
}

.coverage-list span,
.flow-list span {
  color: var(--muted);
  font-size: 13px;
  margin-top: 3px;
}

.page-head,
.panel-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 18px;
}

.toolbar,
.form-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.status-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.dashboard-verdict {
  margin-bottom: 10px;
}

.dashboard-compact-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(23, 32, 42, 0.04);
}

.dashboard-compact-band.ok {
  border-color: rgba(92, 170, 123, 0.42);
  background: linear-gradient(180deg, rgba(230, 246, 236, 0.68), #ffffff 70%);
}

.dashboard-compact-band.review {
  border-color: rgba(199, 154, 50, 0.48);
  background: linear-gradient(180deg, rgba(255, 246, 225, 0.78), #ffffff 70%);
}

.dashboard-compact-band.hold {
  border-color: rgba(203, 96, 96, 0.42);
  background: linear-gradient(180deg, rgba(255, 236, 234, 0.82), #ffffff 70%);
}

.dashboard-compact-label {
  color: var(--ink);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.dashboard-compact-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.dashboard-compact-copy strong {
  color: var(--ink);
  font-size: 21px;
  line-height: 1.08;
}

.dashboard-compact-copy p {
  margin: 0;
  color: #556476;
  font-size: 13px;
  line-height: 1.28;
}

.dashboard-compact-stats {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.dashboard-compact-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 11px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.9);
  color: var(--ink);
  font-size: 12px;
  font-weight: 620;
}

.dashboard-compact-pill.ok {
  color: #2f8751;
}

.dashboard-compact-pill.review {
  color: #a97515;
}

.dashboard-compact-pill.hold {
  color: #b14444;
}

.dashboard-verdict-band {
  display: grid;
  grid-template-columns: minmax(0, 1.24fr) minmax(240px, 0.76fr);
  gap: 16px;
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  box-shadow: 0 16px 36px rgba(23, 32, 42, 0.06);
}

.dashboard-verdict-band.ok {
  border-color: #9ccab8;
  background: linear-gradient(135deg, rgba(214, 244, 230, 0.7), #ffffff 62%);
}

.dashboard-verdict-band.review {
  border-color: #e2bf80;
  background: linear-gradient(135deg, rgba(255, 244, 219, 0.76), #ffffff 62%);
}

.dashboard-verdict-band.hold {
  border-color: #e5aaa5;
  background: linear-gradient(135deg, rgba(255, 232, 230, 0.78), #ffffff 62%);
}

.dashboard-verdict-main strong {
  display: block;
  margin-top: 4px;
  color: var(--ink);
  font-size: clamp(28px, 3vw, 42px);
  line-height: 0.98;
}

.dashboard-verdict-main p {
  max-width: 720px;
  margin: 10px 0 0;
  color: #425466;
  font-size: 15px;
  line-height: 1.45;
}

.dashboard-kicker {
  display: block;
  color: #406f92;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.dashboard-driver-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-top: 14px;
}

.dashboard-driver-list span {
  position: relative;
  padding-left: 12px;
  color: #566577;
  font-size: 13px;
  font-weight: 580;
}

.dashboard-driver-list span::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.5em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--gold);
  transform: translateY(-50%);
}

.dashboard-verdict-meta {
  display: grid;
  gap: 10px;
  align-content: start;
}

.dashboard-verdict-meta div {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.7);
}

.dashboard-verdict-meta span,
.dashboard-summary-button span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.dashboard-verdict-meta strong,
.dashboard-summary-button strong {
  display: block;
  margin-top: 4px;
  color: var(--ink);
}

.dashboard-verdict-meta strong {
  font-size: 18px;
}

.dashboard-summary-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.dashboard-summary-stat {
  min-height: 86px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  display: grid;
  gap: 4px;
  box-shadow: 0 10px 24px rgba(23, 32, 42, 0.04);
}

.dashboard-summary-stat.ok {
  border-color: rgba(92, 170, 123, 0.42);
}

.dashboard-summary-stat.review {
  border-color: rgba(199, 154, 50, 0.48);
}

.dashboard-summary-stat.hold {
  border-color: rgba(203, 96, 96, 0.42);
}

.dashboard-summary-stat span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.dashboard-summary-stat strong {
  display: block;
  color: var(--ink);
  font-size: 26px;
  line-height: 1;
}

.dashboard-summary-stat small {
  color: #6a7785;
  font-size: 12px;
  line-height: 1.35;
}

.dashboard-summary-button {
  min-height: 86px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  text-align: left;
  display: grid;
  gap: 4px;
  box-shadow: 0 10px 24px rgba(23, 32, 42, 0.04);
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, background-color 160ms ease;
}

.dashboard-summary-button strong {
  font-size: 26px;
  line-height: 1;
}

.dashboard-summary-button small {
  color: #6a7785;
  font-size: 12px;
  line-height: 1.35;
}

.dashboard-summary-button:hover,
.dashboard-summary-button:focus-visible {
  border-color: rgba(199, 154, 50, 0.9);
  outline: none;
  transform: translateY(-1px);
  box-shadow:
    0 0 0 1px rgba(199, 154, 50, 0.18),
    0 14px 30px rgba(23, 32, 42, 0.08);
}

.dashboard-summary-button.active {
  border-color: rgba(199, 154, 50, 0.94);
  background: linear-gradient(180deg, rgba(255, 249, 236, 0.9), #ffffff);
  box-shadow:
    0 0 0 1px rgba(199, 154, 50, 0.18),
    0 14px 30px rgba(23, 32, 42, 0.08);
}

.dashboard-worklist-panel {
  margin-bottom: 0;
}

.dashboard-readiness-panel {
  padding: 12px;
  margin-bottom: 0;
}

.dashboard-readiness-head {
  align-items: center;
  margin-bottom: 14px;
}

.dashboard-readiness-head[hidden] {
  display: none;
}

.dashboard-legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.dashboard-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.9);
  color: var(--ink);
  font-size: 12px;
  font-weight: 580;
}

.dashboard-legend-item::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
}

.dashboard-legend-item.ok {
  color: #2f8751;
}

.dashboard-legend-item.review {
  color: #a97515;
}

.dashboard-legend-item.hold {
  color: #b14444;
}

.dashboard-method-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(176px, 1fr));
  gap: 10px;
}

.dashboard-method-card {
  display: grid;
  gap: 6px;
  min-height: 126px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 14px 30px rgba(23, 32, 42, 0.05);
}

.dashboard-method-card.ok {
  border-color: rgba(92, 170, 123, 0.4);
  background: linear-gradient(180deg, rgba(230, 246, 236, 0.62), #ffffff 48%);
}

.dashboard-method-card.review {
  border-color: rgba(199, 154, 50, 0.48);
  background: linear-gradient(180deg, rgba(255, 246, 225, 0.72), #ffffff 48%);
}

.dashboard-method-card.hold {
  border-color: rgba(203, 96, 96, 0.42);
  background: linear-gradient(180deg, rgba(255, 236, 234, 0.78), #ffffff 48%);
}

.dashboard-method-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.dashboard-method-top strong {
  color: var(--ink);
  font-size: 18px;
  line-height: 1.06;
}

.dashboard-method-decision {
  margin: 0;
  color: var(--ink);
  font-size: 16px;
  font-weight: 580;
  line-height: 1.18;
}

.dashboard-method-notes {
  display: grid;
  gap: 3px;
}

.dashboard-method-notes span {
  color: #556476;
  font-size: 11.5px;
  font-weight: 580;
  line-height: 1.28;
}

.dashboard-method-assets {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
}

.dashboard-method-assets span {
  padding: 3px 7px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 650;
  line-height: 1.15;
}

.dashboard-method-assets span.hold {
  background: rgba(203, 96, 96, 0.14);
  color: #9b3f3f;
}

.dashboard-method-assets span.review {
  background: rgba(199, 154, 50, 0.16);
  color: #7b5918;
}

.dashboard-method-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: auto;
}

.dashboard-method-actions .mini-button {
  min-height: 30px;
  padding: 0 10px;
  font-size: 12px;
}

.dashboard-worklist-head {
  margin-bottom: 12px;
}

.dashboard-worklist-head p:last-child {
  margin-bottom: 0;
  color: var(--muted);
}

.dashboard-table-wrap {
  max-height: 520px;
  overflow: auto;
}

.release-focus-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(194, 153, 59, 0.32);
  border-radius: 14px;
  background: rgba(194, 153, 59, 0.08);
}

.release-focus-bar strong {
  font-size: 15px;
  color: var(--ink-strong);
}

.release-focus-bar span {
  color: var(--ink-muted);
  font-size: 13px;
}

.dashboard-worklist-table {
  min-width: 1120px;
}

.dashboard-worklist-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
}

.dashboard-row.hold td:first-child {
  box-shadow: inset 4px 0 0 var(--red);
}

.dashboard-row.review td:first-child {
  box-shadow: inset 4px 0 0 var(--amber);
}

.dashboard-row.due td:first-child {
  box-shadow: inset 4px 0 0 var(--blue);
}

.dashboard-row.ok td:first-child {
  box-shadow: inset 4px 0 0 var(--green);
}

.dashboard-cell-stack {
  display: grid;
  gap: 3px;
}

.dashboard-cell-stack strong {
  color: var(--ink);
  font-size: 14px;
}

.dashboard-cell-stack small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.dashboard-signal-cell {
  min-width: 260px;
  color: #4d5b6a;
  font-size: 13px;
  line-height: 1.42;
}

.dashboard-signal-stack {
  display: grid;
  gap: 5px;
}

.dashboard-signal-stack span {
  color: #4d5b6a;
}

.dashboard-signal-stack .dashboard-signal-lead {
  color: var(--ink);
  font-weight: 560;
}

.dashboard-action-group {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.access-inline-actions {
  flex-wrap: nowrap;
  white-space: nowrap;
}

.dashboard-empty-state {
  display: grid;
  gap: 4px;
  padding: 16px 18px;
}

.dashboard-empty-state strong {
  color: var(--ink);
}

.dashboard-empty-state span {
  color: var(--muted);
  font-size: 13px;
}

.demo-guide {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  margin-bottom: 16px;
  padding: 16px;
  border: 1px solid var(--line);
  border-left: 7px solid var(--gold);
  border-radius: 8px;
  background: #fff;
}

.demo-guide h3 {
  margin-bottom: 4px;
}

.demo-guide p:last-child {
  margin-bottom: 0;
  color: var(--muted);
}

.demo-steps {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  min-width: 320px;
}

.status-card,
.metric-grid article,
.panel,
.chart-panel,
.report-body,
.rules-list article,
.note-grid article {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 12px 28px rgba(23, 32, 42, 0.06);
}

.status-card {
  padding: 13px;
  min-height: 82px;
}

.status-card strong,
.metric-grid strong,
.note-grid strong {
  display: block;
  margin-top: 5px;
}

.status-card span,
.metric-grid span,
.note-grid span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 570;
}

.status-card.ok {
  border-color: #9ccab8;
  background: var(--green-soft);
}

.status-card.review {
  border-color: #e2bf80;
  background: var(--amber-soft);
}

.status-card.hold {
  border-color: #e5aaa5;
  background: var(--red-soft);
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.metric-grid article {
  padding: 14px;
}

.metric-grid strong {
  font-size: 25px;
}

.chart-panel,
.panel,
.report-body {
  padding: 16px;
  margin-bottom: 16px;
}

.chart-panel.wide {
  margin-bottom: 16px;
}

.chart-frame {
  position: relative;
  width: 100%;
  height: 340px;
  min-height: 340px;
  max-height: 340px;
  overflow: hidden;
  border: 1px solid var(--line);
  background: #fff;
}

.chart-panel.wide .chart-frame {
  height: 430px;
  min-height: 430px;
  max-height: 430px;
}

canvas {
  display: block;
}

.chart-frame canvas {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
  max-height: 100%;
}

button:disabled,
input:disabled,
select:disabled {
  opacity: 0.58;
  cursor: not-allowed;
}

.two-col {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
}

.subscription-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.36fr);
  gap: 16px;
  align-items: start;
}

.subscription-stage {
  margin-bottom: 16px;
}

.subscription-scope-head {
  align-items: center;
  gap: 16px;
}

.subscription-scope-actions,
.subscription-order-actions {
  flex-wrap: wrap;
}

.subscription-legal-list {
  margin-top: 14px;
}

.subscription-legal-list .detail-flow-list {
  margin-top: 0;
}

.subscription-terms-preview {
  max-height: 220px;
  overflow: auto;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.02);
}

.quote-card {
  position: sticky;
  top: 96px;
}

.quote-note {
  margin-top: 10px;
}

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

.segmented {
  display: inline-flex;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  overflow: hidden;
  background: #fff;
}

.segmented button {
  border: 0;
  border-right: 1px solid var(--line-strong);
  border-radius: 0;
  background: #fff;
  color: var(--ink);
}

.segmented button:last-child {
  border-right: 0;
}

.segmented button.active {
  background: var(--ink);
  color: #fff;
}

.detail-overview-band {
  margin-bottom: 16px;
}

.detail-verdict-band {
  align-items: stretch;
}

.detail-hero-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.detail-hero-facts div {
  padding: 12px 14px;
  border: 1px solid rgba(23, 32, 42, 0.08);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.66);
}

.detail-hero-facts span,
.detail-hero-facts strong {
  display: block;
}

.detail-hero-facts span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.detail-hero-facts strong {
  margin-top: 5px;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.35;
}

.detail-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

.detail-threshold-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.threshold-card {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 12px 28px rgba(23, 32, 42, 0.06);
}

.threshold-card.ok {
  border-color: #9ccab8;
  background: var(--green-soft);
}

.threshold-card.review {
  border-color: #e2bf80;
  background: var(--amber-soft);
}

.threshold-card.hold {
  border-color: #e5aaa5;
  background: var(--red-soft);
}

.threshold-card.muted {
  border-color: #d7dfe6;
  background: #f6f8fa;
}

.threshold-card > span,
.threshold-card strong {
  display: block;
}

.threshold-card > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.threshold-card strong {
  margin-top: 5px;
  color: var(--ink);
  font-size: 23px;
  line-height: 1.05;
}

.threshold-track {
  position: relative;
  display: flex;
  height: 10px;
  margin: 14px 0 10px;
  overflow: hidden;
  border-radius: 999px;
  background: transparent;
  box-shadow: inset 0 0 0 1px rgba(23, 32, 42, 0.08);
}

.threshold-band {
  flex: 0 0 auto;
  height: 100%;
}

.threshold-band.ok {
  background: #63a77f;
}

.threshold-band.review {
  background: #d2a457;
}

.threshold-band.hold {
  background: #c76a63;
}

.threshold-band.muted {
  background: #ccd5de;
}

.threshold-marker {
  position: absolute;
  top: -4px;
  width: 12px;
  height: 18px;
  border: 2px solid #fff;
  border-radius: 999px;
  background: #17202a;
  box-shadow: 0 4px 10px rgba(23, 32, 42, 0.18);
  transform: translateX(-50%);
}

.threshold-card-legend {
  display: grid;
  gap: 4px;
  min-height: 38px;
}

.threshold-card-legend span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 560;
  line-height: 1.35;
}

.threshold-card p {
  margin: 8px 0 0;
  color: #425466;
  font-size: 13px;
  line-height: 1.42;
}

.detail-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(280px, 0.85fr);
  gap: 16px;
  align-items: start;
  margin-bottom: 16px;
}

.detail-primary-panel {
  margin-bottom: 0;
}

.detail-primary-frame {
  height: 430px;
  min-height: 430px;
  max-height: 430px;
}

.detail-side-stack {
  display: grid;
  gap: 16px;
}

.detail-panel-copy {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.42;
}

.detail-flow-list {
  display: grid;
  gap: 10px;
}

.detail-flow-list div {
  padding: 0 0 10px;
  border-bottom: 1px solid var(--line);
}

.detail-flow-list div:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.detail-flow-list strong,
.detail-flow-list span {
  display: block;
}

.detail-flow-list span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.42;
}

.detail-program-summary,
.detail-focus-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.detail-program-summary {
  margin-bottom: 18px;
}

.detail-focus-section {
  min-width: 0;
}

.detail-focus-section h4 {
  margin-bottom: 10px;
  color: var(--ink);
  font-size: 16px;
}

.detail-secondary-frame {
  height: 320px;
  min-height: 320px;
  max-height: 320px;
}

.detail-kv-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
  margin: 0;
}

.detail-kv-grid.compact {
  margin-top: 12px;
}

.detail-kv-grid div {
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.detail-kv-grid dt,
.detail-kv-grid dd {
  margin: 0;
}

.detail-kv-grid dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.detail-kv-grid dd {
  margin-top: 4px;
  color: var(--ink);
  font-size: 15px;
  font-weight: 580;
  line-height: 1.35;
}

.detail-reading-list {
  display: grid;
  gap: 10px;
}

.detail-reading-list div {
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.detail-reading-list div:last-child {
  border-bottom: 0;
}

.detail-reading-list strong,
.detail-reading-list span {
  display: block;
}

.detail-reading-list span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.42;
}

.detail-disclosure {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.detail-disclosure summary {
  cursor: pointer;
  color: var(--ink);
  font-size: 14px;
  font-weight: 600;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.form-grid label,
.search {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 580;
}

.form-grid input,
.form-grid select,
.form-grid textarea,
.search input,
.search select,
.login-card input,
.login-card select {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  padding: 8px 10px;
}

.form-grid input.range-warning {
  border-color: #e2bf80;
  background: var(--amber-soft);
}

textarea {
  resize: vertical;
}

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

/* Split quantity (number + unit) + CAS/name lookup row in the chemical dialog. */
.qty-split {
  display: flex;
  gap: 6px;
}
.qty-split input[type="number"] {
  flex: 2 1 0;
  min-width: 0;
}
.qty-split input[type="text"] {
  flex: 1 1 0;
  min-width: 0;
}
.chem-lookup-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin: -2px 0 2px;
}
.chem-lookup-row #chemLookupStatus {
  flex: 1 1 220px;
  font-size: 12px;
}

.entry-guardrail {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px 12px;
  background: var(--blue-soft);
  color: var(--blue);
}

.entry-guardrail.warning {
  border-color: #e2bf80;
  background: var(--amber-soft);
  color: var(--amber);
}

.entry-guardrail strong,
.entry-guardrail span {
  display: block;
}

.entry-guardrail span {
  margin-top: 3px;
  font-size: 13px;
  color: var(--muted);
}

.readonly-field {
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #edf2f6;
  color: var(--ink);
  padding: 9px 10px;
  font-weight: 620;
  display: flex;
  align-items: center;
}

.entry-record-note {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  font-weight: 550;
  color: var(--muted);
  line-height: 1.35;
}

.run-controls-panel {
  margin-bottom: 14px;
  display: grid;
  gap: 12px;
}

.run-control-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.run-control-title {
  font-size: 12px;
  font-weight: 680;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.run-filter-summary {
  font-size: 13px;
  font-weight: 560;
  color: var(--ink);
  margin-right: auto;
}

.run-filter-grid {
  grid-template-columns: repeat(6, minmax(130px, 1fr));
}

.run-filter-grid label {
  display: grid;
  gap: 6px;
  font-size: 12px;
  font-weight: 620;
  color: var(--muted);
  text-transform: uppercase;
}

#runTable thead th.sortable {
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

#runTable thead th.sortable:hover {
  color: var(--accent, #1d6fb8);
}

#runTable thead th.sortable::after {
  content: "\2195";
  margin-left: 6px;
  opacity: 0.35;
  font-size: 11px;
}

#runTable thead th.sortable.sort-asc::after {
  content: "\2191";
  opacity: 1;
}

#runTable thead th.sortable.sort-desc::after {
  content: "\2193";
  opacity: 1;
}

.run-behalf {
  display: block;
  font-size: 11px;
  font-weight: 560;
  color: var(--muted);
}

@media (max-width: 980px) {
  .run-filter-grid {
    grid-template-columns: repeat(2, minmax(130px, 1fr));
  }
}

.capa-stage-banner {
  margin: 4px 0 12px;
}

.capa-stage-track {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.capa-stage-step {
  font-size: 11px;
  font-weight: 620;
  padding: 4px 9px;
  border-radius: 999px;
  background: #eef2f6;
  color: var(--muted);
  border: 1px solid var(--line);
  white-space: nowrap;
}

.capa-stage-step.done {
  background: #e6f4ea;
  color: #1d7a3a;
  border-color: #bfe2cb;
}

.capa-stage-step.current {
  background: var(--ink, #16263b);
  color: #fff;
  border-color: var(--ink, #16263b);
}

.capa-stage-arrow {
  color: var(--muted);
  font-size: 12px;
}

.capa-stage-chip {
  display: inline-block;
  font-size: 12px;
  font-weight: 620;
  padding: 4px 10px;
  border-radius: 999px;
  background: #f3e6e6;
  color: #9a2a2a;
  margin-right: 8px;
}

.capa-stage-progress-note {
  font-size: 12px;
  color: var(--muted);
}

.capa-workflow-actions {
  margin: 14px 0 6px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7f9fb;
}

.capa-workflow-title {
  font-size: 12px;
  font-weight: 680;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--muted);
  margin-bottom: 8px;
}

.capa-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.capa-action-button {
  font-size: 13px;
  font-weight: 560;
  padding: 8px 14px;
}

.capa-action-button.secondary {
  background: #eef2f6;
  color: var(--ink);
  border: 1px solid var(--line);
}

.capa-action-button.danger {
  background: #fff;
  color: #9a2a2a;
  border: 1px solid #e0b4b4;
}

.capa-action-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.capa-workflow-note {
  margin: 8px 0 0;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.4;
}

.evidence-need {
  color: #9a2a2a;
  font-weight: 560;
}

.input-with-unit {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.input-with-unit span {
  min-width: 56px;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #edf2f6;
  color: var(--muted);
  padding: 9px 10px;
  font-weight: 620;
  text-align: center;
}

.entry-validation {
  border: 1px solid #e2bf80;
  border-left: 5px solid var(--amber);
  border-radius: 8px;
  background: var(--amber-soft);
  color: var(--amber);
  padding: 10px 12px;
  font-weight: 580;
}

.entry-option-panel {
  display: grid;
  gap: 10px;
  margin-top: 4px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f6f8fa;
}

.entry-option-label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.entry-option-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 10px;
}

.entry-option-button {
  min-height: 88px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #edf1f4;
  color: #6d7781;
  text-align: left;
  display: grid;
  gap: 5px;
  box-shadow: none;
}

.entry-option-button strong {
  color: #58626c;
  font-size: 15px;
  line-height: 1.15;
}

.entry-option-button small {
  color: #7d8790;
  font-size: 12px;
  line-height: 1.38;
}

.entry-option-note {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.table-wrap {
  overflow: auto;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 12px 28px rgba(23, 32, 42, 0.05);
}

table {
  width: 100%;
  min-width: 980px;
  border-collapse: collapse;
  font-size: 13px;
}

th,
td {
  padding: 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

th {
  background: #edf2f6;
  color: #334251;
  font-size: 12px;
  text-transform: uppercase;
}

.badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 650;
  margin: 0 4px 4px 0;
}

.badge.ok {
  background: var(--green-soft);
  color: var(--green);
}

.badge.review,
.badge.caution {
  background: var(--amber-soft);
  color: var(--amber);
}

.badge.hold,
.badge.action {
  background: var(--red-soft);
  color: var(--red);
}

.badge.info {
  background: var(--blue-soft);
  color: var(--blue);
}

.event-list {
  display: grid;
  gap: 10px;
}

.capa-register {
  display: grid;
  gap: 16px;
}

.capa-register-section + .capa-register-section {
  padding-top: 4px;
}

.compact-panel-head {
  align-items: center;
  margin-bottom: 10px;
}

.compact-panel-head h4 {
  margin: 0 0 4px;
}

.compact-panel-head p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.capa-inline-note {
  color: var(--muted);
  font-weight: 560;
}

.audit-layout {
  display: grid;
  /* minmax(0,1fr) + min-width:0 stop the single grid track from sizing to the
     fixed-width audit table's min-content and leaking ~91px past the content
     column onto the page. The wide table scrolls inside .audit-table-panel instead. */
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
  gap: 16px;
}

.status-card-audit {
  padding: 18px 20px;
}

.status-card-audit strong,
.status-card-audit span {
  display: block;
}

.status-card-audit span + span {
  margin-top: 6px;
}

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

.audit-summary-card {
  padding: 14px 16px;
}

.audit-summary-card strong,
.audit-summary-card span {
  display: block;
}

.audit-summary-card strong {
  font-size: 31px;
  line-height: 1;
}

.audit-summary-card span:last-child {
  margin-top: 6px;
  color: var(--muted);
  font-size: 13px;
}

.audit-controls-panel,
.audit-table-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
  gap: 16px;
}

/* The audit table head + record rows share a fixed 6-column grid (~1040px min) that
   is wider than the content column at 1280 with the rail open. Let the panel scroll
   the table horizontally as one unit (head + rows stay aligned) instead of the page. */
.audit-table-panel {
  overflow-x: auto;
}

.audit-control-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
}

.audit-view-group {
  display: grid;
  gap: 8px;
  font-size: 12px;
  font-weight: 680;
  color: var(--muted);
  text-transform: uppercase;
}

.audit-viewbar {
  width: fit-content;
  max-width: 100%;
}

.audit-viewbar button {
  min-height: 34px;
  padding: 7px 12px;
  font-size: 13px;
}

.audit-filter-grid {
  grid-template-columns: minmax(260px, 1.5fr) repeat(4, minmax(140px, 0.8fr));
}

.audit-filter-grid label {
  display: grid;
  gap: 6px;
  font-size: 13px;
  font-weight: 560;
  color: var(--muted);
}

.audit-filter-grid input,
.audit-filter-grid select {
  width: 100%;
}

.audit-search-field {
  min-width: 0;
}

.audit-active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.audit-active-filters[hidden] {
  display: none;
}

.audit-chip {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border: 1px solid rgba(17, 17, 17, 0.08);
  border-radius: 999px;
  background: #f5f1e8;
  color: var(--ink);
  font-size: 12px;
  font-weight: 560;
}

.audit-chip.audit-chip-muted {
  background: transparent;
  border-color: transparent;
  padding-left: 0;
  color: var(--muted);
}

.audit-table-head {
  display: grid;
  grid-template-columns: 140px 170px 160px minmax(220px, 1.2fr) minmax(180px, 1fr) 110px;
  gap: 12px;
  padding: 0 4px 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 680;
  text-transform: uppercase;
}

.audit-record-list {
  display: grid;
  gap: 10px;
}

.audit-record {
  border: 1px solid var(--line);
  border-left: 5px solid var(--line-strong);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.audit-record[data-severity="notable"] {
  border-left-color: var(--amber);
}

.audit-record[data-severity="exception"] {
  border-left-color: var(--red);
}

.audit-record[data-severity="normal"] {
  border-left-color: var(--green);
}

.audit-record summary {
  list-style: none;
  cursor: pointer;
  padding: 12px 14px;
}

.audit-record summary::-webkit-details-marker {
  display: none;
}

.audit-record-head {
  display: grid;
  grid-template-columns: 140px 170px 160px minmax(220px, 1.2fr) minmax(180px, 1fr) 110px;
  gap: 12px;
  align-items: start;
}

.audit-col {
  min-width: 0;
}

.audit-col strong,
.audit-col span {
  display: block;
}

.audit-col strong {
  font-size: 13px;
}

.audit-col span {
  color: var(--muted);
  font-size: 12px;
  margin-top: 2px;
}

.audit-flag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 620;
  border: 1px solid rgba(17, 17, 17, 0.08);
  background: var(--soft);
  color: var(--ink);
}

.audit-flag.exception {
  background: var(--red-soft);
  color: var(--red);
}

.audit-flag.notable {
  background: var(--amber-soft);
  color: var(--amber);
}

.audit-flag.normal {
  background: var(--green-soft);
  color: var(--green);
}

.audit-record-body {
  padding: 0 14px 14px;
}

.audit-detail-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid rgba(17, 17, 17, 0.08);
}

.audit-detail-card {
  padding: 12px 13px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fcfbf8;
}

.audit-detail-card strong,
.audit-detail-card span {
  display: block;
}

.audit-detail-card strong {
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
}

.audit-detail-card span {
  margin-top: 4px;
  font-size: 13px;
  color: var(--ink);
}

.audit-empty {
  padding: 18px 20px;
}

.audit-empty strong,
.audit-empty span {
  display: block;
}

.audit-empty span {
  margin-top: 4px;
  color: var(--muted);
}

.event-item {
  border: 1px solid var(--line);
  border-left-width: 5px;
  border-radius: 7px;
  padding: 10px;
  background: #fff;
}

.event-item.action {
  border-left-color: var(--red);
}

.event-item.caution {
  border-left-color: var(--amber);
}

.event-item.ok {
  border-left-color: var(--green);
}

.event-item strong,
.event-item span {
  display: block;
}

.event-item span {
  color: var(--muted);
  font-size: 13px;
  margin-top: 3px;
}

.event-item button {
  margin-top: 8px;
}

.mini-button {
  min-height: 28px;
  padding: 3px 8px;
  font-size: 12px;
}

@media (max-width: 1180px) {
  .audit-summary-grid,
  .audit-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .audit-filter-grid {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }

  .audit-table-head {
    display: none;
  }

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

@media (max-width: 720px) {
  .audit-summary-grid,
  .audit-detail-grid,
  .audit-filter-grid,
  .audit-record-head {
    grid-template-columns: 1fr;
  }

  .audit-viewbar {
    width: 100%;
  }

  .audit-control-bar {
    align-items: stretch;
  }

  .instrument-entry-row {
    grid-template-columns: 1fr;
  }
}

.note-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 10px;
}

#profileSummaryCards {
  margin-bottom: 16px;
}

.note-grid article {
  padding: 13px;
}

.note-grid article.ok {
  border-color: #9ccab8;
  background: var(--green-soft);
}

.note-grid article.review {
  border-color: #e2bf80;
  background: var(--amber-soft);
}

.note-grid article.hold {
  border-color: #e5aaa5;
  background: #f8e7e4;
}

.note-grid article.info {
  border-color: #c7d6e4;
  background: #f3f7fb;
}

.note-grid article.muted {
  border-color: #d7dfe6;
  background: #f6f8fa;
}

.note-grid strong {
  font-size: 20px;
}

/* System collision fix (WCAG AA): the dark hub status card (.qa-hub-status-card,
   white value + near-white detail) is sometimes placed inside a .note-grid, whose
   article tones (.ok/.review/.hold/.info/.muted) paint a LIGHT pastel background for
   dark-text cards. The two systems combined = white text on light pastel (value ~2:1,
   detail ~1.4:1 — effectively invisible). The card is explicitly the dark hub-card
   component, so keep its dark surface everywhere; its white/tone text then reads at the
   card's designed ~16:1. Assignments + Capacity summaries render through this path. */
.note-grid .qa-hub-status-card,
.note-grid .qa-hub-status-card.ok,
.note-grid .qa-hub-status-card.review,
.note-grid .qa-hub-status-card.hold,
.note-grid .qa-hub-status-card.info,
.note-grid .qa-hub-status-card.muted {
  background:
    linear-gradient(180deg, rgba(7, 12, 13, 0.88), rgba(7, 12, 13, 0.72)),
    rgba(7, 12, 13, 0.74);
}

.compact-grid {
  grid-template-columns: 1fr;
}

.setup-list {
  display: grid;
  gap: 10px;
}

.setup-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.5fr) minmax(115px, 0.7fr) minmax(120px, 0.7fr) minmax(120px, 0.7fr);
  gap: 10px;
  align-items: end;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.setup-row label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 580;
}

.setup-row input,
.setup-row select,
.setup-table input,
.setup-table select,
#subscriptionCatalog select,
#methodSetupDetails input,
#methodSetupDetails select,
#methodSetupDetails textarea {
  width: 100%;
  min-height: 36px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  padding: 7px 9px;
}

.checkline {
  display: flex !important;
  align-items: center;
  gap: 9px;
  color: var(--ink) !important;
}

.checkline input {
  width: 18px !important;
  min-height: 18px !important;
  flex: 0 0 auto;
}

.checkline span,
.checkline strong,
.checkline small {
  display: block;
}

.checkline small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 570;
}

.checkline.compact {
  justify-content: flex-start;
}

.setup-meta {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 12px;
}

.setup-note {
  margin-bottom: 12px;
}

.setup-table {
  margin-top: 12px;
}

.setup-subpanel {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.instrument-entry-list {
  display: grid;
  gap: 10px;
}

.instrument-entry-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
}

.instrument-entry-row label {
  margin: 0;
}

.setup-actions {
  margin-top: 12px;
}

.address-field {
  position: relative;
}

.address-search-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: stretch;
}

.address-search-row button {
  min-width: 82px;
}

.address-lookup-status {
  min-height: 18px;
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 570;
}

.address-lookup-status.ok {
  color: #27745f;
}

.address-lookup-status.warning {
  color: #ad741c;
}

.address-lookup-status.muted {
  color: var(--muted);
}

.address-suggestions {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 30;
  display: grid;
  max-height: 220px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 17, 17, 0.14);
}

.address-suggestions button {
  display: grid;
  gap: 3px;
  min-height: 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: #fff;
  color: var(--ink);
  padding: 10px 11px;
  text-align: left;
  cursor: pointer;
}

.address-suggestions button:hover,
.address-suggestions button:focus-visible {
  background: var(--paper);
  outline: none;
  filter: none;
}

.address-suggestions button:last-child {
  border-bottom: 0;
}

.address-suggestions strong {
  font-size: 13px;
}

.address-suggestions span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 570;
}

.operator-choice-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.setup-note-row {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  border: 1px solid var(--line);
  border-left: 5px solid var(--blue);
  border-radius: 8px;
  background: var(--blue-soft);
  color: var(--ink);
  padding: 11px 12px;
  margin: 14px 0 10px;
}

.setup-note-row.slim {
  margin-top: 0;
}

.setup-note-row span {
  color: var(--muted);
}

.logistics-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 12px;
  margin: 12px 0;
}

.logistics-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
}

.logistics-actions strong,
.logistics-actions span {
  display: block;
}

.logistics-actions span {
  color: var(--muted);
  font-size: 13px;
}

.address-actions,
.inline-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.address-actions {
  margin-top: 12px;
}

.inline-link {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  padding: 7px 12px;
  font-size: 13px;
  font-weight: 580;
  text-decoration: none;
}

.inline-link:hover,
.inline-link:focus-visible {
  background: rgba(199, 154, 50, 0.96);
  border-color: rgba(199, 154, 50, 0.88);
  color: #111;
  box-shadow:
    0 0 0 1px rgba(199, 154, 50, 0.22),
    0 0 22px rgba(199, 154, 50, 0.14);
  outline: none;
}

.consent-line {
  margin-top: 14px;
}

.view-only-note {
  color: var(--muted);
  font-size: 13px;
  font-weight: 570;
}

.schedule-inline-controls {
  margin-bottom: 12px;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 620;
}

.status-pill.ok {
  background: var(--green-soft);
  color: var(--green);
}

.status-pill.review {
  background: var(--amber-soft);
  color: var(--amber);
}

.status-pill.hold {
  background: var(--red-soft);
  color: var(--red);
}

.status-pill.info,
.status-pill.muted {
  background: #edf2f7;
  color: #52606d;
}

.cell-note {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-top: 3px;
}

.detail-handoff-row {
  display: flex;
  justify-content: flex-start;
  margin-top: 6px;
}

.subscription-table th:first-child,
.subscription-table td:first-child {
  min-width: 130px;
}

/* Capacity & entitlement panel (Edit 1) — CONFIGURED-vs-ENTITLED + prorated add-capacity. */
.capacity-panel {
  border: 1px solid var(--line, #d9e0ea);
  border-radius: 10px;
  padding: 14px 16px;
  margin-bottom: 14px;
  background: var(--surface-2, #f6f8fb);
}
.capacity-panel strong { display: block; margin-bottom: 4px; }
.capacity-panel p { margin: 0 0 8px; }
.capacity-panel.over {
  border-color: #d9a441;
  background: rgba(217, 164, 65, 0.12);
}
.capacity-panel.over #addCapacityBtn { margin-top: 2px; }

.summary-table {
  display: grid;
  gap: 8px;
}

.comparison-page-stack {
  display: grid;
  gap: 14px;
}

.comparison-workbench {
  display: grid;
  gap: 16px;
}

.comparison-filter-panel {
  padding: 14px 18px;
}

.comparison-filter-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.comparison-action-toggle {
  margin-left: auto;
}

.comparison-summary-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.comparison-summary-card,
.comparison-dossier-card,
.comparison-action-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.comparison-summary-card {
  padding: 14px 16px;
}

.comparison-summary-card span,
.comparison-dossier-card span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
}

.comparison-summary-card strong,
.comparison-dossier-card strong {
  display: block;
  margin-top: 6px;
  color: var(--ink);
  font-size: 28px;
  line-height: 1;
}

.comparison-summary-card p,
.comparison-action-card span {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

#comparison .page-head.module-hero {
  min-height: clamp(118px, 16vh, 152px);
  padding: clamp(18px, 2vw, 24px);
}

#comparison .page-head.module-hero h2 {
  font-size: clamp(28px, 3.6vw, 46px);
}

#comparison .comparison-summary-card {
  padding: 10px 12px;
}

#comparison .comparison-summary-card strong {
  margin-top: 4px;
  font-size: 24px;
}

#comparison .comparison-summary-card p {
  margin-top: 6px;
  font-size: 12px;
}

.comparison-summary-card.ok {
  border-color: rgba(39, 116, 95, 0.38);
  background: rgba(229, 243, 237, 0.72);
}

.comparison-summary-card.review {
  border-color: rgba(173, 116, 28, 0.38);
  background: rgba(251, 239, 217, 0.76);
}

.comparison-summary-card.hold {
  border-color: rgba(180, 70, 66, 0.38);
  background: rgba(250, 233, 231, 0.78);
}

.comparison-summary-card.info {
  border-color: rgba(18, 165, 148, 0.28);
  background: rgba(227, 243, 240, 0.62);
}

.comparison-primary-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.18fr);
  gap: 16px;
  align-items: start;
  min-height: clamp(520px, calc(100vh - 350px), 760px);
}

.comparison-queue-list {
  display: grid;
  gap: 10px;
  max-height: none;
  min-height: 0;
  height: 100%;
  overflow: auto;
  padding-right: 4px;
}

.comparison-queue-item {
  width: 100%;
  min-height: 0;
  padding: 14px 15px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  text-align: left;
}

.comparison-queue-item:hover,
.comparison-queue-item:focus-visible {
  background: rgba(199, 154, 50, 0.08);
  border-color: rgba(199, 154, 50, 0.76);
  box-shadow: 0 0 0 1px rgba(199, 154, 50, 0.14);
  outline: none;
}

.comparison-queue-item.active {
  border-color: rgba(39, 116, 95, 0.86);
  box-shadow:
    0 0 0 1px rgba(39, 116, 95, 0.18),
    0 10px 24px rgba(23, 32, 42, 0.08);
}

.comparison-queue-item.hold {
  border-left: 4px solid var(--red);
}

.comparison-queue-item.review {
  border-left: 4px solid var(--amber);
}

.comparison-queue-item.info {
  border-left: 4px solid var(--blue);
}

.comparison-queue-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.comparison-queue-kicker {
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.comparison-queue-item strong {
  display: block;
  margin-top: 6px;
  color: var(--ink);
  font-size: 22px;
  line-height: 1.08;
}

.comparison-queue-item p {
  margin: 8px 0 0;
  color: var(--ink);
  font-size: 13px;
  font-weight: 560;
  line-height: 1.4;
}

.comparison-queue-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 10px;
}

.comparison-queue-meta span,
.comparison-queue-item small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 560;
  line-height: 1.4;
}

.comparison-queue-item small {
  display: block;
  margin-top: 8px;
}

.comparison-dossier-panel {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 12px;
  min-height: 0;
}

.comparison-queue-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-height: 0;
}

.comparison-dossier-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.comparison-detail-chooser {
  width: fit-content;
}

.comparison-dossier-body {
  min-height: 0;
  overflow: auto;
  padding-right: 4px;
}

.comparison-results-stack,
.comparison-diagnostic-stack {
  display: grid;
  gap: 12px;
  align-content: start;
}

.comparison-dossier-card {
  padding: 12px 14px;
}

.comparison-dossier-card strong {
  margin-top: 5px;
  font-size: 16px;
  line-height: 1.3;
}

.comparison-asset-trend-frame {
  height: 240px;
  min-height: 240px;
  max-height: 240px;
}

.comparison-asset-actions {
  display: grid;
  gap: 10px;
}

.comparison-asset-actions-compact {
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.comparison-action-card {
  padding: 12px 14px;
}

.comparison-action-card strong {
  display: block;
  color: var(--ink);
  font-size: 14px;
}

.comparison-diagnostic-frame {
  height: 300px;
  min-height: 300px;
  max-height: 300px;
}

.comparison-diagnostic-inline-frame {
  margin-bottom: 0;
}

.comparison-diagnostic-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.comparison-inline-note {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.comparison-hover-note {
  margin: -4px 0 0;
  color: #6a7785;
  font-size: 12px;
  line-height: 1.4;
}

.comparison-empty-state {
  display: grid;
  gap: 6px;
  padding: 16px;
  border: 1px dashed var(--line-strong);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

.comparison-empty-state strong {
  color: var(--ink);
  font-size: 15px;
}

.comparison-empty-state span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.ranking-page-stack {
  display: grid;
  gap: 18px;
}

.comparison-note {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 13px;
}

.comparison-note strong {
  color: var(--ink);
}

.comparison-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 10px;
}

.comparison-highlight-grid {
  margin: 0;
}

.comparison-highlight-grid .evidence-card p {
  line-height: 1.45;
}

.ranking-summary-grid {
  margin: 0;
}

.ranking-grid {
  align-items: start;
}

.ranking-chart-frame {
  height: 360px;
  min-height: 360px;
  max-height: 360px;
}

.ranking-stat-list {
  display: grid;
  gap: 10px;
}

.ranking-stat-list div {
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.ranking-stat-list div:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.ranking-stat-list strong,
.ranking-stat-list span,
.ranking-stat-list small {
  display: block;
}

.ranking-stat-list span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.42;
}

.ranking-stat-list small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.ranking-empty {
  color: var(--muted);
  font-size: 13px;
}

/* Ranking gate (Edit 2 / Phase 2B) — shown in place of the summary/charts when the lab is not on a
   global QA sample, so cross-lab ranking is not possible. */
.ranking-not-global {
  margin: 4px 0;
  padding: 18px 20px;
  border: 1px solid var(--amber, #ad741c);
  border-left-width: 4px;
  border-radius: 10px;
  background: var(--amber-soft, #fbf3e3);
  color: var(--ink, #23303a);
  font-size: 15px;
  font-weight: 600;
}

/* QA proficiency-sample setup panel (Edit 2 / Phase 2B). */
.qa-sample-active-line { margin: 2px 0 6px; font-weight: 600; }
.qa-sample-state-note { margin: 0 0 12px; font-size: 13px; }
.qa-sample-state-note.tone-ok { color: var(--green, #27745f); }
.qa-sample-state-note.tone-review { color: var(--amber, #ad741c); }
.qa-sample-actions { margin-top: 12px; display: flex; gap: 8px; flex-wrap: wrap; }
#qaSampleSetupPanel tr.is-active { font-weight: 600; }
/* Phase 2C — QA-sample migration progress */
.qa-sample-migration { margin: 14px 0 4px; padding: 12px 14px; border: 1px solid var(--border, #d9d2c4); border-radius: 8px; background: var(--surface-2, rgba(0,0,0,0.02)); }
.qa-sample-migration h4 { margin: 0 0 4px; font-size: 14px; }
.qa-sample-migration p.muted { margin: 0 0 10px; font-size: 13px; }
.qa-sample-migration tr.is-cleared td { opacity: 0.9; }
.mig-state { font-size: 12px; font-weight: 600; }
.mig-state.tone-ok { color: var(--green, #27745f); }
.mig-state.tone-review { color: var(--amber, #ad741c); }
.mig-meter { display: inline-block; width: 90px; height: 8px; border-radius: 4px; background: var(--border, #e2ddd1); vertical-align: middle; overflow: hidden; margin-right: 6px; }
.mig-meter > span { display: block; height: 100%; background: var(--green, #27745f); }
tr.is-dual .mig-meter > span { background: var(--amber, #ad741c); }

.summary-row {
  display: grid;
  grid-template-columns: 1fr 60px 80px 80px 100px;
  gap: 10px;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
}

.summary-row.header {
  color: #334251;
  font-size: 12px;
  font-weight: 680;
  text-transform: uppercase;
}

.summary-row:last-child {
  border-bottom: 0;
}

.summary-row.low-n {
  opacity: 0.76;
}

.summary-row span {
  color: var(--muted);
  font-size: 13px;
}

.summary-row.asset-performance {
  grid-template-columns: minmax(0, 1.2fr) 70px 74px 74px 120px 110px;
}
/* CSS-D (B11): stack the ~508px fixed asset-performance grid on narrow screens */
@media(max-width:640px){
  .summary-row.asset-performance{ grid-template-columns:1fr 1fr; }
}

.summary-row strong small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 560;
  line-height: 1.35;
}

.rules-list {
  display: grid;
  gap: 10px;
}

.rules-list article {
  padding: 14px;
}

.rules-list p {
  color: var(--muted);
  margin-bottom: 7px;
}

.report-toolbar {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.report-body {
  max-width: 1160px;
  padding: 0;
  margin: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.report-body ul {
  padding-left: 20px;
}

.report-sheet {
  padding: 26px 28px;
  border: 1px solid #d7d1c2;
  border-radius: 12px;
  background: #f8f7f3;
  box-shadow: 0 20px 44px rgba(17, 17, 17, 0.14);
  display: grid;
  gap: 18px;
}

.report-sheet-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: start;
  padding-bottom: 18px;
  border-bottom: 1px solid #d7d1c2;
}

.report-sheet-head h3 {
  margin: 0;
  color: #111;
  font-size: 34px;
  line-height: 1.02;
}

.report-eyebrow {
  display: inline-block;
  margin-bottom: 10px;
  color: #c79a32;
  font-size: 12px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.report-lead {
  margin: 12px 0 0;
  max-width: 760px;
  color: #625d52;
  font-size: 15px;
  line-height: 1.45;
}

.report-sheet-meta {
  display: grid;
  gap: 6px;
  text-align: right;
  color: #625d52;
  font-size: 13px;
  line-height: 1.35;
}

.report-hero {
  padding: 20px 22px;
  border: 1px solid #d7d1c2;
  border-left-width: 5px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.82);
  display: grid;
  gap: 8px;
}

.report-hero.ok {
  border-left-color: var(--green);
}

.report-hero.review {
  border-left-color: var(--amber);
}

.report-hero.hold {
  border-left-color: var(--red);
}

.report-hero-label {
  color: #625d52;
  font-size: 12px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.report-hero strong {
  color: #111;
  font-size: 34px;
  line-height: 1.03;
}

.report-hero p {
  margin: 0;
  color: #625d52;
  font-size: 15px;
  line-height: 1.44;
}

.report-summary-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.report-summary-card {
  min-height: 112px;
  padding: 14px 16px;
  border: 1px solid #d7d1c2;
  border-top-width: 4px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.9);
  display: grid;
  align-content: start;
  gap: 5px;
}

.report-summary-card span {
  color: #625d52;
  font-size: 11px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.report-summary-card strong {
  color: #111;
  font-size: 26px;
  line-height: 1.02;
}

.report-summary-card small {
  color: #625d52;
  font-size: 12px;
  line-height: 1.4;
}

.report-summary-card.ok {
  border-top-color: var(--green);
}

.report-summary-card.review {
  border-top-color: var(--amber);
}

.report-summary-card.hold {
  border-top-color: var(--red);
}

.report-summary-card.neutral {
  border-top-color: #d7d1c2;
}

.report-section {
  padding: 18px 20px;
  border: 1px solid #d7d1c2;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.9);
  display: grid;
  gap: 14px;
}

.report-section-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-end;
}

.report-section-head span {
  display: block;
  color: #625d52;
  font-size: 11px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 4px;
}

.report-section-head strong {
  color: #111;
  font-size: 22px;
  line-height: 1.08;
}

.report-section-head small {
  color: #625d52;
  font-size: 12px;
  line-height: 1.35;
}

.report-method-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.report-method-card {
  min-height: 120px;
  padding: 14px 15px;
  border: 1px solid #d7d1c2;
  border-left-width: 4px;
  border-radius: 10px;
  background: #fff;
  display: grid;
  align-content: start;
  gap: 10px;
}

.report-method-card.ok {
  border-left-color: var(--green);
}

.report-method-card.review {
  border-left-color: var(--amber);
}

.report-method-card.hold {
  border-left-color: var(--red);
}

.report-method-card.neutral {
  border-left-color: #d7d1c2;
}

.report-method-top,
.report-action-card-top,
.report-threshold-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.report-method-top strong,
.report-action-card-top strong,
.report-threshold-head strong {
  color: #111;
  font-size: 20px;
  line-height: 1.05;
}

.report-method-top span,
.report-action-card-top span,
.report-threshold-head span {
  color: #625d52;
  font-size: 12px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: right;
}

.report-method-card p,
.report-action-card p,
.report-threshold-card p {
  margin: 0;
  color: #111;
  font-size: 15px;
  line-height: 1.38;
}

.report-action-list,
.report-threshold-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.report-action-card,
.report-threshold-card {
  min-height: 148px;
  padding: 16px;
  border: 1px solid #d7d1c2;
  border-left-width: 4px;
  border-radius: 10px;
  background: #fff;
  display: grid;
  align-content: start;
  gap: 10px;
}

.report-action-card.ok,
.report-threshold-card.ok {
  border-left-color: var(--green);
}

.report-action-card.review,
.report-threshold-card.review {
  border-left-color: var(--amber);
}

.report-action-card.hold,
.report-threshold-card.hold {
  border-left-color: var(--red);
}

.report-action-card.neutral,
.report-threshold-card.neutral {
  border-left-color: #d7d1c2;
}

.report-action-card small,
.report-threshold-card small,
.report-empty-note {
  color: #625d52;
  font-size: 12px;
  line-height: 1.42;
}

.report-threshold-card dl {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.report-threshold-card dl div {
  padding-top: 8px;
  border-top: 1px solid #e5e0d3;
}

.report-threshold-card dt {
  color: #625d52;
  font-size: 11px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.report-threshold-card dd {
  margin: 4px 0 0;
  color: #111;
  font-size: 16px;
  font-weight: 600;
}

.report-table-wrap {
  overflow-x: auto;
}

.report-table {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
}

.report-table th {
  padding: 10px 12px;
  border-bottom: 1px solid #d7d1c2;
  color: #625d52;
  font-size: 11px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: left;
}

.report-table td {
  padding: 11px 12px;
  border-bottom: 1px solid #ebe6db;
  color: #111;
  font-size: 14px;
  line-height: 1.35;
}

.report-table tr.ok td:first-child {
  border-left: 3px solid var(--green);
}

.report-table tr.review td:first-child {
  border-left: 3px solid var(--amber);
}

.report-table tr.hold td:first-child {
  border-left: 3px solid var(--red);
}

.report-disclosures {
  display: grid;
  gap: 10px;
}

.report-disclosures details {
  border: 1px solid #d7d1c2;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.88);
  padding: 12px 14px;
}

.report-disclosures summary {
  cursor: pointer;
  color: #111;
  font-size: 14px;
  font-weight: 600;
  list-style: none;
}

.report-disclosures summary::-webkit-details-marker {
  display: none;
}

.report-disclosures p {
  margin: 10px 0 0;
  color: #625d52;
  font-size: 13px;
  line-height: 1.46;
}

.report-signoff-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}

.report-signoff-grid article {
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
  display: grid;
  gap: 5px;
}

.report-signoff-grid span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.report-signoff-grid strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.pdf-report-page {
  position: relative;
  width: 794px;
  min-height: 1123px;
  background: var(--paper);
  color: var(--ink);
  overflow: hidden;
}

.pdf-report-safe {
  padding: 56px 64px 96px;
  display: grid;
  gap: 16px;
}

.pdf-report-topbar {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: 24px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}

.pdf-report-brand {
  color: var(--ink);
  font-size: 28px;
  font-weight: 680;
  line-height: 1;
}

.pdf-report-brand span {
  color: var(--gold);
}

.pdf-report-wordmark {
  height: 34px;
  width: auto;
  display: block;
}

.pdf-report-meta {
  display: grid;
  gap: 3px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  text-align: right;
}

.pdf-report-heading {
  display: grid;
  gap: 8px;
}

.pdf-report-eyebrow {
  color: var(--gold);
  font-size: 12px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pdf-report-heading h1 {
  margin: 0;
  max-width: 620px;
  color: var(--ink);
  font-size: 28px;
  line-height: 1.04;
}

.pdf-report-heading p {
  margin: 0;
  max-width: 620px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.44;
}

.pdf-report-band {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-left-width: 4px;
  border-radius: 10px;
  background: #fff;
  display: grid;
  gap: 5px;
}

.pdf-report-band.ok {
  border-left-color: var(--green);
}

.pdf-report-band.review {
  border-left-color: var(--amber);
}

.pdf-report-band.hold {
  border-left-color: var(--red);
}

.pdf-report-band span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pdf-report-band strong {
  color: var(--ink);
  font-size: 22px;
  line-height: 1.05;
}

.pdf-report-band p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.42;
}

.pdf-report-signoff-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.pdf-report-signoff-grid article {
  min-height: 52px;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  display: grid;
  align-content: start;
  gap: 4px;
}

.pdf-report-signoff-grid span {
  color: var(--muted);
  font-size: 9px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pdf-report-signoff-grid strong {
  color: var(--ink);
  font-size: 10px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.pdf-report-summary-grid {
  display: grid;
  gap: 10px;
}

.pdf-report-summary-grid-program {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

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

.pdf-report-summary-card {
  min-height: 82px;
  padding: 11px 13px;
  border: 1px solid var(--line);
  border-top-width: 4px;
  border-radius: 10px;
  background: #fff;
  display: grid;
  align-content: start;
  gap: 5px;
}

.pdf-report-summary-card.ok {
  border-top-color: var(--green);
}

.pdf-report-summary-card.review {
  border-top-color: var(--amber);
}

.pdf-report-summary-card.hold {
  border-top-color: var(--red);
}

.pdf-report-summary-card.neutral {
  border-top-color: var(--line);
}

.pdf-report-summary-card span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pdf-report-summary-card strong {
  color: var(--ink);
  font-size: 20px;
  line-height: 1.03;
}

.pdf-report-summary-card small {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.32;
}

.pdf-report-panel {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  display: grid;
  gap: 12px;
}

.pdf-report-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px;
}

.pdf-report-panel-head span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 3px;
}

.pdf-report-panel-head strong {
  color: var(--ink);
  font-size: 17px;
  line-height: 1.08;
}

.pdf-report-panel-head small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}

.pdf-report-method-matrix {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.pdf-report-method-tile {
  min-height: 76px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-left-width: 4px;
  border-radius: 9px;
  background: #fff;
  display: grid;
  align-content: start;
  gap: 6px;
}

.pdf-report-method-tile.ok {
  border-left-color: var(--green);
}

.pdf-report-method-tile.review {
  border-left-color: var(--amber);
}

.pdf-report-method-tile.hold {
  border-left-color: var(--red);
}

.pdf-report-method-topline {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}

.pdf-report-method-topline strong {
  color: var(--ink);
  font-size: 17px;
  line-height: 1.04;
}

.pdf-report-method-topline span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: right;
}

.pdf-report-method-tile p,
.pdf-report-threshold-card p,
.pdf-report-action-row p,
.pdf-report-note p {
  margin: 0;
  color: var(--ink);
  font-size: 11px;
  line-height: 1.34;
}

.pdf-report-method-tile small {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.3;
}

.pdf-report-action-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}

.pdf-report-action-list.compact {
  gap: 8px;
}

.pdf-report-action-row {
  padding: 0 0 8px;
  border-bottom: 1px solid #ebe6db;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.pdf-report-action-row:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.pdf-report-action-row strong,
.pdf-report-note strong,
.pdf-report-threshold-top strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.15;
}

.pdf-report-action-row span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: right;
}

.pdf-report-action-row.ok {
  box-shadow: inset 3px 0 0 var(--green);
  padding-left: 10px;
}

.pdf-report-action-row.review {
  box-shadow: inset 3px 0 0 var(--amber);
  padding-left: 10px;
}

.pdf-report-action-row.hold {
  box-shadow: inset 3px 0 0 var(--red);
  padding-left: 10px;
}

.pdf-report-note-stack {
  display: grid;
  gap: 10px;
}

.pdf-report-inline-notes {
  display: grid;
  gap: 8px;
  padding-top: 2px;
}

.pdf-report-note {
  padding-top: 8px;
  border-top: 1px solid #ebe6db;
  display: grid;
  gap: 4px;
}

.pdf-report-note:first-child {
  padding-top: 0;
  border-top: 0;
}

.pdf-report-threshold-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.pdf-report-threshold-card {
  min-height: 120px;
  padding: 12px;
  border: 1px solid var(--line);
  border-left-width: 4px;
  border-radius: 9px;
  background: #fff;
  display: grid;
  align-content: start;
  gap: 8px;
}

.pdf-report-threshold-card.ok {
  border-left-color: var(--green);
}

.pdf-report-threshold-card.review {
  border-left-color: var(--amber);
}

.pdf-report-threshold-card.hold {
  border-left-color: var(--red);
}

.pdf-report-threshold-card.neutral {
  border-left-color: var(--line);
}

.pdf-report-threshold-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}

.pdf-report-threshold-top span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: right;
}

.pdf-report-threshold-card dl {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.pdf-report-threshold-card dl div {
  padding-top: 8px;
  border-top: 1px solid #ebe6db;
}

.pdf-report-threshold-card dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pdf-report-threshold-card dd {
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 13px;
  font-weight: 600;
}

.pdf-report-table-wrap {
  overflow: hidden;
  border: 1px solid #ebe6db;
  border-radius: 9px;
}

.pdf-report-table {
  width: 100%;
  border-collapse: collapse;
}

.pdf-report-table th {
  padding: 7px 8px;
  background: #f4efe3;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 10px;
  font-weight: 680;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: left;
}

.pdf-report-table td {
  padding: 7px 8px;
  border-bottom: 1px solid #ebe6db;
  color: var(--ink);
  font-size: 10px;
  line-height: 1.28;
}

.pdf-report-table tbody tr:last-child td {
  border-bottom: 0;
}

.pdf-report-table tr.ok td:first-child {
  border-left: 3px solid var(--green);
}

.pdf-report-table tr.review td:first-child {
  border-left: 3px solid var(--amber);
}

.pdf-report-table tr.hold td:first-child {
  border-left: 3px solid var(--red);
}

.pdf-report-empty {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.42;
}

.pdf-report-footer {
  position: absolute;
  left: 64px;
  right: 64px;
  bottom: 28px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  gap: 18px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}

.pdf-export-host {
  position: fixed;
  top: 0;
  left: -200vw;
  width: 794px;
  min-height: 1123px;
  padding: 0;
  pointer-events: none;
  z-index: -1;
  background: #ddd8ca;
}

.pdf-export-viewport {
  position: relative;
  width: 794px;
  min-height: 1123px;
  overflow: hidden;
}

.pdf-export-watermark {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: rotate(-28deg);
  font-size: 58px;
  font-weight: 620;
  letter-spacing: 6px;
  color: rgba(180, 70, 66, 0.13);
  white-space: nowrap;
  pointer-events: none;
  z-index: 50;
}

.pdf-export-viewport[data-scaled="true"] .pdf-report-page {
  transform: scale(var(--pdf-export-scale, 1));
  transform-origin: top left;
}

.pdf-export-host .pdf-report-page {
  margin: 0;
  box-shadow: none;
}

.report-sheet,
.report-hero,
.report-summary-card,
.report-section,
.report-action-card,
.report-method-card,
.report-threshold-card,
.report-table-wrap,
.pdf-report-summary-card,
.pdf-report-panel,
.pdf-report-method-tile,
.pdf-report-threshold-card,
.pdf-report-signoff-grid,
.pdf-report-table-wrap {
  break-inside: avoid;
  page-break-inside: avoid;
}

.evidence-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  margin: 14px 0 18px;
}

.evidence-card {
  min-height: 146px;
  padding: 14px;
  border: 1px solid var(--line);
  border-left-width: 5px;
  border-radius: 8px;
  background: #fff;
  display: grid;
  align-content: start;
  gap: 6px;
}

.evidence-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 680;
  text-transform: uppercase;
}

.evidence-card strong {
  font-size: 21px;
  line-height: 1.1;
}

.evidence-card p {
  color: var(--muted);
  font-size: 13px;
  margin: 0;
}

.evidence-card.ok {
  border-left-color: var(--green);
}

.evidence-card.review {
  border-left-color: var(--amber);
}

.evidence-card.hold {
  border-left-color: var(--red);
}

.evidence-crosswalk {
  margin: 12px 0 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}

.evidence-crosswalk div {
  display: grid;
  grid-template-columns: minmax(145px, 0.32fr) minmax(0, 1fr);
  gap: 14px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
}

.evidence-crosswalk div:last-child {
  border-bottom: 0;
}

.evidence-crosswalk strong {
  color: var(--ink);
}

.evidence-crosswalk span {
  color: var(--muted);
}

.customer-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  flex-wrap: wrap;
  align-items: center;
}

.topbar .brand-product-name,
.topbar .brand-from {
  display: none;
}

.demo-badge {
  min-height: 32px;
  border: 1px solid #d7b163;
  border-radius: 999px;
  background: #fff8e5;
  color: #6f4b08;
  padding: 6px 10px;
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 680;
  text-transform: uppercase;
  display: none !important;
}

.signed-out .shell {
  display: block !important;
  min-height: calc(100vh - 56px);
}

.signed-out .sidebar {
  display: none !important;
}

.signed-out .workspace {
  padding: 0;
  overflow: visible;
}

.navless-mode .shell {
  display: block;
  min-height: calc(100vh - 78px);
}

.navless-mode .topbar {
  background: rgba(3, 6, 7, 0.97);
  border-bottom-color: rgba(255, 255, 255, 0.12);
}

.navless-mode .customer-bar strong {
  color: #f7f3e8;
}

.navless-mode .customer-bar,
.navless-mode .customer-bar span,
.navless-mode .powered-by-link {
  color: rgba(247, 243, 232, 0.72);
}

.navless-mode .sidebar {
  display: none;
}

.signed-out .topbar {
  background: rgba(3, 6, 7, 0.97);
  border-bottom-color: rgba(255, 255, 255, 0.1);
}

.directory-mode {
  background: #030607;
  color: #f7f3e8;
}

.directory-mode .topbar {
  background: rgba(3, 6, 7, 0.97);
  border-bottom-color: rgba(255, 255, 255, 0.12);
}

.directory-mode .shell {
  min-height: calc(100vh - 78px - 44px);
}

.directory-mode .brand-product-name,
.directory-mode .customer-bar strong {
  color: #f7f3e8;
}

.directory-mode .brand-from,
.directory-mode .customer-bar,
.directory-mode .customer-bar span,
.directory-mode .powered-by-link {
  color: rgba(247, 243, 232, 0.72);
}

.navless-mode #signOutBtn,
.navless-mode #loginBtn {
  transition:
    border-color 0.18s ease,
    background-color 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.12s ease;
}

.navless-mode #signOutBtn:hover,
.navless-mode #signOutBtn:focus-visible,
.navless-mode #loginBtn:hover,
.navless-mode #loginBtn:focus-visible {
  border-color: rgba(199, 154, 50, 0.8);
  box-shadow:
    0 0 0 1px rgba(199, 154, 50, 0.28),
    0 0 20px rgba(199, 154, 50, 0.18);
  outline: none;
}

.navless-mode #signOutBtn:active,
.navless-mode #loginBtn:active {
  background: rgba(199, 154, 50, 0.96);
  border-color: #c79a32;
  color: #111111;
  box-shadow:
    0 0 0 1px rgba(199, 154, 50, 0.42),
    0 0 24px rgba(199, 154, 50, 0.24);
  transform: translateY(1px);
}

.signed-out .brand-product-name,
.signed-out .brand-from {
  display: none;
}

.signed-out .powered-by-link {
  color: rgba(247, 243, 232, 0.72);
}

.directory-mode .demo-badge {
  background: rgba(199, 154, 50, 0.12);
  border-color: rgba(199, 154, 50, 0.52);
  color: #ead08c;
}

.directory-mode .shell {
  display: block;
  min-height: calc(100vh - 78px);
}

.directory-mode .sidebar {
  display: none;
}

.directory-mode .workspace {
  padding: 0;
  overflow: visible;
}

.front-hero {
  min-height: clamp(500px, 72vh, 760px);
  padding: clamp(32px, 7vw, 88px);
  background:
    linear-gradient(90deg, rgba(17, 17, 17, 0.82), rgba(17, 17, 17, 0.45)),
    url("assets/kat-qa-hero-replaced-core.webp");
  background-size: cover;
  background-position: center;
  color: #fff;
  display: grid;
  align-items: center;
}

.front-hero-content {
  max-width: 780px;
}

.front-hero h2 {
  margin-bottom: 14px;
  font-size: clamp(34px, 5vw, 62px);
  line-height: 1.03;
}

.front-hero p {
  max-width: 660px;
  color: rgba(255, 255, 255, 0.86);
  font-size: 18px;
}

.front-hero .eyebrow {
  color: #a8d6ee;
}

.front-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 24px;
}

.front-actions .secondary {
  border-color: rgba(255, 255, 255, 0.72);
}

.front-note {
  margin-top: 12px;
  color: #e8eef2;
  font-size: 14px;
}

.front-stats,
.front-example-grid,
.front-section,
.front-workflow,
.privacy-band {
  width: min(1180px, calc(100% - 40px));
  margin: 22px auto;
}

.front-example-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 14px;
}

.front-example {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 18px;
  box-shadow: 0 10px 28px rgba(23, 32, 42, 0.05);
}

.front-example span {
  color: var(--muted);
  font-size: 13px;
}

.front-example strong {
  display: block;
  margin: 6px 0;
  font-size: 20px;
}

.front-example p {
  margin-bottom: 0;
  color: var(--muted);
}

.front-example.hold {
  border-color: #e7aaa7;
  background: #fff8f7;
}

.front-example.ok {
  border-color: #a9d1c3;
  background: #f4fbf7;
}

.front-example.review {
  border-color: #e1c280;
  background: #fffaf0;
}

.front-section {
  display: grid;
  grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1.25fr);
  gap: 22px;
  align-items: start;
  padding: 20px 0;
}

.front-proof-grid,
.portal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 14px;
}

.front-proof-grid article,
.front-workflow article,
.manual-card,
.manual-sections article {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 18px;
  box-shadow: 0 10px 28px rgba(23, 32, 42, 0.05);
}

.front-proof-grid span,
.front-workflow span,
.portal-tile span,
.portal-identity span {
  display: block;
  color: var(--muted);
  font-size: 13px;
}

.front-proof-grid strong,
.front-workflow strong {
  display: block;
  margin-bottom: 6px;
  font-size: 17px;
}

.front-proof-grid p {
  margin-bottom: 0;
  color: var(--muted);
}

.front-workflow {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap: 14px;
  padding-bottom: 32px;
}

.privacy-band {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #eef6fa;
  padding: 22px;
  display: grid;
  grid-template-columns: minmax(220px, 0.6fr) minmax(0, 1.4fr);
  gap: 18px;
  align-items: start;
}

.privacy-band p {
  margin-bottom: 0;
  color: var(--muted);
}

.directory-page.active {
  display: block;
}

.module-directory {
  position: relative;
  min-height: calc(100vh - 78px - 44px);
  padding: clamp(28px, 4vw, 62px);
  overflow: hidden;
  isolation: isolate;
  color: #f7f3e8;
  background:
    linear-gradient(90deg, rgba(1, 4, 5, 0.9) 0%, rgba(1, 4, 5, 0.74) 38%, rgba(1, 4, 5, 0.46) 100%),
    url("assets/yistiva-directory-lab.png") center / cover no-repeat;
}

.module-directory::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 18%),
    radial-gradient(circle at 18% 24%, rgba(39, 116, 95, 0.2), transparent 30%),
    radial-gradient(circle at 78% 18%, rgba(199, 154, 50, 0.16), transparent 26%);
  pointer-events: none;
}

.directory-scrim {
  position: absolute;
  inset: auto 0 0;
  height: 42%;
  z-index: -1;
  background: linear-gradient(0deg, rgba(1, 4, 5, 0.86), transparent);
  pointer-events: none;
}

.directory-content {
  width: min(100%, 1220px);
  margin: 0 auto;
  display: grid;
  gap: 24px;
  padding-bottom: clamp(76px, 10vh, 116px);
}

.directory-head {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  align-items: start;
}

.directory-copy {
  max-width: 560px;
  padding-top: clamp(12px, 4vh, 42px);
}

.directory-copy h2 {
  max-width: 460px;
  margin-bottom: 0;
  color: #fff;
  font-size: clamp(30px, 4.6vw, 54px);
  line-height: 0.98;
  letter-spacing: 0;
}

.qa-directory .directory-copy h2 {
  max-width: none;
  font-size: clamp(42px, 6vw, 82px);
}

.qa-directory .directory-copy .tm {
  margin-left: 0.08em;
  font-size: 0.18em;
  vertical-align: super;
  letter-spacing: 0;
  font-weight: 620;
}

.portal-title-wordmark {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.12em 0.18em;
  white-space: normal;
}

.portal-title-wordmark .yistiva-mark {
  font: inherit;
  line-height: inherit;
}

.portal-title-wordmark .tm {
  margin-left: 0.08em;
  font-size: 0.18em;
  vertical-align: super;
  letter-spacing: 0;
  font-weight: 620;
}

.portal-title-tail {
  color: #ffffff;
}

.directory-copy .muted:empty {
  display: none;
}

.directory-actions {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding-top: clamp(18px, 4vh, 54px);
}

.directory-actions .secondary {
  min-width: 124px;
  font-weight: 600;
}

.qa-directory {
  background:
    linear-gradient(90deg, rgba(1, 4, 5, 0.94) 0%, rgba(1, 4, 5, 0.74) 34%, rgba(1, 4, 5, 0.42) 100%),
    url("assets/yistiva-qa-directory-lab.png") center / cover no-repeat;
}

.setup-directory {
  background:
    linear-gradient(90deg, rgba(1, 4, 5, 0.94) 0%, rgba(1, 4, 5, 0.74) 34%, rgba(1, 4, 5, 0.42) 100%),
    url("assets/yistiva-directory-lab.png") center / cover no-repeat;
}

.people-directory {
  background:
    linear-gradient(90deg, rgba(1, 4, 5, 0.94) 0%, rgba(1, 4, 5, 0.74) 34%, rgba(1, 4, 5, 0.42) 100%),
    url("assets/yistiva-qa-directory-lab.png") center / cover no-repeat;
}

.work-directory {
  background:
    linear-gradient(90deg, rgba(1, 4, 5, 0.94) 0%, rgba(1, 4, 5, 0.74) 34%, rgba(1, 4, 5, 0.42) 100%),
    url("assets/yistiva-directory-lab.png") center / cover no-repeat;
}

.sample-directory {
  background:
    linear-gradient(90deg, rgba(1, 4, 5, 0.94) 0%, rgba(1, 4, 5, 0.74) 34%, rgba(1, 4, 5, 0.42) 100%),
    url("assets/yistiva-directory-lab.png") center / cover no-repeat;
}

.manuals-directory {
  background:
    linear-gradient(90deg, rgba(1, 4, 5, 0.94) 0%, rgba(1, 4, 5, 0.74) 34%, rgba(1, 4, 5, 0.42) 100%),
    url("assets/yistiva-qa-directory-lab.png") center / cover no-repeat;
}

.qa-directory::after {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.03), transparent 18%),
    radial-gradient(circle at 20% 28%, rgba(39, 116, 95, 0.18), transparent 34%),
    radial-gradient(circle at 74% 22%, rgba(199, 154, 50, 0.14), transparent 28%);
}

.qa-directory .directory-copy {
  max-width: 620px;
  padding-top: clamp(20px, 6vh, 64px);
}

.module-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin: 0 0 14px;
  color: rgba(234, 232, 226, 0.82);
  font-size: 12px;
  font-weight: 580;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.directory-breadcrumb {
  margin-bottom: 18px;
}

.module-breadcrumb > span:not(.breadcrumb-sep) {
  color: rgba(234, 232, 226, 0.88) !important;
}

.breadcrumb-sep {
  color: rgba(234, 232, 226, 0.58) !important;
}

.breadcrumb-link {
  all: unset;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  color: rgba(234, 232, 226, 0.88) !important;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent !important;
  font: inherit;
  font-weight: 580;
  letter-spacing: inherit;
  text-transform: inherit;
  box-shadow: none;
  appearance: none;
  -webkit-appearance: none;
}

.breadcrumb-link:hover,
.breadcrumb-link:focus-visible {
  color: #c79a32 !important;
  text-shadow:
    0 0 10px rgba(199, 154, 50, 0.28),
    0 0 20px rgba(199, 154, 50, 0.16);
  filter: none;
  outline: none;
}

.breadcrumb-link:active {
  color: #c79a32;
  transform: none;
}

.app-footer {
  display: none;
}

.directory-mode .app-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 6px 18px 14px;
  color: rgba(247, 243, 232, 0.56);
  font-size: 11px;
  font-weight: 550;
  letter-spacing: 0.01em;
  pointer-events: none;
  text-align: center;
  background: #030607;
}

.module-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(224px, 1fr));
  gap: 12px;
  align-items: stretch;
}

.module-roadmap {
  display: grid;
  gap: 12px;
  margin-top: 6px;
  padding: 16px 18px 18px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  background: rgba(7, 12, 13, 0.46);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.16);
}

.module-roadmap-head {
  display: grid;
  gap: 4px;
}

.module-roadmap-head span {
  color: rgba(234, 208, 140, 0.84);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.module-roadmap-head strong {
  color: #fff;
  font-size: 18px;
  line-height: 1.1;
}

.module-roadmap-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(196px, 1fr));
  gap: 10px;
}

.module-roadmap-card {
  position: relative;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.03);
}

.module-roadmap-ribbon {
  display: inline-block;
  margin-bottom: 8px;
  color: rgba(234, 208, 140, 0.86);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.module-roadmap-card strong {
  display: block;
  color: rgba(247, 243, 232, 0.9);
  font-size: 14px;
  line-height: 1.2;
}

.module-roadmap-card p {
  margin: 6px 0 0;
  color: rgba(247, 243, 232, 0.56);
  font-size: 12px;
  line-height: 1.35;
}

/* Portal module tiles — aligned to the app's card system (`.qa-hub-status-card`
   / `.module-card`): 10px radius, the same dark gradient surface, restrained type,
   and a dense grid. These read as software navigation, not marketing panels. */
.module-tile {
  min-height: 132px;
  padding: 15px 16px 14px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(7, 12, 13, 0.88), rgba(7, 12, 13, 0.72)),
    rgba(7, 12, 13, 0.74);
  color: rgba(247, 243, 232, 0.72);
  text-align: left;
  display: grid;
  grid-template-rows: auto auto auto 1fr;
  gap: 7px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.22);
  transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease, transform 160ms ease;
}

.module-visual {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2px;
}

.module-icon {
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015)),
    rgba(9, 14, 16, 0.9);
  color: rgba(234, 208, 140, 0.9);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.module-icon svg {
  width: 18px;
  height: 18px;
  display: block;
}

.module-arrow {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.34);
  transition: transform 160ms ease, color 160ms ease, opacity 160ms ease;
}

.module-arrow svg {
  width: 17px;
  height: 17px;
  display: block;
}

.module-tile strong {
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0.005em;
}

.module-tile small {
  color: rgba(247, 243, 232, 0.6);
  font-size: 12.5px;
  line-height: 1.42;
}

.module-meta {
  color: rgba(234, 208, 140, 0.82);
  font-size: 10.5px;
  font-weight: 650;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.module-tile.enabled {
  border-color: rgba(255, 255, 255, 0.14);
  background:
    linear-gradient(135deg, rgba(39, 116, 95, 0.16), rgba(7, 12, 13, 0.82) 62%),
    rgba(7, 12, 13, 0.74);
  cursor: pointer;
}

.module-tile.enabled:hover,
.module-tile.enabled:focus-visible {
  border-color: rgba(105, 218, 172, 0.7);
  color: #fff;
  outline: none;
  transform: translateY(-2px);
  box-shadow:
    0 0 0 1px rgba(105, 218, 172, 0.2),
    0 20px 56px rgba(0, 0, 0, 0.32),
    0 0 34px rgba(39, 116, 95, 0.18);
}

.module-tile.enabled:hover .module-arrow,
.module-tile.enabled:focus-visible .module-arrow {
  color: #9befca;
  transform: translateX(3px);
}

.module-tile.enabled:hover .module-icon,
.module-tile.enabled:focus-visible .module-icon {
  border-color: rgba(105, 218, 172, 0.44);
  color: #f0d391;
  background:
    linear-gradient(180deg, rgba(105, 218, 172, 0.08), rgba(255, 255, 255, 0.01)),
    rgba(8, 13, 15, 0.96);
}

.module-tile.selected {
  border-color: #69daac;
  box-shadow:
    inset 0 0 0 2px rgba(105, 218, 172, 0.9),
    0 24px 80px rgba(0, 0, 0, 0.42),
    0 0 54px rgba(39, 116, 95, 0.34);
}

.module-tile.selected .module-icon {
  border-color: rgba(105, 218, 172, 0.62);
}

.module-tile.coming-soon {
  opacity: 0.62;
  cursor: not-allowed;
}

.module-tile.coming-soon .module-icon {
  color: rgba(214, 214, 214, 0.62);
  border-color: rgba(255, 255, 255, 0.08);
}

.module-tile.coming-soon strong,
.module-tile.coming-soon small,
.module-tile.coming-soon .module-meta {
  color: rgba(247, 243, 232, 0.58);
}

.qa-hub-shell {
  display: grid;
  grid-template-columns: minmax(250px, 290px) minmax(0, 1fr);
  gap: 22px;
  align-items: start;
}

.qa-hub-nav {
  position: sticky;
  top: 18px;
  padding: 18px 16px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(8, 13, 15, 0.92), rgba(6, 9, 11, 0.78)),
    rgba(7, 12, 13, 0.78);
  box-shadow: 0 18px 54px rgba(0, 0, 0, 0.28);
}

.qa-hub-nav-group + .qa-hub-nav-group {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.qa-hub-nav-group header {
  display: grid;
  gap: 2px;
  margin-bottom: 10px;
}

.qa-hub-nav-label {
  color: rgba(247, 243, 232, 0.88);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.qa-hub-nav-detail {
  color: rgba(247, 243, 232, 0.44);
  font-size: 12px;
}

.qa-hub-nav-list {
  display: grid;
  gap: 8px;
}

.qa-hub-nav-button {
  width: 100%;
  min-height: 60px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.02);
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  text-align: left;
  color: rgba(247, 243, 232, 0.84);
}

.qa-hub-nav-button:hover,
.qa-hub-nav-button:focus-visible {
  background: rgba(199, 154, 50, 0.14);
  border-color: rgba(199, 154, 50, 0.7);
  color: #fff;
  outline: none;
  box-shadow:
    0 0 0 1px rgba(199, 154, 50, 0.18),
    0 0 26px rgba(199, 154, 50, 0.12);
}

/* QMS hub nav: no icon column; on-page section switching needs active + planned states. */
.qms-nav .qa-hub-nav-button {
  grid-template-columns: minmax(0, 1fr) auto;
}
.qms-nav .qa-hub-nav-button.active {
  background: rgba(199, 154, 50, 0.18);
  border-color: rgba(199, 154, 50, 0.8);
  color: #fff;
}
.qms-nav .qa-hub-nav-button.coming-soon {
  opacity: 0.55;
  cursor: default;
}
.qms-nav .qa-hub-nav-button.coming-soon:hover {
  background: rgba(255, 255, 255, 0.02);
  border-color: rgba(255, 255, 255, 0.08);
  color: rgba(247, 243, 232, 0.84);
  box-shadow: none;
}

.qa-hub-nav-icon,
.qa-hub-priority-icon {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015)),
    rgba(9, 14, 16, 0.9);
  color: rgba(234, 208, 140, 0.9);
}

.qa-hub-nav-icon svg,
.qa-hub-priority-icon svg,
.qa-hub-priority-arrow svg {
  width: 18px;
  height: 18px;
  display: block;
}

.qa-hub-nav-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.qa-hub-nav-copy strong {
  color: #fff;
  font-size: 15px;
  line-height: 1.1;
}

.qa-hub-nav-copy small {
  color: rgba(247, 243, 232, 0.46);
  font-size: 12px;
  line-height: 1.3;
}

.qa-hub-nav-signal,
.qa-hub-priority-signal {
  color: rgba(247, 243, 232, 0.72);
  font-size: 12px;
  font-weight: 580;
}

.qa-hub-nav-signal.ok,
.qa-hub-priority-signal.ok {
  color: #9befca;
}

.qa-hub-nav-signal.review,
.qa-hub-priority-signal.review {
  color: #ead08c;
}

.qa-hub-nav-signal.hold,
.qa-hub-priority-signal.hold {
  color: #f0a7a1;
}

.qa-hub-main {
  display: grid;
  gap: 18px;
}

.qa-hub-command,
.qa-hub-action-list,
.qa-hub-method-strip {
  display: grid;
}

.qa-hub-command-card,
.qa-hub-surface {
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(7, 12, 13, 0.9), rgba(7, 12, 13, 0.76)),
    rgba(7, 12, 13, 0.78);
  box-shadow: 0 18px 54px rgba(0, 0, 0, 0.22);
}

.qa-hub-command-card {
  display: grid;
  gap: 18px;
}

.qa-hub-command-card.ok {
  border-color: rgba(105, 218, 172, 0.34);
}

.qa-hub-command-card.review {
  border-color: rgba(234, 208, 140, 0.34);
}

.qa-hub-command-card.hold {
  border-color: rgba(240, 167, 161, 0.34);
}

.qa-hub-command-copy {
  display: grid;
  gap: 8px;
}

.qa-hub-command-label,
.qa-hub-surface-head span {
  color: rgba(234, 208, 140, 0.84);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.qa-hub-command-copy strong,
.qa-hub-surface-head strong {
  color: #fff;
  font-size: 32px;
  line-height: 1.02;
}

.qa-hub-command-copy p {
  margin: 0;
  color: rgba(247, 243, 232, 0.74);
  font-size: 14px;
  line-height: 1.45;
}

.qa-hub-command-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.qa-hub-command-stat {
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
}

.qa-hub-command-stat span {
  display: block;
  color: rgba(247, 243, 232, 0.56);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.qa-hub-command-stat strong {
  display: block;
  margin-top: 6px;
  color: #fff;
  font-size: 28px;
  line-height: 1;
}

.qa-hub-command-stat.ok {
  border-color: rgba(105, 218, 172, 0.3);
}

.qa-hub-command-stat.review {
  border-color: rgba(234, 208, 140, 0.3);
}

.qa-hub-command-stat.hold {
  border-color: rgba(240, 167, 161, 0.3);
}

.qa-hub-surface {
  display: grid;
  gap: 14px;
}

.qa-hub-surface-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.qa-hub-surface-head strong {
  font-size: 22px;
}

.qa-hub-surface-meta {
  color: rgba(247, 243, 232, 0.56);
  font-size: 12px;
  line-height: 1.35;
  text-align: right;
}

.qa-hub-actions {
  display: grid;
  gap: 10px;
}

.qa-hub-action-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
}

.qa-hub-action-item.review {
  border-color: rgba(234, 208, 140, 0.28);
}

.qa-hub-action-item.hold {
  border-color: rgba(240, 167, 161, 0.28);
}

.qa-hub-action-main,
.qa-hub-action-side,
.qa-hub-action-top {
  display: grid;
}

.qa-hub-action-top {
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: center;
}

.qa-hub-action-top strong {
  color: #fff;
  font-size: 20px;
  line-height: 1.05;
}

.qa-hub-action-main p {
  margin: 8px 0 0;
  color: #fff;
  font-size: 15px;
  line-height: 1.35;
}

.qa-hub-action-main small,
.qa-hub-action-side span,
.qa-hub-empty-state p,
.qa-hub-overflow-note {
  color: rgba(247, 243, 232, 0.62);
  font-size: 13px;
  line-height: 1.45;
}

.qa-hub-action-main small {
  display: block;
  margin-top: 7px;
}

.qa-hub-action-facts {
  display: grid;
  gap: 6px;
  margin: 10px 0 0;
}

.qa-hub-action-facts div {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 10px;
  align-items: baseline;
}

.qa-hub-action-facts dt {
  color: rgba(234, 208, 140, 0.78);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.qa-hub-action-facts dd {
  margin: 0;
  color: rgba(247, 243, 232, 0.76);
  font-size: 13px;
  line-height: 1.35;
}

.dashboard-asset-details,
.dashboard-action-asset-note {
  margin-top: 10px;
  color: rgba(247, 243, 232, 0.72);
  font-size: 12px;
  line-height: 1.35;
}

.dashboard-asset-details summary {
  cursor: pointer;
  color: rgba(234, 208, 140, 0.9);
  font-weight: 620;
}

.dashboard-asset-details div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.dashboard-asset-details span,
.dashboard-action-asset-note {
  display: inline-flex;
  padding: 4px 8px;
  border: 1px solid rgba(240, 167, 161, 0.28);
  border-radius: 999px;
  background: rgba(240, 167, 161, 0.08);
}

.dashboard-action-asset-note.review {
  border-color: rgba(234, 208, 140, 0.28);
  background: rgba(234, 208, 140, 0.08);
}

.qa-hub-action-side {
  min-width: 240px;
  justify-items: end;
  gap: 12px;
  text-align: right;
}

.qa-hub-action-buttons {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.qa-hub-empty-state {
  padding: 18px 20px;
  border: 1px solid rgba(105, 218, 172, 0.24);
  border-radius: 8px;
  background: rgba(105, 218, 172, 0.04);
}

.qa-hub-empty-state strong {
  display: block;
  color: #fff;
  font-size: 18px;
  line-height: 1.15;
}

.qa-hub-overflow-note {
  margin: 0;
}

.tasks-layout {
  display: grid;
  gap: 16px;
}

.tasks-panel {
  display: grid;
  gap: 14px;
}

.qa-task-list {
  display: grid;
  gap: 10px;
}

.qa-task-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  padding: 14px 16px;
  border: 1px solid rgba(19, 26, 28, 0.1);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(11, 17, 18, 0.04);
}

.qa-task-item.ok {
  border-color: rgba(69, 156, 119, 0.34);
}

.qa-task-item.review {
  border-color: rgba(199, 154, 50, 0.38);
}

.qa-task-item.hold {
  border-color: rgba(204, 96, 88, 0.34);
}

.qa-task-main,
.qa-task-side,
.qa-task-top {
  display: grid;
}

.qa-task-top {
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: center;
}

.qa-task-top small {
  color: rgba(24, 31, 33, 0.58);
  font-size: 12px;
  line-height: 1.35;
}

.qa-task-main strong {
  color: #12181a;
  font-size: 20px;
  line-height: 1.08;
}

.qa-task-main p {
  margin: 8px 0 0;
  color: rgba(24, 31, 33, 0.86);
  font-size: 14px;
  line-height: 1.45;
}

.qa-task-note {
  margin-top: 8px;
  color: rgba(24, 31, 33, 0.62);
  font-size: 12px;
  line-height: 1.4;
}

.qa-task-side {
  min-width: 220px;
  justify-items: end;
  gap: 12px;
  text-align: right;
}

.qa-task-side span {
  color: rgba(24, 31, 33, 0.66);
  font-size: 13px;
  line-height: 1.4;
}

.qa-task-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.qa-hub-method-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.qa-hub-method-pill {
  min-height: 108px;
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  background: rgba(17, 17, 17, 0.68);
  display: grid;
  gap: 8px;
  text-align: left;
  color: rgba(247, 243, 232, 0.82);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.qa-hub-method-pill strong {
  color: #fff;
  font-size: 18px;
  line-height: 1.06;
}

.qa-hub-method-pill span {
  color: rgba(234, 208, 140, 0.92);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.qa-hub-method-pill small {
  color: rgba(247, 243, 232, 0.58);
  font-size: 12px;
  line-height: 1.35;
}

.qa-hub-method-pill.ok {
  border-color: rgba(105, 218, 172, 0.38);
  background:
    linear-gradient(180deg, rgba(105, 218, 172, 0.13), rgba(17, 17, 17, 0.78) 68%),
    rgba(17, 17, 17, 0.76);
}

.qa-hub-method-pill.review {
  border-color: rgba(234, 208, 140, 0.42);
  background:
    linear-gradient(180deg, rgba(234, 208, 140, 0.15), rgba(17, 17, 17, 0.8) 68%),
    rgba(17, 17, 17, 0.76);
}

.qa-hub-method-pill.hold {
  border-color: rgba(240, 167, 161, 0.42);
  background:
    linear-gradient(180deg, rgba(240, 167, 161, 0.16), rgba(17, 17, 17, 0.82) 68%),
    rgba(17, 17, 17, 0.76);
}

.qa-hub-method-pill.ok span {
  color: rgba(143, 232, 188, 0.96);
}

.qa-hub-method-pill.review span {
  color: rgba(234, 208, 140, 0.98);
}

.qa-hub-method-pill.hold span {
  color: rgba(247, 178, 171, 0.98);
}

.qa-hub-method-pill.locked {
  cursor: default;
  border-color: rgba(255, 255, 255, 0.14);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(17, 17, 17, 0.82) 68%),
    rgba(17, 17, 17, 0.76);
}

.qa-hub-method-pill.locked span {
  color: rgba(234, 208, 140, 0.9);
}

.qa-hub-method-pill.locked small {
  color: rgba(247, 243, 232, 0.62);
}

.qa-hub-method-pill:hover,
.qa-hub-method-pill:focus-visible {
  border-color: rgba(199, 154, 50, 0.82);
  color: #fff;
  outline: none;
  box-shadow:
    0 0 0 1px rgba(199, 154, 50, 0.18),
    0 18px 44px rgba(0, 0, 0, 0.28),
    0 0 28px rgba(199, 154, 50, 0.12);
}

.qa-hub-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.qa-hub-status-card,
.qa-hub-preview-card {
  padding: 16px 18px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(7, 12, 13, 0.88), rgba(7, 12, 13, 0.72)),
    rgba(7, 12, 13, 0.74);
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.22);
}

.qa-hub-status-card span,
.qa-hub-preview-card span {
  display: block;
  color: rgba(247, 243, 232, 0.54);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.qa-hub-status-card strong,
.qa-hub-preview-card strong {
  display: block;
  margin-top: 6px;
  color: #fff;
  font-size: 28px;
  line-height: 1;
}

.qa-hub-status-card p,
.qa-hub-preview-card p {
  margin: 10px 0 0;
  color: rgba(247, 243, 232, 0.72);
  font-size: 13px;
  line-height: 1.4;
}

/* Tone variants (ok/review/hold). A 34%-opacity border tint alone was
   near-imperceptible on the dark card, so tone now reads through two
   redundant cues: a solid left accent bar (the file's inset-shadow idiom)
   and a tone-coloured label. The value stays #fff for maximum contrast —
   the surface is dark, so white is correct here. Each tone sets --tone
   once; the shared rules below consume it. */
.qa-hub-status-card.ok,
.qa-hub-status-card.review,
.qa-hub-status-card.hold {
  box-shadow: inset 4px 0 0 var(--tone), 0 16px 48px rgba(0, 0, 0, 0.22);
}

.qa-hub-status-card.ok span,
.qa-hub-status-card.review span,
.qa-hub-status-card.hold span {
  color: var(--tone);
}

.qa-hub-status-card.ok {
  --tone: rgb(105, 218, 172);
  border-color: rgba(105, 218, 172, 0.45);
}

.qa-hub-status-card.review {
  --tone: rgb(234, 208, 140);
  border-color: rgba(234, 208, 140, 0.45);
}

.qa-hub-status-card.hold {
  --tone: rgb(240, 167, 161);
  border-color: rgba(240, 167, 161, 0.45);
}

.qa-hub-priority-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.qa-hub-priority-card {
  min-height: 208px;
  padding: 18px;
  border: 1px solid rgba(199, 154, 50, 0.44);
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(39, 116, 95, 0.22), rgba(7, 12, 13, 0.82) 60%),
    rgba(7, 12, 13, 0.8);
  display: grid;
  grid-template-rows: auto auto auto 1fr auto;
  gap: 10px;
  text-align: left;
  color: rgba(247, 243, 232, 0.86);
}

.qa-hub-priority-card:hover,
.qa-hub-priority-card:focus-visible {
  border-color: rgba(199, 154, 50, 0.88);
  background:
    linear-gradient(135deg, rgba(39, 116, 95, 0.28), rgba(7, 12, 13, 0.86) 60%),
    rgba(7, 12, 13, 0.84);
  box-shadow:
    0 0 0 1px rgba(199, 154, 50, 0.18),
    0 20px 56px rgba(0, 0, 0, 0.32),
    0 0 34px rgba(199, 154, 50, 0.12);
  outline: none;
}

.qa-hub-priority-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.qa-hub-priority-arrow {
  color: rgba(247, 243, 232, 0.4);
}

.qa-hub-priority-kicker {
  color: rgba(234, 208, 140, 0.84);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.qa-hub-priority-card strong {
  color: #fff;
  font-size: 24px;
  line-height: 1.05;
}

.qa-hub-priority-card p {
  margin: 0;
  color: rgba(247, 243, 232, 0.72);
  font-size: 14px;
  line-height: 1.42;
}

.qa-hub-group-preview {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.qa-hub-preview-card small {
  display: block;
  margin-top: 10px;
  color: rgba(247, 243, 232, 0.44);
  font-size: 12px;
  line-height: 1.45;
}

.module-qms .module-icon,
.module-enterprise .module-icon {
  color: rgba(175, 210, 240, 0.88);
}

.module-samples .module-icon,
.module-chemicals .module-icon {
  color: rgba(214, 193, 141, 0.9);
}

.module-data .module-icon,
.module-reports .module-icon {
  color: rgba(170, 220, 202, 0.88);
}

.module-dashboard .module-icon,
.module-analytics .module-icon,
.module-database .module-icon {
  color: rgba(170, 220, 202, 0.9);
}

.module-home .module-icon,
.module-subscription .module-icon,
.module-manual .module-icon {
  color: rgba(234, 208, 140, 0.9);
}

.module-entry .module-icon,
.module-run .module-icon,
.module-audit .module-icon {
  color: rgba(176, 205, 238, 0.9);
}

.module-method .module-icon,
.module-rules .module-icon {
  color: rgba(157, 233, 194, 0.92);
}

.module-people .module-icon {
  color: rgba(207, 188, 234, 0.86);
}

.manual-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

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

.manual-card {
  position: sticky;
  top: 104px;
}

.manual-card strong {
  display: block;
  margin-bottom: 8px;
  font-size: 18px;
}

.manual-sections {
  display: grid;
  gap: 14px;
}

.manual-sections ul {
  margin: 0;
  padding-left: 20px;
  color: var(--muted);
}

.manual-sections li + li {
  margin-top: 7px;
}

/* Expanded manual: contents index + document body */
.manual-toc {
  position: sticky;
  top: 104px;
  align-self: start;
  max-height: calc(100vh - 130px);
  overflow: auto;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  box-shadow: var(--shadow);
}

.manual-toc > strong {
  display: block;
  font-size: 16px;
  margin: 2px 0 6px;
}

.manual-toc-intro {
  margin: 0 0 14px;
  color: var(--muted);
  font-size: 13px;
}

.manual-toc-eyebrow {
  margin-top: 6px;
}

.manual-toc-list {
  list-style: none;
  margin: 6px 0 0;
  padding: 0;
  display: grid;
  gap: 2px;
}

.manual-toc-link {
  width: 100%;
  min-height: 0;
  text-align: left;
  padding: 6px 9px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: var(--ink);
  font-weight: 550;
  font-size: 13px;
  cursor: pointer;
}

.manual-toc-link:hover {
  background: var(--soft);
}

.manual-toc-link:focus-visible {
  outline: none;
  border-color: var(--blue);
}

.manual-body {
  padding: 26px 30px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  box-shadow: var(--shadow);
  max-width: 880px;
}

.manual-doc-head {
  margin-bottom: 8px;
  padding-bottom: 16px;
  border-bottom: 2px solid var(--ink);
}

.manual-doc-head h1 {
  margin: 0 0 4px;
  font-size: 26px;
}

.manual-doc-head .muted {
  margin: 0;
}

.manual-section {
  padding: 22px 0;
  border-bottom: 1px solid var(--line);
  scroll-margin-top: 96px;
}

.manual-section:last-child {
  border-bottom: 0;
}

.manual-section h3 {
  margin: 0 0 12px;
  font-size: 18px;
}

.manual-section p {
  margin: 0 0 12px;
  color: #25221c;
}

.manual-section ul,
.manual-section ol {
  margin: 0 0 12px;
  padding-left: 22px;
  color: #25221c;
}

.manual-section li + li {
  margin-top: 6px;
}

.manual-section code {
  font-family: "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 0.86em;
  padding: 1px 6px;
  border-radius: 5px;
  background: var(--soft);
  color: var(--ink);
}

.manual-deeplink {
  min-height: 0;
  padding: 0;
  border: 0;
  background: none;
  color: var(--blue);
  font-weight: 560;
  cursor: pointer;
}

.manual-deeplink:hover {
  text-decoration: underline;
}

.manual-deeplink:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
  border-radius: 3px;
}

.manual-table {
  width: 100%;
  min-width: 0; /* override the global `table { min-width: 980px }` so fixed layout fits the panel */
  table-layout: fixed;
  border-collapse: collapse;
  margin: 4px 0 14px;
  font-size: 13px;
}

.manual-table th,
.manual-table td {
  text-align: left;
  vertical-align: top;
  padding: 8px 11px;
  border: 1px solid var(--line);
  overflow-wrap: anywhere;
}

.manual-table thead th {
  background: var(--soft);
  font-weight: 620;
}

.manual-table tbody tr:nth-child(even) {
  background: rgba(238, 233, 221, 0.32);
}

.manual-glossary {
  margin: 0;
  display: grid;
  gap: 10px;
}

.manual-def {
  display: grid;
  grid-template-columns: minmax(150px, 220px) 1fr;
  gap: 12px;
  padding-bottom: 10px;
  border-bottom: 1px dashed var(--line);
}

.manual-def dt {
  margin: 0;
  font-weight: 620;
}

.manual-def dd {
  margin: 0;
  color: var(--muted);
}

.manual-top-link {
  min-height: 0;
  margin-top: 4px;
  padding: 2px 0;
  border: 0;
  background: none;
  color: var(--muted);
  font-size: 12px;
  font-weight: 550;
  cursor: pointer;
}

.manual-top-link:hover {
  color: var(--blue);
}

@media (max-width: 900px) {
  .manual-layout {
    grid-template-columns: 1fr;
  }
  .manual-toc {
    position: static;
    max-height: none;
  }
  .manual-body {
    padding: 20px;
  }
  .manual-def {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}

.role-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.signed-out .topbar {
  justify-content: flex-start;
  min-height: 56px;
  padding: 8px 22px;
  border-bottom-color: rgba(248, 247, 243, 0.12);
  background: #070a0d;
  color: #f8f7f3;
}

.signed-out .customer-bar {
  display: none;
}

.signed-out .brand {
  gap: 0;
}

.signed-out .brand-lockup,
.signed-out .brand-endorsement {
  gap: 0;
}

.signed-out .brand-endorsement {
  padding-bottom: 0;
}

.signed-out .powered-by-link {
  gap: 0;
  color: rgba(248, 247, 243, 0.62);
  background: transparent;
  border: 0;
  box-shadow: none;
}

.signed-out .powered-by-link span {
  font-size: 10px;
  letter-spacing: 0;
}

.signed-out .customer-actions .secondary {
  background: transparent;
  color: #f8f7f3;
  border-color: rgba(248, 247, 243, 0.22);
}

.signed-out .kat-logo {
  width: 94px;
  border-radius: 0;
  background: transparent;
  padding: 0;
}

.signed-out .customer-bar .demo-badge {
  background: rgba(248, 247, 243, 0.96);
  border-color: rgba(199, 154, 50, 0.72);
  color: #6f4b08;
}

.qa-launch-screen {
  position: relative;
  min-height: calc(100vh - 56px);
  overflow: hidden;
  isolation: isolate;
  color: #f8f7f3;
  background: #070a0d;
  --launch-title-x: clamp(28px, 5vw, 72px);
  --launch-title-top: clamp(130px, 23vh, 230px);
  --launch-title-size: clamp(42px, 7vw, 88px);
  --logo-rise-start: clamp(190px, 34vh, 360px);
}

.qa-launch-screen::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -3;
  background: url("assets/yistiva-launch-poster.png");
  background-size: cover;
  background-position: center;
}

.qa-launch-screen::after {
  content: none;
}

.launch-loader {
  position: absolute;
  inset: 0;
  z-index: 8;
  overflow: hidden;
  background: #05080a;
  animation: loaderOut 4.22s linear forwards;
  pointer-events: none;
}

.launch-video {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1;
}

.launch-video-disabled .launch-video {
  display: none;
}

.cinema-bg {
  position: absolute;
  inset: -9%;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(5, 8, 10, 0.92), rgba(5, 8, 10, 0.22) 56%, rgba(5, 8, 10, 0.56)),
    url("assets/yistiva-launch-poster.png");
  background-size: cover;
  background-position: 58% center;
  filter: none;
  transform-origin: 64% 38%;
}

.cinema-vignette {
  position: absolute;
  inset: 0;
  z-index: 3;
  background:
    radial-gradient(circle at 76% 43%, rgba(255, 255, 255, 0.11), transparent 15%),
    radial-gradient(circle at 74% 57%, rgba(86, 180, 233, 0.17), transparent 25%),
    linear-gradient(0deg, rgba(5, 8, 10, 0.62), transparent 48%, rgba(5, 8, 10, 0.48));
  animation: cinematicGlow 3.55s ease-out forwards;
}

.cinema-lightfield,
.cinema-aura {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
}

.cinema-lightfield {
  background:
    radial-gradient(ellipse at 73% 43%, rgba(248, 247, 243, 0.26), transparent 13%),
    radial-gradient(ellipse at 72% 70%, rgba(199, 154, 50, 0.16), transparent 18%),
    radial-gradient(ellipse at 48% 53%, rgba(86, 180, 233, 0.18), transparent 24%),
    radial-gradient(ellipse at 85% 20%, rgba(248, 247, 243, 0.12), transparent 18%);
  mix-blend-mode: screen;
  animation: lightfieldSettle 3.55s ease-out forwards;
}

.cinema-aura {
  background:
    linear-gradient(132deg, transparent 0 48%, rgba(248, 247, 243, 0.13) 52%, transparent 60%),
    radial-gradient(circle at 69% 50%, rgba(86, 180, 233, 0.13), transparent 26%);
  opacity: 0;
  transform: scale(1.035);
  animation: apertureSettle 3.55s cubic-bezier(.2, .8, .2, 1) forwards;
}

.cinema-probe {
  position: absolute;
  z-index: 5;
  right: clamp(80px, 18vw, 300px);
  top: clamp(155px, 25vh, 275px);
  width: 104px;
  height: 104px;
  border: 1px solid rgba(86, 180, 233, 0.58);
  border-radius: 999px;
  opacity: 0;
  box-shadow:
    0 0 28px rgba(86, 180, 233, 0.28),
    inset 0 0 22px rgba(86, 180, 233, 0.12);
  animation: probePulse 3.2s ease-out .42s forwards;
}

.cinema-probe::before,
.cinema-probe::after {
  content: "";
  position: absolute;
  inset: 16px;
  border: 1px solid rgba(199, 154, 50, 0.42);
  border-radius: inherit;
}

.cinema-probe::after {
  inset: -18px;
  border-color: rgba(86, 180, 233, 0.18);
}

.cinema-logo {
  position: absolute;
  z-index: 5;
  left: var(--launch-title-x);
  top: var(--launch-title-top);
  display: flex;
  align-items: center;
  gap: 14px;
  opacity: 0;
  transform-origin: left top;
  transform: translate3d(0, var(--logo-rise-start), 0) scale(.52);
  backface-visibility: hidden;
  will-change: transform, opacity;
  animation:
    cinemaLogoLand 4.12s cubic-bezier(.12, .78, .08, 1) forwards,
    cinemaLogoFade 1.05s ease-out .12s forwards;
}

.cinema-logo strong {
  display: block;
  color: #fff;
  font-size: var(--launch-title-size);
  line-height: .92;
  letter-spacing: 0;
}

.loader-line {
  position: absolute;
  z-index: 7;
  left: var(--launch-title-x);
  right: var(--launch-title-x);
  bottom: 18px;
  height: 2px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(248, 247, 243, 0.16);
}

.loader-line span {
  display: block;
  height: 100%;
  width: 72%;
  border-radius: inherit;
  background: linear-gradient(90deg, #27745f, #56b4e9, #c79a32);
  animation: loaderLine 3.85s cubic-bezier(.42, 0, .18, 1) forwards;
}

.qa-launch-content {
  position: relative;
  z-index: 1;
  min-height: calc(100vh - 56px);
  display: grid;
  grid-template-columns: minmax(320px, 760px);
  gap: 0;
  align-items: start;
  padding: var(--launch-title-top) var(--launch-title-x) clamp(28px, 5vw, 72px);
}

.qa-launch-copy {
  max-width: 760px;
  display: grid;
  gap: 16px;
  animation: launchRise .8s ease-out .55s both;
}

.qa-launch-title {
  margin: 0;
  max-width: 640px;
  color: #fff;
  font-size: var(--launch-title-size);
  line-height: .92;
  letter-spacing: 0;
  text-shadow: 0 20px 60px rgba(0, 0, 0, 0.36);
  user-select: none;
}

.launch-title .tm,
.cinema-logo .tm,
.qa-launch-title .tm {
  margin-left: 0.08em;
  font-size: .18em;
  vertical-align: super;
  letter-spacing: 0;
  font-weight: 620;
}

/* Signed-out lockup: the wordmark AND the two-line tagline are baked into ONE image
   (Avenir Next, @3x, transparent bg) so both look identical regardless of the viewer's
   installed fonts — no live tagline to fall back to a mismatched face. The image carries
   the real glyphs; the img alt preserves the wordmark + tagline for a11y/SEO. */
.qa-launch-lockup-img {
  display: block;
  width: 360px;
  max-width: 100%;
  height: auto;
  user-select: none;
  -webkit-user-drag: none;
}

.qa-launch-subtitle {
  margin: 0;
  max-width: 640px;
  color: rgba(248, 247, 243, 0.78);
  font-size: clamp(17px, 1.8vw, 22px);
  line-height: 1.35;
}

.qa-launch-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 230px));
  gap: 12px;
  margin-top: 20px;
}

.qa-launch-action {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: center;
  /* Match krizat.com's button type: Avenir Next-led KAT display stack (cascades to the
     <strong> label + <small>). krizat buttons sit ~750; our <strong> is browser-bold ~700. */
  font-family: var(--font-display);
  min-height: 92px;
  border: 1px solid rgba(248, 247, 243, 0.16);
  border-radius: 8px;
  padding: 16px;
  color: #f8f7f3;
  text-align: left;
  text-decoration: none;
  background: rgba(20, 24, 27, 0.76);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.20);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.qa-launch-action.primary {
  background: linear-gradient(135deg, rgba(43, 110, 153, 0.84), rgba(39, 116, 95, 0.72));
  border-color: rgba(86, 180, 233, 0.42);
  box-shadow: 0 24px 70px rgba(43, 110, 153, 0.24);
}

.qa-launch-action:hover,
.qa-launch-action:focus-visible,
.sample-tile:hover,
.sample-tile:focus-visible,
.dock-item:hover,
.dock-item:focus-visible {
  transform: translateY(-3px);
  border-color: rgba(248, 247, 243, 0.44);
  box-shadow: 0 28px 74px rgba(0, 0, 0, 0.34);
  filter: none;
  outline: none;
}

.qa-launch-action:active,
.sample-tile:active,
.dock-item:active {
  transform: translateY(-1px) scale(.99);
}

.action-icon {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: rgba(248, 247, 243, 0.12);
  color: #fff;
}

.qa-launch-action strong {
  display: block;
  /* Match krizat.com's button weight (750). Without this the UA strong-bolder rule
     computes to 900 against the button weight-600, reading too black next to krizat. */
  font-weight: 750;
  font-size: 18px;
  line-height: 1.1;
}

.qa-launch-action small {
  color: rgba(248, 247, 243, 0.66);
  font-weight: 570;
}

/* Prospect wayfinding: quiet "enter the demo" link under the landing actions.
   Shown on the prod site (yistiva.com), hidden on the demo host (see app.js). */
.qa-launch-demo {
  margin-top: 14px;
  font-family: var(--font-display);
  font-size: 13.5px;
  line-height: 1.4;
  color: rgba(248, 247, 243, 0.60);
}
.qa-launch-demo-link {
  color: #4ec8b4;
  font-weight: 640;
  text-decoration: none;
  border-bottom: 1px solid rgba(78, 200, 180, 0.42);
  padding-bottom: 1px;
  transition: color .18s ease, border-color .18s ease;
}
.qa-launch-demo-link:hover,
.qa-launch-demo-link:focus-visible {
  color: #86dccd;
  border-color: rgba(134, 220, 205, 0.85);
  outline: none;
}

.qa-launch-side {
  align-self: center;
  display: grid;
  gap: 12px;
  animation: launchRise .8s ease-out .72s both;
}

.sample-tile {
  position: relative;
  display: grid;
  gap: 8px;
  min-height: 132px;
  border: 1px solid rgba(248, 247, 243, 0.14);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(8, 12, 15, 0.90), rgba(8, 12, 15, 0.58)),
    linear-gradient(90deg, rgba(86, 180, 233, 0.15), transparent);
  color: #f8f7f3;
  text-align: left;
  padding: 18px;
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.26);
  overflow: hidden;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.sample-tile::before {
  content: "";
  position: absolute;
  left: 18px;
  top: 18px;
  width: 34px;
  height: 3px;
  border-radius: 999px;
  background: #c79a32;
}

.sample-tile strong {
  align-self: end;
  padding-top: 26px;
  font-size: 19px;
  line-height: 1.08;
}

.sample-tile:hover,
.sample-tile:focus-visible {
  border-color: rgba(199, 154, 50, 0.56);
  background: rgba(8, 12, 15, 0.62);
}

.sample-tile span {
  color: rgba(248, 247, 243, 0.66);
  font-size: 13px;
  line-height: 1.35;
}

.dock-item:not(button) {
  cursor: default;
}

.qa-launch-dock {
  position: absolute;
  left: clamp(20px, 5vw, 72px);
  right: clamp(20px, 5vw, 72px);
  bottom: 24px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  animation: launchRise .8s ease-out .86s both;
}

.dock-item {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 9px;
  align-items: center;
  min-height: 54px;
  border: 1px solid rgba(248, 247, 243, 0.12);
  border-radius: 8px;
  background: rgba(8, 12, 15, 0.80);
  color: rgba(248, 247, 243, 0.88);
  text-align: left;
  padding: 10px;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.dock-item:hover,
.dock-item:focus-visible {
  border-color: rgba(86, 180, 233, 0.42);
  background: rgba(8, 12, 15, 0.60);
}

.dock-icon {
  width: 28px;
  height: 28px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  background: rgba(248, 247, 243, 0.10);
}

.dock-item strong {
  font-size: 13px;
}

.dock-item em {
  font-style: normal;
  border: 1px solid rgba(248, 247, 243, 0.16);
  border-radius: 999px;
  padding: 2px 7px;
  color: rgba(248, 247, 243, 0.64);
  font-size: 11px;
  font-weight: 580;
}

.dock-item[data-tip]::after {
  content: attr(data-tip);
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: calc(100% + 8px);
  opacity: 0;
  transform: translateY(4px);
  pointer-events: none;
  border: 1px solid rgba(248, 247, 243, 0.13);
  border-radius: 8px;
  background: rgba(6, 9, 11, 0.92);
  color: rgba(248, 247, 243, 0.82);
  padding: 8px 9px;
  font-size: 12px;
  line-height: 1.3;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.35);
  transition: opacity .18s ease, transform .18s ease;
}

.dock-item[data-tip]:hover::after,
.dock-item[data-tip]:focus-visible::after {
  opacity: 1;
  transform: translateY(0);
}

@keyframes loaderLine {
  from { transform: translateX(-78%); }
  to { transform: translateX(142%); }
}

@keyframes loaderOut {
  0%, 99.2% { opacity: 1; }
  100% { opacity: 0; visibility: hidden; }
}

@keyframes cinematicGlow {
  0% { opacity: .20; }
  28% { opacity: .78; }
  68% { opacity: .28; }
  100% { opacity: 0; }
}

@keyframes lightfieldSettle {
  0% { opacity: 0; filter: blur(10px); transform: scale(1.015); }
  22% { opacity: .84; filter: blur(5px); transform: scale(1.006); }
  58% { opacity: .34; filter: blur(2px); transform: scale(1); }
  100% { opacity: 0; filter: blur(0); transform: scale(1); }
}

@keyframes apertureSettle {
  0% { opacity: 0; transform: scale(1.05); }
  24% { opacity: .58; transform: scale(1.022); }
  64% { opacity: .18; transform: scale(1.004); }
  100% { opacity: 0; transform: scale(1); }
}

@keyframes probePulse {
  0% { opacity: 0; transform: scale(.58) translateY(-22px); }
  24% { opacity: .94; transform: scale(1) translateY(0); }
  52% { opacity: .64; transform: scale(1.34) translateY(5px); }
  100% { opacity: 0; transform: scale(1.85) translateY(9px); }
}

@keyframes cinemaLogoLand {
  from { transform: translate3d(0, var(--logo-rise-start), 0) scale(.52); }
  to { transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes cinemaLogoFade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes launchRise {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .launch-loader,
  .loader-line span,
  .qa-launch-copy,
  .qa-launch-side,
  .qa-launch-dock,
  .cinema-bg,
  .cinema-vignette,
  .cinema-lightfield,
  .cinema-aura,
  .cinema-probe,
  .cinema-logo {
    animation: none;
  }

  .launch-loader {
    display: none;
  }
}

dialog {
  border: 0;
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 0;
}

dialog::backdrop {
  background: rgba(23, 32, 42, 0.38);
}

.login-card {
  width: min(420px, 92vw);
  padding: 22px;
  display: grid;
  gap: 12px;
}

.wide-dialog {
  width: min(680px, 94vw);
}

/* Public plans & pricing */
.pricing-dialog { width: min(920px, 96vw); }
button.linklike { background: none; border: 0; padding: 0; color: var(--blue, #2b6e99); text-decoration: underline; cursor: pointer; font: inherit; }
.qa-launch-pricing-link { margin: 10px 0 0; text-align: center; }
.qa-launch-pricing-link .linklike { color: rgba(255,255,255,0.9); font-size: 14px; }
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 14px 0 6px; }
.pricing-tier { position: relative; border: 1px solid var(--line, #d9d4c7); border-radius: 12px; padding: 18px 16px; background: var(--panel, #fff); display: flex; flex-direction: column; }
.pricing-tier.featured { border-color: var(--blue, #12a594); box-shadow: 0 4px 18px rgba(18,165,148,0.12); }
.pricing-badge { position: absolute; top: -10px; left: 16px; background: var(--blue, #2b6e99); color: #fff; font-size: 11px; font-weight: 700; padding: 2px 9px; border-radius: 999px; text-transform: uppercase; letter-spacing: 0.04em; }
.pricing-tier h3 { margin: 2px 0 6px; font-size: 16px; }
.pricing-price { font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; margin: 0 0 2px; }
.pricing-price span { font-size: 13px; font-weight: 500; color: var(--muted, #625d52); margin-left: 4px; }
.pricing-tag { font-size: 13px; color: var(--muted, #625d52); margin: 0 0 12px; min-height: 34px; }
.pricing-tier ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.pricing-tier li { font-size: 13px; padding-left: 20px; position: relative; line-height: 1.4; }
.pricing-tier li::before { content: "✓"; position: absolute; left: 0; color: var(--green, #3f7d4e); font-weight: 700; }
.pricing-addons { margin: 16px 0 6px; }
.pricing-addons h4 { margin: 0 0 8px; font-size: 13px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted, #625d52); }
.pricing-addon-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px 20px; }
.pricing-addon-list li { display: flex; justify-content: space-between; font-size: 13px; padding: 5px 0; border-bottom: 1px dashed var(--line, #e6e2d7); }
.pricing-addon-list li span { font-variant-numeric: tabular-nums; color: var(--muted, #625d52); }
.pricing-foot { font-size: 12px; margin: 8px 0 0; }
@media (max-width: 640px) { .pricing-grid { grid-template-columns: 1fr; } .pricing-addon-list { grid-template-columns: 1fr; } }

/* Onboarding guided wizard */
.onboarding-head-right { display: flex; align-items: center; gap: 12px; }
.onboarding-wizard { width: min(560px, 94vw); }
.wizard-head { margin-bottom: 14px; }
.wizard-progress { height: 6px; border-radius: 999px; background: var(--line, #e6e2d7); overflow: hidden; margin-top: 6px; }
.wizard-progress span { display: block; height: 100%; background: var(--blue, #2b6e99); transition: width 0.25s ease; }
#wizardBody { min-height: 190px; }
#wizardBody h2 { font-size: 20px; margin: 4px 0 8px; }
.wizard-step-num { font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted, #625d52); font-weight: 600; }
.wizard-lead { color: var(--muted, #4a463d); line-height: 1.55; margin: 0 0 14px; }
.wizard-detail { font-size: 13px; color: var(--muted, #625d52); margin: -8px 0 14px; }
.wizard-goto { }
.wizard-done-pill { font-size: 12px; font-weight: 600; color: var(--green, #3f7d4e); background: rgba(63,125,78,0.12); padding: 2px 8px; border-radius: 999px; vertical-align: middle; }
.wizard-hero { font-size: 34px; color: var(--blue, #2b6e99); text-align: center; margin: 6px 0 4px; }
.wizard-summary { text-align: center; font-size: 28px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--green, #3f7d4e); margin: 10px 0; }
.wizard-nav { display: flex; gap: 8px; justify-content: flex-end; margin-top: 18px; padding: 0; }
.wizard-nav #wizardSkip { margin-right: auto; }

/* Guided product tour — launcher banner + floating callout */
.tour-launcher { display: flex; align-items: center; gap: 16px; justify-content: space-between; border: 1px solid var(--blue, #2b6e99); background: var(--blue-soft, #e4f0f7); border-radius: 12px; padding: 14px 18px; margin: 0 0 16px; }
.tour-launcher-copy { display: flex; flex-direction: column; gap: 2px; color: var(--ink, #111111); }
/* The launcher sits over the dark portal hero, whose heading colour is light; pin an
   explicit dark ink so the title is legible on the light-blue banner (was white-on-light). */
.tour-launcher-copy strong { font-size: 15px; color: var(--ink, #111111); }
.tour-launcher-copy span { font-size: 13px; color: var(--muted, #4a463d); }
.tour-launcher-actions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.tour-launcher-actions button { white-space: nowrap; }
.tour-launcher-dismiss { background: none; border: 0; color: var(--muted, #625d52); font-size: 13px; cursor: pointer; padding: 8px 10px; border-radius: 8px; }
.tour-launcher-dismiss:hover { background: rgba(0,0,0,0.05); color: var(--ink, #111111); }
.demo-tour-callout { position: fixed; right: 24px; bottom: 24px; z-index: 1200; width: min(380px, calc(100vw - 32px)); background: var(--panel, #fff); border: 1px solid var(--line, #d9d4c7); border-radius: 14px; box-shadow: 0 12px 40px rgba(0,0,0,0.18); padding: 18px 18px 16px; }
.demo-tour-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.demo-tour-eyebrow { font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; color: var(--blue, #2b6e99); }
.demo-tour-x { background: none; border: 0; font-size: 18px; line-height: 1; cursor: pointer; color: var(--muted, #625d52); padding: 4px 8px; border-radius: 8px; }
.demo-tour-x:hover { background: rgba(0,0,0,0.06); color: var(--ink, #111111); }
.demo-tour-callout h3 { margin: 2px 0 6px; font-size: 16px; color: var(--ink, #111111); }
.demo-tour-callout p { margin: 0 0 14px; font-size: 13.5px; line-height: 1.55; color: var(--muted, #4a463d); }
.demo-tour-nav { display: flex; gap: 8px; justify-content: flex-end; }
@media (max-width: 640px) { .demo-tour-callout { right: 12px; left: 12px; bottom: 12px; width: auto; } .tour-launcher { flex-direction: column; align-items: flex-start; } }

/* Two-tier portal — product modules vs shared lab foundation (reorg Phase 2) */
.portal-groups { display: flex; flex-direction: column; gap: 26px; }
.portal-group-label { margin: 0 0 12px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted, #625d52); display: flex; align-items: center; gap: 10px; }
.portal-group-label::after { content: ""; flex: 1; height: 1px; background: var(--line, #d9d4c7); opacity: 0.7; }

#capaDialog .wide-dialog {
  width: min(980px, 96vw);
}

#capaDialog .form-grid {
  grid-template-columns: repeat(2, minmax(220px, 1fr));
}

.access-detail-dialog {
  width: min(920px, 96vw);
}

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

.access-detail-panel {
  margin-bottom: 0;
}

.access-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.access-method-status-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.access-method-status {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 12px 13px;
  display: grid;
  gap: 8px;
}

.access-method-status.ok {
  border-color: #9ccab8;
  background: var(--green-soft);
}

.access-method-status.review {
  border-color: #e2bf80;
  background: var(--amber-soft);
}

.access-method-status.hold {
  border-color: #e5aaa5;
  background: #f8e7e4;
}

.access-method-status.muted {
  border-color: #d7dfe6;
  background: #f6f8fa;
}

.access-method-status-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.access-method-status strong {
  font-size: 16px;
  line-height: 1.2;
}

.access-method-status p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.privacy-dialog-text {
  display: grid;
  gap: 14px;
}

.privacy-notice-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 10px 0 10px;
}

.privacy-review-status {
  color: var(--muted);
  font-size: 12px;
  font-weight: 580;
  line-height: 1.35;
  text-align: right;
}

.privacy-review-status.ok {
  color: var(--green);
}

.privacy-review-status.hold {
  color: #a5524d;
}

.privacy-notice-scroll {
  max-height: min(44vh, 360px);
  overflow: auto;
  padding: 2px 4px 2px 0;
  margin-bottom: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.privacy-notice-scroll.review-complete {
  border-color: #9ccab8;
  box-shadow: inset 0 0 0 1px rgba(99, 167, 127, 0.18);
}

.privacy-notice-section {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfbfa;
  padding: 16px 18px;
}

.privacy-notice-section h3 {
  margin-bottom: 8px;
  font-size: 17px;
}

.privacy-notice-section ul {
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.privacy-notice-section li + li {
  margin-top: 7px;
}

.privacy-status-card {
  border: 1px solid var(--line);
  border-left-width: 5px;
  border-radius: 8px;
  background: #fff;
  padding: 14px 16px;
  display: grid;
  gap: 6px;
}

.privacy-status-card.ok {
  border-left-color: var(--green);
}

.privacy-status-card.hold {
  border-left-color: var(--red);
  background: #fff8f7;
}

.privacy-status-card strong {
  font-size: 16px;
}

.privacy-status-card p,
.privacy-attestation {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.login-card label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 580;
}

.hidden-login-control {
  display: none !important;
}

.login-error {
  margin: 0;
  border: 1px solid rgba(180, 70, 66, 0.34);
  border-radius: 8px;
  background: var(--red-soft);
  color: var(--red);
  padding: 8px 10px;
  font-size: 13px;
  font-weight: 580;
}

.terms-card {
  max-width: 540px;
}

.terms-body {
  max-height: 52vh;
  overflow: auto;
  margin: 6px 0 10px;
  padding-right: 6px;
}

.terms-fineprint {
  font-size: 12px;
  line-height: 1.5;
  color: #2c2820;
}

.terms-intro {
  margin: 0 0 8px;
  font-weight: 560;
}

.terms-fineprint ol {
  margin: 0;
  padding-left: 20px;
}

.terms-fineprint li + li {
  margin-top: 7px;
}

.terms-body ol {
  margin: 0;
  padding-left: 20px;
}

.terms-body li + li {
  margin-top: 8px;
}

.terms-legal-note {
  margin: 12px 0 0;
  font-style: italic;
}

.terms-agree {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 0;
  font-weight: 560;
}

.terms-agree input {
  width: auto;
  min-height: 0;
  margin: 0;
}

.terms-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 10px;
}

.terms-country {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 10px 0 6px;
  font-weight: 560;
  font-size: 12px;
}

.terms-country select {
  min-height: 34px;
  font-weight: 550;
}

.terms-notice-panel {
  max-height: 30vh;
  overflow: auto;
  margin: 8px 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--soft);
  font-size: 12px;
}

.terms-notice-panel h3 {
  margin: 8px 0 4px;
  font-size: 13px;
}

.terms-notice-panel ul {
  margin: 0;
  padding-left: 18px;
}

.role-switcher,
.language-switcher {
  min-height: 34px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  font-size: 12px;
  font-weight: 560;
  padding: 4px 8px;
}

.language-switcher option {
  color: #111;
}

.qa-launch-language {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 13px;
  font-weight: 560;
}

.qa-launch-language-icon {
  display: inline-flex;
  color: rgba(255, 255, 255, 0.7);
}

.qa-launch-language .language-switcher {
  min-height: 36px;
  background: rgba(255, 255, 255, 0.12);
}

@media (max-width: 760px) {
  .access-detail-grid {
    grid-template-columns: 1fr;
  }

  .access-method-status-grid {
    grid-template-columns: 1fr;
  }

  .shell {
    display: block;
  }

  .sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 10px 14px;
  }

  .nav {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding: 10px 0 4px;
    -webkit-overflow-scrolling: touch;
  }

  .nav button {
    flex: 0 0 auto;
    width: auto;
    min-height: 34px;
    padding: 7px 10px;
    text-align: center;
    white-space: nowrap;
  }

  .note-grid {
    grid-template-columns: 1fr;
  }

  .workspace-card,
  .quick-tools {
    padding-bottom: 10px;
  }

  .workspace-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .quick-tools {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: end;
  }

  .quick-tools input {
    margin-bottom: 0;
  }

  .metric-grid,
  .status-strip,
  .dashboard-summary-row,
  .program-grid,
  .method-grid,
  .schema-grid,
  .front-example-grid,
  .front-proof-grid,
  .portal-grid,
  .module-grid,
  .module-roadmap-list,
  .directory-strip,
  .comparison-summary-strip,
  .comparison-diagnostic-kpis {
    grid-template-columns: repeat(2, minmax(130px, 1fr));
  }

  .front-section,
  .front-workflow,
  .privacy-band,
  .manual-layout,
  .qa-launch-content,
  .qa-launch-dock,
  .directory-head,
  .qa-hub-shell,
  .dashboard-verdict-band {
    grid-template-columns: 1fr;
  }

  .module-directory {
    padding: 28px 20px;
  }

  .directory-copy {
    padding-top: 24px;
  }

  .directory-identity {
    margin-top: 0;
    text-align: left;
  }

  .qa-launch-content {
    align-items: start;
  }

  .qa-launch-dock {
    left: 24px;
    right: 24px;
  }

  .manual-card {
    position: static;
  }

  .landing {
    grid-template-columns: 1fr;
  }

  .landing-actions {
    justify-content: flex-start;
  }

  .demo-guide {
    align-items: stretch;
    flex-direction: column;
  }

  .demo-steps {
    justify-content: flex-start;
    min-width: 0;
  }

  .two-col,
  .subscription-layout,
  .form-grid,
  .setup-row,
  .operator-choice-list,
  .logistics-actions,
  .detail-main-grid,
  .detail-program-summary,
  .detail-focus-grid,
  .detail-kv-grid,
  .detail-hero-facts,
  .comparison-primary-grid,
  .comparison-dossier-grid {
    grid-template-columns: 1fr;
  }

  .comparison-primary-grid {
    min-height: 0;
  }

  .report-sheet {
    padding: 20px;
  }

  .report-sheet-head,
  .report-section-head {
    grid-template-columns: 1fr;
    display: grid;
  }

  .report-sheet-meta {
    text-align: left;
  }

  .report-hero strong,
  .report-sheet-head h3 {
    font-size: 28px;
  }

  .report-summary-grid,
  .report-method-grid,
  .report-action-list,
  .report-threshold-grid {
    grid-template-columns: 1fr;
  }

  .report-table {
    min-width: 560px;
  }

  .comparison-dossier-body {
    overflow: visible;
    padding-right: 0;
  }

  .qa-hub-status-grid,
  .qa-hub-command-stats,
  .qa-hub-group-preview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .qa-hub-priority-grid {
    grid-template-columns: 1fr;
  }

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

  .qa-hub-action-item {
    grid-template-columns: 1fr;
  }

  .qa-task-item {
    grid-template-columns: 1fr;
  }

  .qa-hub-surface-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .qa-hub-action-side,
  .qa-task-side {
    min-width: 0;
    justify-items: start;
    text-align: left;
  }

  .qa-hub-action-buttons,
  .qa-task-actions {
    justify-content: flex-start;
  }

  .entry-option-grid {
    grid-template-columns: 1fr;
  }

  .comparison-action-toggle {
    margin-left: 0;
  }

  .comparison-queue-list {
    max-height: none;
  }

  .comparison-asset-trend-frame,
  .comparison-diagnostic-frame {
    height: 300px;
    min-height: 300px;
    max-height: 300px;
  }

  .detail-primary-frame {
    height: 360px;
    min-height: 360px;
    max-height: 360px;
  }

  .detail-secondary-frame {
    height: 280px;
    min-height: 280px;
    max-height: 280px;
  }

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

  .qa-hub-nav {
    position: static;
  }

  .summary-row {
    grid-template-columns: 1fr 48px 64px 64px 86px;
    gap: 7px;
  }
}

@media (max-width: 680px) {
  .topbar {
    align-items: flex-start;
    flex-direction: column;
    min-height: 0;
    padding: 12px 14px;
  }

  .brand {
    align-items: center;
    width: 100%;
  }

  .kat-logo {
    width: 96px;
  }

  .signed-out .kat-logo {
    width: 74px;
  }

  .brand-lockup {
    gap: 8px;
  }

  .brand-product-name {
    font-size: 22px;
  }

  .brand-from {
    font-size: 9px;
  }

  .kat-logo {
    height: 13px;
  }

  .customer-bar,
  .customer-bar strong,
  .customer-bar span {
    text-align: left;
  }

  .customer-bar {
    width: 100%;
    justify-content: space-between;
  }

  .workspace {
    padding: 14px;
  }

  .page-head,
  .panel-head {
    flex-direction: column;
  }

  .qa-hub-status-grid,
  .qa-hub-command-stats,
  .qa-hub-group-preview {
    grid-template-columns: 1fr;
  }

  .qa-hub-nav-button {
    grid-template-columns: 34px minmax(0, 1fr);
  }

  .qa-hub-nav-signal {
    grid-column: 2;
    justify-self: start;
  }

  .qa-hub-method-grid,
  .module-roadmap-list {
    grid-template-columns: 1fr;
  }

  .qa-hub-command-copy strong {
    font-size: 28px;
  }

  .scene-page .page-head,
  #home.scene-page .landing {
    min-height: 220px;
    grid-template-columns: 1fr;
    align-content: end;
  }

  .scene-page .page-head .toolbar,
  #home.scene-page .landing .landing-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .scene-page .page-head .search {
    min-width: 0;
    width: 100%;
  }

  .metric-grid,
  .status-strip,
  .dashboard-summary-row,
  .program-grid,
  .method-grid,
  .schema-grid,
  .note-grid,
  .front-example-grid,
  .front-proof-grid,
  .portal-grid,
  .module-grid,
  .directory-strip,
  .comparison-summary-strip,
  .comparison-diagnostic-kpis,
  .comparison-dossier-grid,
  .comparison-primary-grid {
    grid-template-columns: 1fr;
  }

  .comparison-primary-grid {
    min-height: 0;
  }

  .comparison-dossier-body {
    overflow: visible;
    padding-right: 0;
  }

  .dashboard-verdict-meta {
    grid-template-columns: 1fr;
  }

  .front-hero {
    min-height: 560px;
    padding: 30px 18px;
  }

  .front-hero h2 {
    font-size: 34px;
  }

  .front-section,
  .front-workflow,
  .front-example-grid,
  .privacy-band,
  .front-stats {
    width: min(100% - 28px, 1180px);
  }

  .portal-head {
    flex-direction: column;
  }

  .portal-identity {
    width: 100%;
    text-align: left;
  }

  .module-directory {
    min-height: calc(100vh - 154px - 38px);
    padding: 24px 16px 30px;
  }

  .directory-content {
    padding-bottom: 72px;
  }

  .directory-copy h2 {
    font-size: 38px;
  }

  .qa-directory .directory-copy h2 {
    font-size: 52px;
  }

  .portal-title-wordmark {
    gap: 0.08em 0.16em;
  }

  .directory-copy .muted {
    font-size: 16px;
  }

  .customer-actions {
    justify-content: flex-start;
  }

  .role-choice-grid {
    grid-template-columns: 1fr;
  }

  .qa-launch-content {
    min-height: auto;
    padding: var(--launch-title-top) var(--launch-title-x) 64px;
  }

  .qa-launch-screen {
    --launch-title-x: 18px;
    --launch-title-top: 122px;
    --launch-title-size: 60px;
  }

  .qa-launch-lockup-img {
    width: 248px;
  }

  .qa-launch-actions {
    grid-template-columns: 1fr;
  }

  .directory-mode .app-footer {
    padding: 0 20px;
    font-size: 10px;
  }

  .qa-launch-dock {
    left: 18px;
    right: 18px;
    bottom: 18px;
  }

  table {
    min-width: 900px;
  }
}

@media print {
  .topbar,
  .sidebar,
  .toolbar,
  .nav,
  .quick-tools,
  .form-grid,
  .segmented {
    display: none;
  }

  .shell {
    display: block;
  }

  .workspace {
    padding: 0;
  }

  .page {
    display: none;
  }

  #reports {
    display: block;
  }

  #reports .page-head {
    display: none;
  }

  #reports .report-body {
    max-width: none;
  }

  /* Chunk M (B11, corrected): the PDF sheet renders into a transient
     .pdf-export-host appended to <body> (not under #reports), so the old
     `#reports .pdf-report-page` selector matched nothing. Target the real
     container so the window.print() fallback prints a clean white sheet. */
  .pdf-export-host .pdf-report-page {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #fff !important;
    box-shadow: none;
    transform: none;
    scale: none;
  }
}

/* ===========================================================================
   Planned-expansion suite modules (QMS, Lab Data, Chemicals & SDS,
   Enterprise Multi-Lab, Customer Report Room) — first-draft UI.
   =========================================================================== */
.module-body {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 4px 0 32px;
}
.module-status-grid {
  margin: 0;
}
.module-draft-banner {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: baseline;
  padding: 10px 14px;
  background: var(--blue-soft);
  border: 1px solid var(--line);
  border-left: 3px solid var(--blue);
  border-radius: 10px;
  font-size: 13px;
  color: var(--muted);
}
.module-draft-banner strong {
  color: var(--ink);
}
.module-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow);
  overflow: hidden;
}
.module-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid var(--line);
}
.module-card-head h3 {
  margin: 0;
  font-size: 16px;
  letter-spacing: 0.01em;
}
.module-card-head p {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--muted);
  max-width: 70ch;
}
.module-card-actions {
  flex-shrink: 0;
}
.module-card-body {
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.module-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
@media (max-width: 900px) {
  .module-two-col {
    grid-template-columns: 1fr;
  }
}

/* Tables */
.module-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.module-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.module-table th,
.module-table td {
  text-align: left;
  padding: 9px 12px;
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
  vertical-align: middle;
}
.module-table thead th {
  background: var(--soft);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  position: sticky;
  top: 0;
}
.module-table tbody tr:last-child td {
  border-bottom: 0;
}
.module-table tbody tr:hover {
  background: var(--paper);
}
.module-table code {
  font-family: "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 12px;
  color: var(--violet);
}

/* Badges / tones */
.module-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 550;
  line-height: 1.5;
  border: 1px solid transparent;
  white-space: nowrap;
}
.module-badge.tone-ok { background: var(--green-soft); color: var(--green); border-color: rgba(39,116,95,0.25); }
.module-badge.tone-review { background: var(--amber-soft); color: var(--amber); border-color: rgba(173,116,28,0.25); }
.module-badge.tone-hold { background: var(--red-soft); color: var(--red); border-color: rgba(180,70,66,0.25); }
.module-badge.tone-info { background: var(--blue-soft); color: var(--blue); border-color: rgba(18,165,148,0.25); }
.module-badge.tone-neutral { background: var(--soft); color: var(--muted); border-color: var(--line); }
.module-badge.tone-muted { background: transparent; color: var(--muted); border-color: var(--line); }

/* Stepper */
.module-stepper {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.module-stepper li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px 6px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 12.5px;
  color: var(--muted);
  background: var(--paper);
}
.module-stepper li.done { color: var(--green); border-color: rgba(39,116,95,0.3); background: var(--green-soft); }
.module-stepper li.active { color: var(--ink); border-color: var(--blue); background: var(--blue-soft); font-weight: 550; }
.module-stepper .step-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--panel);
  border: 1px solid currentColor;
  font-size: 11px;
  font-weight: 560;
}
.module-signoff-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.module-note {
  margin: 0;
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.5;
}

/* Clause / list rows */
.module-clause-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.module-clause-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding-bottom: 9px;
  border-bottom: 1px dashed var(--line);
  font-size: 13px;
}
.module-clause-list li:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.clause-name {
  flex: 1;
  min-width: 160px;
}
.muted-text {
  color: var(--muted);
  font-size: 12px;
}

/* Competency / adoption matrix cells */
.comp-matrix td:first-child,
.comp-matrix .k1-td:first-child { /* k1DataTable renders grid spans, not <td> */
  font-weight: 550;
}
.comp-cell {
  display: inline-block;
  min-width: 26px;
  text-align: center;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 550;
}
.comp-cell.tone-ok { background: var(--green-soft); color: var(--green); }
.comp-cell.tone-review { background: var(--amber-soft); color: var(--amber); }
.comp-cell.tone-hold { background: var(--red-soft); color: var(--red); }
.comp-cell.tone-info { background: var(--blue-soft); color: var(--blue); }
.comp-cell.tone-muted { background: var(--soft); color: var(--muted); }

/* Feature #8: competency matrix — sticky first column so the operator label stays frozen while
   the (subscribed) method columns scroll horizontally. */
.comp-matrix-scroll {
  overflow-x: auto;
  max-width: 100%;
}
.comp-matrix-sticky { min-width: max-content; }
.comp-matrix-sticky .comp-matrix-td { text-align: center; }
.comp-matrix-sticky th,
.comp-matrix-sticky td { white-space: nowrap; }
.comp-matrix-sticky .comp-sticky-col {
  position: sticky;
  left: 0;
  z-index: 2;
  background: var(--card, #fff);
  text-align: left;
  font-weight: 550;
  box-shadow: 1px 0 0 var(--line, rgba(0,0,0,0.08));
}
.comp-matrix-sticky thead .comp-sticky-col { z-index: 3; }
.comp-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 10px;
}
.comp-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--muted);
}
.checkbox-line {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-direction: row;
}

/* Org tree */
.org-tree {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 13px;
}
.org-node {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.org-region {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-left: 14px;
  margin-left: 6px;
  border-left: 2px solid var(--line);
}
.org-site {
  padding-left: 14px;
  margin-left: 6px;
  border-left: 1px dashed var(--line);
}
.org-root strong {
  font-size: 14px;
}

/* GHS pictograms — official UN artwork (OSHA HazCom / WHMIS 2015 / EU CLP).
   The SVG already carries the red diamond, so no CSS frame/rotation here. */
.ghs-picto-row {
  display: inline-flex;
  gap: 3px;
  align-items: center;
  flex-wrap: wrap;
}
.ghs-picto {
  width: 26px;
  height: 26px;
  display: inline-block;
  vertical-align: middle;
}
.ghs-unknown {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--red);
  border-radius: 4px;
  font-size: 9px;
  padding: 0 4px;
  background: #fff;
  color: var(--red);
}

/* --- Provisional-access banner (real labs awaiting payment) --- */
.lab-status-banner {
  margin: 0 0 16px;
  padding: 12px 16px;
  border-radius: 10px;
  background: var(--amber-soft);
  border: 1px solid var(--amber);
  color: var(--amber);
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 0.9rem;
}
/* `hidden` must win over the explicit display above, or the empty bar shows. */
.lab-status-banner[hidden] { display: none; }
.lab-status-banner strong { font-size: 0.95rem; }
.lab-status-banner span { color: var(--ink, #33383f); }

/* --- Admin Console --- */
.admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.admin-actions button { padding: 5px 10px; font-size: 0.82rem; }
.admin-actions .danger {
  background: var(--red, #b3261e);
  border-color: var(--red, #b3261e);
  color: #fff;
}
.invite-link-row {
  display: flex;
  gap: 8px;
  margin: 8px 0 4px;
}
.invite-link-row input {
  flex: 1;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.82rem;
}

/* --- Onboarding "Getting started" checklist (real customer labs) --- */
.onboarding-card {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 14px;
  padding: 20px 22px;
  margin: 0 0 22px;
  background: rgba(20, 30, 40, 0.55);
  color: #fff;
}
.onboarding-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}
.onboarding-card .eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.72rem;
  opacity: 0.8;
  margin: 0 0 2px;
}
.onboarding-card h3 { margin: 0 0 4px; font-size: 1.15rem; }
.onboarding-lead { margin: 0; opacity: 0.85; font-size: 0.88rem; max-width: 52ch; }
.onboarding-progress {
  flex: 0 0 auto;
  width: 58px; height: 58px;
  border-radius: 50%;
  display: grid; place-items: center;
  border: 3px solid rgba(255, 255, 255, 0.25);
  font-weight: 600;
}
.onboarding-progress-value { font-size: 1.05rem; }
.onboarding-bar {
  height: 6px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.15);
  margin: 16px 0;
  overflow: hidden;
}
.onboarding-bar > span {
  display: block; height: 100%;
  background: var(--green, #27745f);
  transition: width 0.3s ease;
}
.onboarding-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.onboarding-steps li {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.05);
}
.onboarding-steps li.done { opacity: 0.72; }
.onboarding-check {
  flex: 0 0 auto;
  width: 24px; height: 24px; border-radius: 50%;
  display: grid; place-items: center;
  border: 2px solid rgba(255, 255, 255, 0.35);
  font-size: 0.8rem; font-weight: 700;
}
.onboarding-steps li.done .onboarding-check {
  background: var(--green, #27745f);
  border-color: var(--green, #27745f);
}
.onboarding-step-copy { flex: 1; display: flex; flex-direction: column; gap: 1px; }
.onboarding-step-copy strong { font-size: 0.92rem; }
.onboarding-step-copy span { font-size: 0.8rem; opacity: 0.82; }
.onboarding-step-detail { font-weight: 500; opacity: 0.85; }
.onboarding-go { flex: 0 0 auto; padding: 7px 16px; }

.login-forgot { margin: 10px 0 0; text-align: center; }
.login-forgot .manual-deeplink { font-size: 0.85rem; }

/* --- Admin Console tabs + sample inventory --- */
.admin-tabs {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid var(--line, #d8dee3);
  margin: 0 0 16px;
}
.admin-tab {
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 8px 14px;
  color: var(--muted, #66707a);
  font-weight: 600;
  cursor: pointer;
}
.admin-tab.active {
  color: var(--ink, #1a1f24);
  border-bottom-color: var(--green, #27745f);
}
.module-subhead { margin: 22px 0 10px; font-size: 1rem; }

/* --- Invoicing: integration status chips --- */
.integration-strip { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.integration-chip {
  font-size: 0.78rem;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--line, #d8dee3);
}
.integration-chip.on { background: var(--green-soft, #e5f3ed); border-color: var(--green, #27745f); color: var(--green, #27745f); }
.integration-chip.off { background: #f4f5f6; color: var(--muted, #66707a); }

/* --- PG Grading module --- */
.module-error { color: var(--red, #b4322a); font-weight: 600; margin: 6px 0; }
/* Quiet K1 module intro note — a subtle asphalt-rail lead-in, not the old green info banner. */
.module-live-banner { background: transparent; border: 0; border-left: 2px solid var(--k1-teal-mid, #a9ddd5); color: var(--k1-ink-2, #5b615e); border-radius: 0; padding: 1px 0 1px 12px; font-size: 12.5px; line-height: 1.5; margin: 0 0 16px; }
.module-live-banner > span { display: block; }
.grading-toolbar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px; margin-bottom: 16px; }
.grading-toolbar button { margin-left: auto; }
.grading-spec, .grading-file, .grading-conf-controls label, .grading-measure { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--muted, #66707a); }
.grading-spec select, .grading-conf-controls select { min-width: 220px; }
.grading-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }
.grading-import-controls { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-end; margin-bottom: 10px; }
/* K1 look for the native "Choose File" input on Instrument Capture + PG Grading.
   ::file-selector-button (standard) and ::-webkit-file-upload-button (legacy) must be separate
   rules — grouping an unknown pseudo-element would invalidate the whole selector list. */
.grading-file input[type="file"] { font-family: var(--k1-display, inherit); font-size: 12.5px; color: var(--k1-ink-2, #5b615e); padding: 4px 0; }
.grading-file input[type="file"]::file-selector-button { font-family: var(--k1-display, inherit); font-size: 12px; font-weight: 600; color: var(--k1-teal-ink, #0c7d70); background: var(--k1-teal-soft, #e3f3f0); border: 1px solid var(--k1-teal-mid, #a9ddd5); border-radius: 8px; padding: 6px 14px; margin-right: 12px; cursor: pointer; transition: background .15s, border-color .15s; }
.grading-file input[type="file"]::-webkit-file-upload-button { font-family: var(--k1-display, inherit); font-size: 12px; font-weight: 600; color: var(--k1-teal-ink, #0c7d70); background: var(--k1-teal-soft, #e3f3f0); border: 1px solid var(--k1-teal-mid, #a9ddd5); border-radius: 8px; padding: 6px 14px; margin-right: 12px; cursor: pointer; transition: background .15s, border-color .15s; }
.grading-file input[type="file"]:hover::file-selector-button { background: #d7ece8; border-color: var(--k1-teal, #12a594); }
.grading-file input[type="file"]:hover::-webkit-file-upload-button { background: #d7ece8; border-color: var(--k1-teal, #12a594); }
/* My account — K1 panel stack */
.account-cards { display: flex; flex-direction: column; gap: 14px; max-width: 760px; }
.grading-bbr-head, .grading-bbr-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.grading-bbr-head { font-size: 12px; color: var(--muted, #66707a); margin-bottom: 4px; }
.grading-bbr-row { margin-bottom: 8px; }
.grading-mscr { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 12px; }
.grading-mscr label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--muted, #66707a); }
.grading-pg { font-size: 34px; font-weight: 800; letter-spacing: 0.5px; color: var(--green, #27745f); margin: 6px 0; }
.grading-pg-incomplete { color: var(--muted, #66707a); font-size: 22px; }
.grading-conf-controls { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 12px; }
.grading-measure-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin: 10px 0; }
.grading-measure em { color: var(--muted, #66707a); font-style: normal; font-size: 11px; }

/* --- Data Entry portal (Order 5b) --- */
.de-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 4px 0 14px; border-bottom: 1px solid var(--line, #d9dee3); }
.de-tab { appearance: none; border: 1px solid transparent; border-bottom: none; background: transparent; color: var(--muted, #66707a); font-weight: 600; font-size: 13px; padding: 8px 16px; border-radius: 8px 8px 0 0; cursor: pointer; }
.de-tab:hover { color: var(--ink, #1b1f23); }
.de-tab.active { background: var(--card, #fff); color: var(--green, #27745f); border-color: var(--line, #d9dee3); box-shadow: 0 2px 0 0 var(--card, #fff); }
.de-tab-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }
.de-section-label { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: 0.4px; color: var(--muted, #66707a); margin: 12px 0 6px; }
.de-grid-head, .de-grid-row { display: grid; grid-template-columns: 1fr 1fr auto auto; gap: 8px; align-items: center; }
.de-grid-head-3, .de-grid-row-3 { grid-template-columns: 1fr 1fr 1fr auto auto; }
.de-grid-head { font-size: 12px; color: var(--muted, #66707a); margin-bottom: 4px; }
.de-grid-row { margin-bottom: 8px; }
.de-mscr { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 8px; }
.de-mscr label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--muted, #66707a); }
.de-cell-row { display: grid; grid-template-columns: minmax(160px, 2fr) 1fr auto auto; gap: 10px; align-items: center; margin-bottom: 8px; }
.de-cell-prop { font-size: 13px; color: var(--ink, #1b1f23); }
.de-cell-prop small { display: block; color: var(--muted, #66707a); font-size: 11px; }
.de-cell-unit { font-size: 12px; color: var(--muted, #66707a); }
.de-import-flag { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 600; padding: 3px 8px; border-radius: 999px; white-space: nowrap; }
.de-import-flag.is-pending { background: var(--amber-soft, #fbeecf); color: var(--amber, #a6741a); }
.de-import-flag.is-confirmed { background: var(--green-soft, #e5f3ed); color: var(--green, #27745f); }
.de-status-line { margin: 0 0 10px; }
.de-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 14px; }
.de-explainer { font-size: 12px; color: var(--muted, #66707a); max-width: 420px; }

/* --- Instrument Capture module --- */
.capture-warnings { list-style: none; padding: 0; margin: 6px 0 12px; display: flex; flex-direction: column; gap: 6px; }
.capture-warnings li { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.4; padding: 6px 8px; border-radius: 6px; background: #f7f8f9; }
.capture-warnings li.sev-error { background: var(--red-soft, #fdecea); }
.capture-warnings li.sev-warn { background: #fdf6e3; }
.capture-warnings .cap-ico { flex: 0 0 auto; }

/* --- Sample Genealogy module --- */
.binder-node { position: relative; }
.binder-facts { color: var(--muted, #66707a); font-size: 13px; margin: 4px 0; }
.binder-custody { list-style: none; padding: 0; margin: 8px 0 0; border-left: 2px solid var(--line, #e3e6e8); }
.binder-custody li { font-size: 12.5px; padding: 3px 0 3px 10px; line-height: 1.4; }
.binder-custody .cust-ev { font-weight: 700; text-transform: uppercase; font-size: 11px; letter-spacing: 0.4px; color: var(--green, #27745f); }
.binder-custody .cust-meta { color: var(--muted, #66707a); }
.binder-custody-form { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; align-items: center; }
.binder-custody-form input[type="text"] { flex: 1 1 240px; }
.binder-create-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.binder-create-grid label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--muted, #66707a); }
/* Fields sit at the bottom of each (equal-height) cell so a two-line label (e.g.
   "Requested tests (comma-separated)") lines its input up with single-line neighbours. */
.binder-create-grid label > input,
.binder-create-grid label > select,
.binder-create-grid label > .tag-ac { margin-top: auto; }

/* Tag autocomplete (Requested tests): custom menu anchored under the field, replacing
   the native <datalist> popup that Chrome mis-anchored to the viewport's left edge. */
.tag-ac { position: relative; display: block; }
.tag-ac > input { width: 100%; box-sizing: border-box; }
.tag-ac-menu { position: absolute; top: calc(100% + 2px); left: 0; right: 0; z-index: 50; margin: 0; padding: 4px; list-style: none; max-height: 220px; overflow-y: auto; background: var(--panel, #fff); border: 1px solid var(--line, #d9d4c7); border-radius: 6px; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12); }
.tag-ac-menu[hidden] { display: none; }
.tag-ac-menu li { display: flex; align-items: baseline; gap: 6px; padding: 6px 8px; border-radius: 4px; cursor: pointer; font-size: 13px; color: var(--ink, #2a2a2a); }
.tag-ac-menu li.active, .tag-ac-menu li:hover { background: rgba(0, 0, 0, 0.06); }
.tag-ac-menu li .code { font-weight: 600; }
.tag-ac-menu li .lbl { color: var(--muted, #625d52); }

/* --- Certificate of Analysis module --- */
.coa-rows-head { display: flex; align-items: center; gap: 10px; margin: 12px 0 6px; }
.coa-rows-head strong { margin-right: auto; }
.coa-row { display: grid; grid-template-columns: 1.1fr 2fr 1.2fr 0.8fr 0.7fr 0.9fr 0.9fr 0.7fr auto; gap: 6px; margin-bottom: 6px; align-items: center; }
.coa-row input, .coa-row select { min-width: 0; }
.coa-bind-select { font-size: 0.85em; }
.standards-region-field { display: flex; flex-direction: column; gap: 6px; max-width: 420px; font-weight: 600; }
.standards-region-field select { font-weight: 400; }

/* --- Order 3 · Layer 1 — Test Times & Lab Day setup page --- */
.timelib-table th, .timelib-table td { vertical-align: middle; white-space: nowrap; }
.timelib-table td small { display: block; font-weight: 400; }
.timelib-num { width: 84px; max-width: 100%; }
.timelib-table input[type="time"] { width: 118px; max-width: 100%; }
.timelib-table input[type="checkbox"] { margin: 0; }
.timelib-inherit { font-style: italic; }
.timelib-child-row td, .timelib-closed-row td { opacity: 0.72; }
.timelib-daybounds { margin-top: 12px; max-width: 520px; }
.coa-conf-label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--muted, #66707a); margin-top: 12px; }
.coa-conf-label textarea { font-family: inherit; padding: 8px; border: 1px solid var(--line, #e3e6e8); border-radius: 6px; }

/* --- Jobs & Worklist --- */
.code39 { display: block; }

/* --- Job requests inbox --- */
.job-request { border: 1px solid var(--line, #e3e6e8); border-radius: 8px; padding: 10px 12px; margin-bottom: 8px; font-size: 13px; }
.job-request .cust-meta { color: var(--muted, #66707a); }

/* --- Lab Dashboard KPIs --- */
.kpi-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.kpi-card { text-align: center; padding: 16px 10px; }
.kpi-value { font-size: 30px; font-weight: 800; line-height: 1; }
.kpi-value.tone-ok { color: var(--green, #27745f); } .kpi-value.tone-hold { color: var(--red, #b4322a); } .kpi-value.tone-review { color: #a8730a; } .kpi-value.tone-info { color: #2b6cb0; }
.kpi-label { font-size: 12px; color: var(--muted, #66707a); margin-top: 6px; }

/* --- job billing / integrations --- */
.link-btn { background: none; border: none; color: var(--green, #27745f); cursor: pointer; font-size: 12px; padding: 0 2px; text-decoration: underline; }

/* --- Tabular figures on every data-bearing surface -------------------------
   Fixed-width digits so measured values, spec limits, decimals, dates, counts
   and currency line up vertically in columns — the single clearest typographic
   signal of a serious data/lab product. Only digit advance-width is affected;
   letters are unchanged, so applying broadly to tables + metrics is safe. */
table, th, td,
.metric-grid, .metric-grid strong, .metric-grid span,
.kpi-value, .kpi-label,
.module-table, .module-table th, .module-table td,
.dashboard-worklist-table th, .dashboard-worklist-table td,
.manual-table th, .manual-table td,
.pdf-report-table th, .pdf-report-table td,
.binder-facts, .cust-meta, .job-request, code {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}
/* Right-align columns the renderer detected as purely numeric (header included, so
   it sits over its column). Place value aligns → magnitudes are visually comparable. */
.module-table th.num, .module-table td.num { text-align: right; }

/* --- Controlled-vocabulary curation chips --- */
.vocab-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.vocab-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border-radius: 999px; font-size: 12px; background: var(--soft, #eee9dd); border: 1px solid var(--line, #d9d4c7); }
.vocab-chip.retired { opacity: 0.6; }
.vocab-chip.retired .vocab-chip-code, .vocab-chip.retired .vocab-chip-label { text-decoration: line-through; }
.vocab-chip .link-btn { font-size: 12px; }
.vocab-chip-code { font-weight: 600; }
.vocab-chip-label { color: var(--muted); font-size: 11px; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vocab-edit-btn { color: var(--muted); }
.vocab-chip.editing { background: var(--panel, #fff); padding: 4px 6px; }
.vocab-edit-code, .vocab-edit-label { font: inherit; font-size: 12px; padding: 2px 6px; border: 1px solid var(--line); border-radius: 6px; min-width: 80px; max-width: 150px; }

/* Network-site reported performance — read-only (pulled from site data, not entered) */
.site-perf { margin-top: 14px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper, #f5f4f0); }
.site-perf h3 { margin: 0 0 2px; font-size: 14px; }
.site-perf-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; margin-top: 8px; }
.site-perf-grid > div { display: flex; flex-direction: column; }
.site-perf-grid .k { font-size: 11px; color: var(--muted); }
.site-perf-grid strong { font-size: 17px; font-variant-numeric: tabular-nums; }

/* Data Explorer (Tier-3 charts + table pulls) */
.explore-controls { flex-wrap: wrap; align-items: end; gap: 12px; }
.explore-controls label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--muted); }
.explore-controls label.explore-check { flex-direction: row; align-items: center; gap: 5px; }
.explore-controls label.explore-check input { margin: 0; }
.explore-samples { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 10px 0; font-size: 12px; }
.explore-chart { position: relative; height: 340px; }
.explore-table-wrap { overflow-x: auto; max-height: 360px; overflow-y: auto; }

/* --- Collapsible "How this works" module guide --- */
.module-guide { border: 1px solid var(--line, #d9d4c7); border-radius: 8px; background: var(--panel, #fff); margin: 0 0 16px; }
.module-guide > summary { cursor: pointer; padding: 9px 14px; font-weight: 600; font-size: 13px; color: var(--blue, #2b6e99); list-style: none; display: flex; align-items: center; gap: 8px; }
.module-guide > summary::-webkit-details-marker { display: none; }
.module-guide > summary::before { content: "?"; display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; background: var(--blue-soft, #e4f0f7); color: var(--blue, #2b6e99); font-size: 12px; font-weight: 700; }
.module-guide[open] > summary { border-bottom: 1px solid var(--line, #d9d4c7); }
.module-guide ol { margin: 10px 0; padding: 2px 16px 8px 34px; font-size: 13px; color: var(--muted, #625d52); line-height: 1.6; }
.module-guide li { margin-bottom: 5px; }
.module-guide:focus-within > summary { outline: 2px solid var(--blue, #2b6e99); outline-offset: 2px; border-radius: 8px; }

/* --- Empty states (first-run / filtered / error) --------------------------- */
.module-empty {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: 8px; padding: 48px 24px; max-width: 420px; margin: 0 auto;
}
.module-empty-icon {
  width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; line-height: 1; margin-bottom: 4px;
  background: var(--soft, #eee9dd); color: var(--muted, #625d52);
  border: 1px solid var(--line, #d9d4c7);
}
.module-empty-filter .module-empty-icon { background: var(--blue-soft, #e4f0f7); color: var(--blue, #2b6e99); border-color: var(--blue-soft, #e4f0f7); }
.module-empty-error .module-empty-icon { background: var(--red-soft, #fae9e7); color: var(--red, #b44642); border-color: var(--red-soft, #fae9e7); font-weight: 700; }
.module-empty-title { font-family: var(--font-display); font-size: 16px; margin: 0; color: var(--ink, #111); }
.module-empty-hint { font-size: 13px; color: var(--muted, #625d52); margin: 0; line-height: 1.5; }
.module-empty-action {
  margin-top: 8px; padding: 8px 18px; border-radius: 6px; cursor: pointer;
  font-size: 13px; font-weight: 600; border: 1px solid var(--ink, #111);
  background: var(--ink, #111); color: #fff; min-height: 24px;
}
.module-empty-action:hover { opacity: 0.9; }
.module-empty-action.secondary { background: transparent; color: var(--ink, #111); border-color: var(--line-strong, #b8b09f); }
.module-empty-action:focus-visible { outline: 2px solid var(--blue, #2b6e99); outline-offset: 2px; }

/* --- Table density (persisted user preference) ----------------------------
   Default = comfortable (unchanged). Compact tightens vertical padding for
   analysts scanning long result lists; horizontal padding + font unchanged so
   columns and tabular figures stay aligned. */
:root[data-density="compact"] .module-table th,
:root[data-density="compact"] .module-table td,
:root[data-density="compact"] .dashboard-worklist-table th,
:root[data-density="compact"] .dashboard-worklist-table td { padding-top: 3px; padding-bottom: 3px; }
:root[data-density="compact"] .module-card { padding-top: 12px; padding-bottom: 12px; }

/* Work model (platform reorg 3a.3) — cross-module assignment queue: cards, chips,
   integrity warnings. Colour-coded left rail by status; overdue forces red. */
.work-queue-list { display: grid; gap: 10px; }
.work-assigned-group { display: grid; gap: 10px; margin-bottom: 14px; }
.work-group-title { margin: 0 0 2px; font-size: 12px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.work-assignment-card { display: grid; gap: 8px; padding: 14px 16px; border: 1px solid var(--line); border-left: 4px solid var(--line); border-radius: 12px; background: var(--panel, #fff); }
.work-assignment-card.work-status-planned { border-left-color: var(--accent, #1d6fb8); }
.work-assignment-card.work-status-in_progress { border-left-color: var(--amber); }
.work-assignment-card.work-status-blocked { border-left-color: var(--red); }
.work-assignment-card.work-status-done { border-left-color: var(--green); opacity: .72; }
.work-assignment-card.work-status-cancelled { border-left-color: var(--line); opacity: .55; }
.work-assignment-card.work-overdue { border-left-color: var(--red); }
/* Command-Center Priorities: the whole card deep-links to the record on the Assignments board. */
.work-assignment-card.work-card-deeplink { cursor: pointer; transition: box-shadow .12s ease, transform .12s ease; }
.work-assignment-card.work-card-deeplink:hover { box-shadow: 0 2px 10px rgba(0,0,0,.10); }
.work-assignment-card.work-card-deeplink:focus-visible { outline: 2px solid var(--accent, #1d6fb8); outline-offset: 2px; }
/* Flash highlight when a Priorities deep-link scrolls a record into view on the board. */
.work-assignment-card.work-card-focused { box-shadow: 0 0 0 3px var(--accent, #1d6fb8); animation: workCardFocusPulse 2.2s ease; }
@keyframes workCardFocusPulse { 0% { box-shadow: 0 0 0 3px var(--accent, #1d6fb8); } 70% { box-shadow: 0 0 0 3px var(--accent, #1d6fb8); } 100% { box-shadow: 0 0 0 0 rgba(0,0,0,0); } }
.work-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.work-card-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.work-card-title strong { font-size: 15px; }
.work-card-meta { margin: 0; color: var(--muted); font-size: 13px; }
.work-card-assignee { margin: 0; font-size: 13px; font-weight: 650; color: var(--ink); }
.work-card-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.work-priority-chip, .work-status-chip { display: inline-flex; align-items: center; min-height: 22px; padding: 2px 9px; border-radius: 999px; font-size: 11px; font-weight: 700; }
.work-priority-chip.work-p1 { background: var(--red-soft); color: var(--red); }
.work-priority-chip.work-p2 { background: var(--amber-soft); color: var(--amber); }
.work-priority-chip.work-p3 { background: var(--slate-soft); color: var(--slate); }
.work-status-chip.work-status-planned { background: var(--slate-soft); color: var(--slate); }
.work-status-chip.work-status-in_progress { background: var(--amber-soft); color: var(--amber); }
.work-status-chip.work-status-done { background: var(--green-soft); color: var(--green); }
.work-status-chip.work-status-blocked, .work-status-chip.work-status-cancelled { background: var(--red-soft); color: var(--red); }
.work-card-warnings { margin: 0; padding-left: 18px; color: var(--red); font-size: 12.5px; }
.work-card-warnings li { margin: 2px 0; }
.work-card-note { margin: 0; font-size: 12.5px; color: var(--ink); }
.work-status-chip.work-status-pending-verify { background: var(--amber-soft); color: var(--amber); }
.work-assignment-card.work-pending-verify { border-color: var(--amber); }
.form-error { margin: 6px 0 0; color: var(--red); font-size: 13px; font-weight: 600; min-height: 1em; }
/* Setup-wizard inline field error (replaces the native OS validity bubble) — anchored under the field */
.k1-fielderr { margin: 6px 0 0; color: var(--red); font-size: 12.5px; font-weight: 600; line-height: 1.3; }
.form-grid label:has(> .is-invalid) { color: inherit; }
input.is-invalid, select.is-invalid, textarea.is-invalid { border-color: var(--red); box-shadow: 0 0 0 2px var(--red-soft); }
.work-source-tag { display: inline-flex; align-items: center; padding: 1px 7px; border-radius: 999px; background: var(--slate-soft); color: var(--slate); font-size: 11px; font-weight: 650; }

/* Assignment intelligence — designated owners, routing principle, and auto-assign feedback */
.work-card-owners { margin: 0; font-size: 12.5px; color: var(--ink); font-weight: 600; }
.work-card-routing { margin: 0; font-size: 12px; color: var(--muted); font-style: italic; }
.work-card-autoassign { margin: 2px 0 0; font-size: 12.5px; font-weight: 600; padding: 6px 9px; border-radius: 8px; }
.work-card-autoassign.is-ok { background: var(--green-soft); color: var(--green); }
.work-card-autoassign.is-fail { background: var(--red-soft); color: var(--red); }
.work-autoassign-all { margin-left: auto; }
.work-autoassign-banner { margin: 0 0 10px; font-size: 13px; font-weight: 600; padding: 8px 12px; border-radius: 8px; }
.work-autoassign-banner.is-ok { background: var(--green-soft); color: var(--green); }
.work-autoassign-banner.is-fail { background: var(--amber-soft); color: var(--amber); }
.assignment-ctx { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; margin: 4px 0 10px; background: var(--panel-2, var(--panel)); }
.assignment-ctx h3 { margin: 0 0 6px; font-size: 12px; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); }
.assignment-ctx-list { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 16px; margin: 0; }
.assignment-ctx-list > div { display: flex; flex-direction: column; }
.assignment-ctx-list dt { font-size: 11px; color: var(--muted); }
.assignment-ctx-list dd { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink); }
.assignment-ctx-routing { margin: 8px 0 0; font-size: 12px; color: var(--muted); font-style: italic; }
.method-owner-field { display: flex; flex-direction: column; gap: 4px; margin-top: 12px; }
.method-owner-field > span { font-weight: 650; font-size: 13px; color: var(--ink); }

/* Order 2 — auto-scheduler surfacing: system-scheduled/assigned badges + reschedule/lapse notes */
.work-system-badge { display: inline-flex; align-items: center; padding: 1px 8px; border-radius: 999px; background: var(--slate-soft); color: var(--slate); font-size: 10.5px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; }
.work-system-badge.work-system-assigned { background: var(--green-soft); color: var(--green); }
.work-card-schedule-notes { margin: 0; padding-left: 18px; font-size: 12.5px; }
.work-card-schedule-notes li { margin: 2px 0; }
.work-card-schedule-notes .work-note-resched { color: var(--amber); }
.work-card-schedule-notes .work-note-escalation { color: var(--red); font-weight: 650; }
.work-assignment-card.work-lapse-risk { border-left-color: var(--red); border-color: var(--red); }
.assignment-recert-note { margin: 6px 0 0; padding: 8px 10px; border-radius: 8px; background: var(--blue-soft); color: var(--ink); font-size: 12.5px; }
#assignmentAssignee.is-locked { opacity: .6; cursor: not-allowed; }

/* Capacity board (reorg Phase 3c) — operator × day load grid */
.cap-grid-scroll { overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; }
.cap-grid { border-collapse: collapse; width: 100%; font-size: 12px; }
.cap-grid th, .cap-grid td { border: 1px solid var(--line); text-align: center; }
.cap-grid thead th { background: var(--panel, #fff); position: sticky; top: 0; z-index: 2; }
.cap-day { padding: 6px 8px; min-width: 52px; line-height: 1.2; }
.cap-day span { display: block; font-weight: 700; }
.cap-day small { color: var(--muted); font-variant-numeric: tabular-nums; }
.cap-day.cap-weekend { background: var(--paper, #f5f4f0); }
.cap-op { padding: 6px 10px; text-align: left; background: var(--panel, #fff); position: sticky; left: 0; z-index: 1; min-width: 150px; }
.cap-corner { z-index: 3; }
.cap-op span { display: block; font-weight: 650; }
.cap-op small { color: var(--muted); font-variant-numeric: tabular-nums; }
.cap-cell { padding: 4px 5px; vertical-align: middle; }
.cap-cell .cap-count { display: block; font-weight: 700; font-variant-numeric: tabular-nums; }
.cap-cell .cap-min { display: block; font-size: 10.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.cap-tone-empty { background: transparent; }
.cap-tone-ok { background: var(--green-soft); }
.cap-tone-review { background: var(--amber-soft); }
.cap-tone-hold { background: var(--red-soft); }
.cap-cell.cap-tone-hold .cap-min, .cap-cell.cap-tone-review .cap-min { color: inherit; opacity: .85; }
.cap-legend { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 10px 2px 0; font-size: 12px; color: var(--muted); }
.cap-swatch { display: inline-block; width: 14px; height: 14px; border-radius: 3px; border: 1px solid var(--line); margin-left: 8px; }
.cap-conflict-list, .cap-backlog-list { margin: 0; padding-left: 18px; display: grid; gap: 6px; }
.cap-conflict-list li { font-size: 13px; }
.cap-conflict.cap-tone-hold { color: var(--red); }
.cap-conflict.cap-tone-review { color: var(--amber); }
.cap-backlog-list li { font-size: 13px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
/* Order 3 v1 — two-resource grids (operator + instrument) */
.cap-grid-block { margin-top: 12px; }
.cap-grid-block:first-child { margin-top: 0; }
.cap-grid-title { margin: 0 2px 6px; font-size: 13px; font-weight: 650; }
.cap-grid-empty { font-size: 13px; margin: 2px; }
.cap-day.cap-closed, .cap-cell.cap-closed { background: var(--paper, #f5f4f0); }
.cap-cell.cap-closed { opacity: .55; }
.cap-held { display: inline-block; margin-left: 4px; padding: 0 4px; border-radius: 3px; font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; background: var(--line, #ddd); color: var(--muted); }

/* Manager Command Center (reorg Phase 4) */
.cmd-lead { margin: 0 0 14px; }
.cmd-headline { margin: 0; font-size: 20px; font-weight: 700; }
.cmd-alert-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; margin-bottom: 18px; }
.cmd-alert { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--line); border-left-width: 4px; border-radius: 12px; background: var(--panel, #fff); color: var(--ink); text-align: left; cursor: pointer; font: inherit; }
.cmd-alert:hover { border-color: var(--muted); }
.cmd-alert.cmd-tone-hold { border-left-color: var(--red); }
.cmd-alert.cmd-tone-review { border-left-color: var(--amber); }
.cmd-alert.cmd-tone-ok { border-left-color: var(--green); }
.cmd-alert-count { font-size: 24px; font-weight: 800; font-variant-numeric: tabular-nums; min-width: 1.4em; }
.cmd-alert.cmd-tone-hold .cmd-alert-count { color: var(--red); }
.cmd-alert.cmd-tone-review .cmd-alert-count { color: var(--amber); }
.cmd-alert-label { font-size: 13px; font-weight: 600; line-height: 1.25; }
.cmd-columns { display: grid; grid-template-columns: 2fr 1fr; gap: 16px; align-items: start; }
@media (max-width: 860px) { .cmd-columns { grid-template-columns: 1fr; } }
.cmd-health-grid { display: grid; gap: 8px; }
.cmd-health { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel, #fff); color: var(--ink); cursor: pointer; font: inherit; text-align: left; }
.cmd-health:hover { border-color: var(--muted); }
.cmd-health-label { font-weight: 600; font-size: 13.5px; }
.qms-starter-card { border-left: 4px solid var(--accent, var(--teal, #1d6fb8)); background: var(--blue-soft, #eef4fb); margin-bottom: 14px; }

/* ---------------------------------------------------------------------------
   makeListView(config) — reusable list component (Order 4). Config-driven
   toolbar (search + facet filters), sortable table, and page windowing. Reuses
   the .table-wrap / .search / table base styles; only the list-specific chrome
   lives here so genealogy / labData / the Order-5 portal can adopt it as-is.
--------------------------------------------------------------------------- */
/* minmax(0,1fr) + min-width:0 on every child lets the wide table scroll INSIDE
   .lv-table-wrap instead of forcing the grid track (and the page) wider. Without
   this the auto min-size of the grid item leaks the table's min-width:980px out to
   the document — the +151px (Complete Test Schedule) / +91px (Audit Trail) overflow. */
.lv-host { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; min-width: 0; }
.lv-toolbar { display: flex; align-items: end; gap: 10px; flex-wrap: wrap; min-width: 0; }
.lv-table-wrap { width: 100%; min-width: 0; }
.lv-toolbar .lv-search { flex: 1 1 220px; min-width: 180px; }
.lv-toolbar .lv-filter { flex: 0 1 168px; min-width: 132px; }
.lv-toolbar .lv-filter-range { flex: 0 1 264px; min-width: 232px; }
.lv-daterange { display: flex; gap: 6px; }
.lv-daterange input { flex: 1 1 0; min-width: 0; }
.lv-toolbar .lv-reset { min-height: 40px; margin-bottom: 0; }
.lv-results { display: block; min-width: 0; }
.lv-th.lv-sortable { cursor: pointer; user-select: none; white-space: nowrap; }
.lv-th.lv-sortable:hover { background: #e2e9ef; }
.lv-th.lv-sortable:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }
.lv-sort { margin-left: 4px; color: var(--blue); font-size: 11px; }
.lv-table td .module-badge,
.lv-table td .work-priority-chip { white-space: nowrap; }
.lv-actions { white-space: nowrap; }
.lv-pager { display: flex; align-items: center; justify-content: flex-end; gap: 12px; flex-wrap: wrap; padding: 10px 2px 2px; }
.lv-pager-info { color: var(--muted); font-size: 12.5px; }
/* K1-styled list-view (makeListView) — matches the .k1-table look without changing its sortable <table> structure (K1 finalization) */
body.k1-mode .lv-table-wrap{background:var(--k1-panel);border:1px solid var(--k1-line);border-radius:12px;box-shadow:var(--k1-tile-shadow);overflow-x:auto;}
body.k1-mode .lv-table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;}
body.k1-mode .lv-table .lv-th{font-family:var(--k1-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--k1-ink-3);text-align:left;padding:11px 15px;border-bottom:1px solid var(--k1-line);white-space:nowrap;}
body.k1-mode .lv-table .lv-sortable{cursor:pointer;transition:color .12s;}
body.k1-mode .lv-table .lv-sortable:hover,body.k1-mode .lv-table .lv-sortable:focus-visible{color:var(--k1-ink);}
body.k1-mode .lv-table tbody td{font-size:12.5px;color:var(--k1-ink);padding:11px 15px;border-top:1px solid var(--k1-line-soft);vertical-align:middle;}
body.k1-mode .lv-table tbody tr:first-child td{border-top:none;}
body.k1-mode .lv-table tbody tr:hover td{background:var(--k1-panel-2);}
body.k1-mode .lv-actions{white-space:nowrap;text-align:right;}
.lv-empty { padding: 26px 18px; text-align: center; color: var(--muted); border: 1px dashed var(--line); border-radius: 8px; background: var(--soft); }
@media (max-width: 720px) {
  .lv-toolbar .lv-search,
  .lv-toolbar .lv-filter { flex: 1 1 100%; }
}

/* ============================================================
   SQC landing hero (2026-07-11) — dark KAT visual language with a
   live control-chart canvas. Scoped to .qa-launch-screen.sqc; the
   legacy poster/cinema rules above are now unused (markup removed).
   Appended last so these win the cascade over the old landing rules.
   ============================================================ */
.qa-launch-screen.sqc {
  --lc-asphalt:#131211; --lc-teal:#1ec6b4; --lc-amber:#e6a63f;
  --lc-gold:#c79a32; --lc-ink:#f4efe6; --lc-muted:#a29a90; --lc-faint:#6f675f;
  --lc-line:rgba(244,239,230,.10);
  --lc-mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
  position:relative; min-height:100svh; overflow:hidden; isolation:isolate;
  color:var(--lc-ink);
  background:
    radial-gradient(120% 90% at 88% 6%, rgba(30,198,180,.10), transparent 46%),
    radial-gradient(120% 100% at 4% 98%, rgba(230,166,63,.09), transparent 52%),
    var(--lc-asphalt);
}
.qa-launch-screen.sqc::before { content:none; }
.qa-launch-screen.sqc::after { content:none; }
/* The SQC hero is full-bleed with its own KRIZ|AT topbar, so hide the global app
   header on the signed-out welcome page (avoids a duplicate KRIZ|AT + top strip). */
body.signed-out .topbar { display:none; }

.qa-launch-screen.sqc .landing-chart { position:absolute; inset:0; width:100%; height:100%; display:block; z-index:0; }
.qa-launch-screen.sqc .landing-scrim { position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(105deg, rgba(19,18,17,.94) 0%, rgba(19,18,17,.82) 30%, rgba(19,18,17,.30) 60%, transparent 82%),
    linear-gradient(to bottom, rgba(19,18,17,.5), transparent 20%, transparent 76%, rgba(19,18,17,.72)); }

.qa-launch-screen.sqc .launch-topbar { position:absolute; top:clamp(20px,3vw,40px);
  left:clamp(22px,4vw,52px); right:clamp(22px,4vw,52px); z-index:3;
  display:flex; align-items:center; justify-content:space-between; gap:16px; }
.qa-launch-screen.sqc .launch-kat { display:inline-flex; text-decoration:none; }
.qa-launch-screen.sqc .launch-kat .kat-logo { height:26px; width:auto; display:block; opacity:.92; }
.qa-launch-screen.sqc .launch-kat:focus-visible { outline:2px solid var(--lc-amber); outline-offset:4px; border-radius:4px; }
.qa-launch-screen.sqc .launch-status { display:inline-flex; align-items:center; gap:.6em; font-family:var(--lc-mono);
  font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; color:var(--lc-muted);
  padding:.5em 1em; border:1px solid var(--lc-line); border-radius:999px; background:rgba(244,239,230,.03); }
.qa-launch-screen.sqc .launch-status-dot { width:7px; height:7px; border-radius:50%; background:var(--lc-teal);
  box-shadow:0 0 0 0 rgba(30,198,180,.55); animation:lcPulse 2.6s ease-out infinite; }
@keyframes lcPulse { 0%{box-shadow:0 0 0 0 rgba(30,198,180,.5)} 70%{box-shadow:0 0 0 10px rgba(30,198,180,0)} 100%{box-shadow:0 0 0 0 rgba(30,198,180,0)} }

.qa-launch-screen.sqc .qa-launch-content { position:relative; z-index:2; min-height:100svh;
  display:flex; align-items:center; padding:clamp(22px,4vw,52px); }
.qa-launch-screen.sqc .qa-launch-copy { max-width:min(46vw,560px); width:100%; }
@media (max-width:900px){ .qa-launch-screen.sqc .qa-launch-copy { max-width:none; } }

.qa-launch-screen.sqc .launch-eyebrow { margin:0 0 20px; font-family:var(--lc-mono); font-size:.7rem;
  letter-spacing:.26em; text-transform:uppercase; color:var(--lc-muted); display:inline-flex; align-items:center; gap:.7em; }
.qa-launch-screen.sqc .launch-eyebrow-tick { width:24px; height:1px; background:linear-gradient(90deg,var(--lc-gold),var(--lc-teal)); }

.qa-launch-screen.sqc .qa-launch-title { margin:0; }
/* One integrated lockup image (wordmark + baked two-line tagline, Avenir Next @3x). The box
   tracks the wordmark width (clamp) so the wordmark renders at the same size as before; the
   tagline is baked in tight underneath, right-aligned under the final "a"/™. It scales — never
   pixelates — because the asset is retina @3x. */
.qa-launch-screen.sqc .qa-launch-lockup-img { display:block; width:clamp(240px,42vw,440px); height:auto;
  filter:drop-shadow(0 2px 34px rgba(30,198,180,.12)) drop-shadow(0 2px 4px rgba(0,0,0,.5)); }

.qa-launch-screen.sqc .qa-launch-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:clamp(22px,2.6vw,30px); }
/* One considered, restrained set: uniform hairline ghost buttons at a shared height/padding/
   radius. The primary reads as lead through a QUIET teal accent (tinted hairline + faint wash
   + teal glyph), not a loud filled pill. Hover/focus stay understated. */
.qa-launch-screen.sqc .qa-launch-action { display:inline-flex; align-items:center; justify-content:flex-start;
  gap:.62em; cursor:pointer; box-sizing:border-box; min-height:50px;
  font-family:var(--font-display); font-size:.95rem; font-weight:600; text-decoration:none;
  padding:.68em 1.15em; border-radius:9px;
  border:1px solid rgba(244,239,230,.15); background:rgba(244,239,230,.025); color:var(--lc-ink); box-shadow:none;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease; }
.qa-launch-screen.sqc .qa-launch-action .action-icon { width:auto; height:auto; background:none; border-radius:0;
  color:inherit; opacity:.66; }
.qa-launch-screen.sqc .qa-launch-action .action-icon svg { width:17px; height:17px; display:block; }
.qa-launch-screen.sqc .qa-launch-action strong { font-size:15px; font-weight:750; letter-spacing:.005em; }
.qa-launch-screen.sqc .qa-launch-action.primary { color:var(--lc-ink); border-color:rgba(30,198,180,.5);
  background:rgba(30,198,180,.09); box-shadow:none; }
.qa-launch-screen.sqc .qa-launch-action.primary .action-icon { color:var(--lc-teal); opacity:1; }
.qa-launch-screen.sqc .qa-launch-action:not(.primary):hover { transform:translateY(-1px);
  border-color:rgba(244,239,230,.3); background:rgba(244,239,230,.06); }
.qa-launch-screen.sqc .qa-launch-action.primary:hover { transform:translateY(-1px);
  border-color:var(--lc-teal); background:rgba(30,198,180,.15); box-shadow:0 8px 22px rgba(30,198,180,.16); }
.qa-launch-screen.sqc .qa-launch-action:active { transform:translateY(0); }
.qa-launch-screen.sqc .qa-launch-action:focus-visible { outline:2px solid var(--lc-amber); outline-offset:3px; }
.qa-launch-screen.sqc .qa-launch-action small { display:none; }

.qa-launch-screen.sqc .qa-launch-language { display:inline-flex; align-items:center; gap:.55em; margin-top:28px;
  font-family:var(--lc-mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--lc-faint); }
.qa-launch-screen.sqc .qa-launch-language-icon svg { width:15px; height:15px; display:block; opacity:.7; }
.qa-launch-screen.sqc .qa-launch-language label { color:var(--lc-faint); }
.qa-launch-screen.sqc .qa-launch-language select { font:inherit; color:var(--lc-muted); background:transparent;
  border:1px solid var(--lc-line); border-radius:7px; padding:.35em .6em; letter-spacing:.06em; }

.qa-launch-screen.sqc .landing-readout { position:absolute; right:clamp(16px,4vw,48px); bottom:clamp(56px,9vh,74px);
  z-index:2; font-family:var(--lc-mono); font-size:.72rem; line-height:1.9; color:var(--lc-muted);
  text-align:right; pointer-events:none; }
.qa-launch-screen.sqc .landing-readout-lbl { color:var(--lc-faint); letter-spacing:.2em; text-transform:uppercase;
  font-size:.6rem; display:block; margin-bottom:.5em; }
.qa-launch-screen.sqc .landing-readout b { color:var(--lc-ink); font-weight:600; }
.qa-launch-screen.sqc .landing-readout .lc-k { color:var(--lc-faint); }
.qa-launch-screen.sqc .lc-in { color:var(--lc-teal); }
.qa-launch-screen.sqc .lc-warn { color:var(--lc-amber); }
.qa-launch-screen.sqc .lc-out { color:#ff8b5c; }
@media (max-width:720px){ .qa-launch-screen.sqc .landing-readout { display:none; } }

.qa-launch-screen.sqc .landing-foot { position:absolute; left:clamp(22px,4vw,52px); bottom:clamp(18px,3.4vh,30px);
  z-index:2; margin:0; font-family:var(--lc-mono); font-size:.66rem; letter-spacing:.12em; color:var(--lc-faint); }

@media (prefers-reduced-motion:reduce){ .qa-launch-screen.sqc .launch-status-dot { animation:none; } }

/* ============================================================================
   K1 · ASPHALT RAIL — design system + app shell (Phase 0 foundation)
   Namespaced (.k1-* / body.k1-mode) so it coexists with the legacy styles
   during migration. Tokens live on :root (all --k1-* prefixed → no collision).
   ========================================================================== */
:root{
  /* rail */
  --k1-rail:#131211; --k1-rail-ink:#f4efe6; --k1-rail-muted:#c8c1b4; --k1-rail-dim:#8a8377; --k1-rail-hair:#2c2925;
  --k1-gold:#c79a32; --k1-active-bg:#17322e; --k1-active-ink:#3ddbc9; --k1-active-bar:#1ec6b4;
  /* workspace */
  --k1-bg:#fbfbfa; --k1-top:#ffffff; --k1-panel:#ffffff; --k1-panel-2:#f6f8f7;
  --k1-ink:#1a1c1b; --k1-ink-2:#5b615e; --k1-ink-3:#767b77; /* CSS-C (B11): darkened #9aa09c->#767b77 for WCAG AA (~4.5:1) */
  --k1-line:#e7e9e7; --k1-line-soft:#eef0ee; --k1-search-bg:#f4f6f5;
  /* accent (teal) — separate from semantic */
  --k1-teal:#12a594; --k1-teal-bright:#1ec6b4; --k1-teal-soft:#e3f3f0; --k1-teal-mid:#a9ddd5; --k1-teal-ink:#0c7d70; --k1-on-teal:#ffffff;
  /* semantic */
  --k1-good:#158a63; --k1-good-soft:#e4f2ec; --k1-warn:#b47417; --k1-warn-soft:#f6eddc; --k1-crit:#c94a3f; --k1-crit-soft:#f8e9e6;
  --k1-warn-ink:#8f5a0f; /* CSS-C (B11): AA-contrast (~4.6:1) warn TEXT token; keep --k1-warn for borders/dots */
  --k1-mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,monospace;
  --k1-display:"Avenir Next","Avenir",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --k1-app-border:1px solid #e4e6e4;
  --k1-app-shadow:0 1px 2px rgba(20,22,20,.05),0 16px 44px -18px rgba(20,22,20,.22);
  --k1-tile-shadow:0 1px 2px rgba(20,22,20,.04);
}

/* ---------------------------------------------------------------------------
   1 · COMPONENTS — callable by k1ui.js output anywhere (.k1-scope or k1-mode)
   ------------------------------------------------------------------------- */
.k1-kpis,.k1-krow,.k1-tile,.k1-panel,.k1-chartcard,.k1-chip,.k1-pri,.k1-btn,.k1-table,.k1-spark,.k1-readout,.k1-clegend,.k1-prow{
  font-family:var(--k1-display);
}
.k1-tile *,.k1-readout *,.k1-table *,.k1-charthead *{font-variant-numeric:tabular-nums;}

/* KPI tiles */
.k1-kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;}
@media(max-width:1120px){.k1-kpis{grid-template-columns:repeat(3,1fr);}}
@media(max-width:640px){.k1-kpis{grid-template-columns:repeat(2,1fr);}}
.k1-krow{display:grid;gap:12px;}
.k1-krow.k5{grid-template-columns:repeat(5,1fr);}
.k1-krow.k4{grid-template-columns:repeat(4,1fr);}
.k1-krow.k3{grid-template-columns:repeat(3,1fr);}
.k1-krow.k2{grid-template-columns:repeat(2,1fr);}
@media(max-width:900px){.k1-krow.k5,.k1-krow.k4,.k1-krow.k3{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.k1-krow{grid-template-columns:1fr !important;}}
.k1-tile{position:relative;background:var(--k1-panel);border:1px solid var(--k1-line);border-radius:12px;padding:14px 15px 12px;box-shadow:var(--k1-tile-shadow);display:flex;flex-direction:column;gap:9px;overflow:hidden;}
.k1-tile::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--k1-tacc,var(--k1-teal));}
.k1-tile.t-crit{--k1-tacc:var(--k1-crit);} .k1-tile.t-warn{--k1-tacc:var(--k1-warn);} .k1-tile.t-good{--k1-tacc:var(--k1-good);} .k1-tile.t-teal{--k1-tacc:var(--k1-teal);}
.k1-tile .eb{font-family:var(--k1-mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--k1-ink-3);}
.k1-tile .valrow{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;}
.k1-tile .val{font-size:29px;font-weight:700;line-height:.95;color:var(--k1-ink);letter-spacing:-.02em;}
.k1-tile .val small{font-size:15px;font-weight:600;color:var(--k1-ink-2);letter-spacing:0;}
.k1-tile .spark{display:block;width:66px;height:22px;flex:none;}
.k1-tile .spark svg{width:100%;height:100%;display:block;overflow:visible;}
.k1-delta{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;}
.k1-delta.g{color:var(--k1-good);} .k1-delta.b{color:var(--k1-crit);} .k1-delta.w{color:var(--k1-warn-ink);/* CSS-C (B11) warn TEXT */} .k1-delta.n{color:var(--k1-ink-3);}
.k1-delta .cap{color:var(--k1-ink-3);font-weight:400;}

/* control chart card */
.k1-chartcard{background:var(--k1-panel);border:var(--k1-app-border);border-radius:14px;box-shadow:var(--k1-app-shadow);padding:18px 20px;overflow:hidden;}
.k1-chartcard.mini{border-radius:12px;box-shadow:var(--k1-tile-shadow);padding:14px 15px 12px;border:1px solid var(--k1-line);}
.k1-charthead{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;}
.k1-charthead .eb{font-family:var(--k1-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--k1-teal-ink);font-weight:600;}
.k1-charthead h4{font-size:16.5px;color:var(--k1-ink);font-weight:600;letter-spacing:-.01em;margin:0;}
.k1-charthead .unit{font-family:var(--k1-mono);font-size:11.5px;color:var(--k1-ink-3);}
.k1-charthead .flags{margin-left:auto;}
/* In-place method picker: reads like the chart title (h4) but is a real <select> so a
   manager can switch which subscribed test the control chart previews without leaving the page. */
.k1-chart-methodpick{font-family:inherit;font-size:14px;font-weight:600;letter-spacing:-.01em;color:var(--k1-ink);background-color:var(--k1-panel-2);border:1px solid var(--k1-line);border-radius:7px;padding:3px 24px 3px 9px;margin:-1px 0;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--k1-ink-3) 50%),linear-gradient(135deg,var(--k1-ink-3) 50%,transparent 50%);background-position:calc(100% - 12px) 55%,calc(100% - 7px) 55%;background-size:5px 5px,5px 5px;background-repeat:no-repeat;transition:background-color .12s,border-color .12s;}
.k1-chart-methodpick:hover{border-color:var(--k1-ink-3);}
.k1-chart-methodpick:focus-visible{outline:none;border-color:var(--k1-teal);box-shadow:0 0 0 3px color-mix(in srgb,var(--k1-teal) 22%,transparent);}
.k1-spc{margin-top:6px;}
.k1-spc svg{width:100%;height:auto;display:block;}
.k1-clegend{display:flex;flex-wrap:wrap;gap:9px 16px;margin-top:6px;font-size:11.5px;color:var(--k1-ink-2);}
.k1-clegend span{display:inline-flex;align-items:center;gap:7px;}
.k1-clegend i{width:17px;flex:none;border-top-width:2px;border-top-style:solid;display:inline-block;height:0;}
.k1-clegend .l-cl i{border-top-color:var(--k1-ink-2);}
.k1-clegend .l-sig i{border-top-style:dashed;border-top-color:var(--k1-ink-3);}
.k1-clegend .l-ucl i{border-top-style:dashed;border-top-color:var(--k1-warn);}
.k1-clegend .l-ser i{border-top-color:var(--k1-teal);}
.k1-clegend .l-ooc em{width:10px;height:10px;border-radius:50%;background:var(--k1-crit);display:inline-block;box-shadow:0 0 0 3px rgba(201,74,63,.22);}
.k1-readout{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px;margin-top:12px;padding-top:12px;border-top:1px solid var(--k1-line-soft);font-size:12px;color:var(--k1-ink-2);}
.k1-readout .rk{font-family:var(--k1-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--k1-ink-3);margin-right:5px;}
.k1-readout b{font-family:var(--k1-mono);color:var(--k1-ink);font-weight:700;}

/* chips / priority / buttons */
.k1-chip{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:600;padding:2px 9px;border-radius:999px;white-space:nowrap;line-height:1.5;}
.k1-chip::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;}
.k1-chip.nb::before{display:none;}
.k1-chip.good{color:var(--k1-good);background:var(--k1-good-soft);}
.k1-chip.warn{color:var(--k1-warn);background:var(--k1-warn-soft);}
.k1-chip.crit{color:var(--k1-crit);background:var(--k1-crit-soft);}
.k1-chip.teal{color:var(--k1-teal-ink);background:var(--k1-teal-soft);}
.k1-chip.neutral{color:var(--k1-ink-2);background:var(--k1-line-soft);}
.k1-pri{display:inline-block;font-family:var(--k1-mono);font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:6px;letter-spacing:.02em;white-space:nowrap;}
.k1-pri.p1{color:var(--k1-crit);background:var(--k1-crit-soft);}
.k1-pri.p2{color:var(--k1-warn-ink);/* CSS-C (B11) warn TEXT */background:var(--k1-warn-soft);}
.k1-pri.p3{color:var(--k1-ink-2);background:var(--k1-line-soft);}
.k1-btn{font-family:var(--k1-display);font-size:12.5px;font-weight:600;padding:7px 14px;border-radius:8px;border:1px solid transparent;background:var(--k1-teal);color:var(--k1-on-teal);cursor:pointer;transition:filter .15s,background .15s,border-color .15s;}
.k1-btn:hover{filter:brightness(1.06);}
.k1-btn.ghost{background:transparent;color:var(--k1-teal-ink);border-color:var(--k1-line);}
.k1-btn.ghost:hover{background:var(--k1-teal-soft);border-color:var(--k1-teal);}
.k1-btn.sm{font-size:11.5px;padding:5px 11px;}

/* panels */
.k1-panel{background:var(--k1-panel);border:1px solid var(--k1-line);border-radius:12px;box-shadow:var(--k1-tile-shadow);overflow:hidden;}
.k1-panelhead{display:flex;align-items:center;gap:10px;padding:11px 14px;border-bottom:1px solid var(--k1-line);}
.k1-panelhead .t{font-weight:700;font-size:13.5px;color:var(--k1-ink);}
.k1-panelhead .c{font-family:var(--k1-mono);font-size:11px;color:var(--k1-ink-3);}
.k1-panelhead .r{margin-left:auto;display:flex;gap:7px;}
.k1-panelpad{padding:14px;}
.k1-panelsub{margin:0 0 12px;font-size:12.5px;line-height:1.5;color:var(--k1-ink-2);}
.k1-panelsub:only-child,.k1-panelsub:last-child{margin-bottom:0;}
.k1-prow{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:11px 14px;border-top:1px solid var(--k1-line-soft);}
.k1-prow:first-of-type{border-top:none;}
.k1-prow .pin{width:8px;height:8px;border-radius:50%;flex:none;}
.k1-prow .pin.crit{background:var(--k1-crit);} .k1-prow .pin.warn{background:var(--k1-warn);} .k1-prow .pin.teal{background:var(--k1-teal);} .k1-prow .pin.good{background:var(--k1-good);}
.k1-prow .ptxt{font-size:12.5px;color:var(--k1-ink);font-weight:600;}
.k1-prow .ptxt small{display:block;font-weight:400;color:var(--k1-ink-3);font-family:var(--k1-mono);font-size:10.5px;margin-top:2px;}
.k1-prow .pwhen{font-family:var(--k1-mono);font-size:11px;font-weight:600;color:var(--k1-ink-2);white-space:nowrap;}
.k1-prow .pwhen.over{color:var(--k1-crit);}

/* data table */
/* CSS-A (B11): allow horizontal scroll instead of clipping wide tables */
.k1-table{background:var(--k1-panel);border:1px solid var(--k1-line);border-radius:12px;box-shadow:var(--k1-tile-shadow);overflow-x:auto;overflow-y:visible;}
/* CSS-A (B11): keep cell widths on narrow screens so the card scrolls rather than collapsing */
@media(max-width:640px){.k1-thead,.k1-trow{min-width:640px;}}
.k1-thead,.k1-trow{display:grid;grid-template-columns:var(--k1-tcols,1fr);gap:12px;align-items:center;padding:11px 15px;}
.k1-thead{font-family:var(--k1-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--k1-ink-3);border-bottom:1px solid var(--k1-line);}
.k1-trow{position:relative;border-top:1px solid var(--k1-line-soft);font-size:12.5px;color:var(--k1-ink);transition:background .12s;}
.k1-trow:first-of-type{border-top:none;}
.k1-trow:hover{background:var(--k1-panel-2);}
.k1-trow[data-page]{cursor:pointer;}
.k1-tstripe{position:absolute;left:0;top:0;bottom:0;width:3px;}
.k1-trow.s-crit .k1-tstripe{background:var(--k1-crit);} .k1-trow.s-warn .k1-tstripe{background:var(--k1-warn);} .k1-trow.s-teal .k1-tstripe{background:var(--k1-teal);} .k1-trow.s-good .k1-tstripe{background:var(--k1-good);}
.k1-td.mono,.k1-th.mono{font-family:var(--k1-mono);}
.k1-td.a-right,.k1-th.a-right{text-align:right;justify-self:end;}
.k1-td.a-center,.k1-th.a-center{text-align:center;justify-self:center;}
.k1-tempty{padding:22px 15px;text-align:center;color:var(--k1-ink-3);font-size:12.5px;}
.k1-railbadge{font-family:var(--k1-mono);font-size:10px;background:var(--k1-crit);color:#fff;border-radius:999px;padding:1px 6px;line-height:1.45;}

/* ---------------------------------------------------------------------------
   2 · APP SHELL — asphalt rail + K1 top strip, shown when body.k1-mode
   ------------------------------------------------------------------------- */
body.k1-mode .topbar{display:none;}
body.k1-mode .shell{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:100vh;background:var(--k1-bg);}
body.k1-mode .sidebar{display:none;}
/* K1 default typeface: the app base font is Inter; without this, any element that does not
   explicitly set --k1-display falls back to Inter (the "wrong font face" leak). Set the K1
   display face (Avenir Next) as the authenticated-app default; mono/component fonts still
   win where explicitly declared. */
body.k1-mode{font-family:var(--k1-display);}
/* K1 TYPOGRAPHY CANONICALIZATION — one computed signature per semantic element type
   (verified by audit-consistency.mjs). Only the drifting size/weight is pinned here;
   tone colors, mono tabular-nums cells, and active/idle nav states are intentional axes
   and are deliberately NOT touched. See scratchpad/consistency-campaign.md for the plan. */
body.k1-mode .muted{font-family:var(--k1-display);font-size:12.5px!important;font-weight:400;color:var(--k1-ink-3);}
body.k1-mode .k1-delta{font-size:11px;font-weight:600;}
body.k1-mode .eb,body.k1-mode .k1-tile .eb{font-size:9.5px;font-weight:400;}
body.k1-mode .workspace h3{font-size:17px;font-weight:700;}
body.k1-mode .k1-ptitle .sub{font-size:12.5px;font-weight:400;}
body.k1-mode .k1-btn.ghost{font-size:11.5px;font-weight:600;}
body.k1-mode .workspace{overflow:visible;padding:24px;padding-top:0;background:var(--k1-bg);min-width:0;}
body.k1-mode .lab-status-banner{margin-top:16px;}

/* rail */
.k1-rail-scrim{display:none;}
.k1-rail{display:none;}
body.k1-mode .k1-rail{display:flex;flex-direction:column;gap:1px;background:var(--k1-rail);padding:14px 12px;position:sticky;top:0;align-self:start;height:100vh;overflow-y:auto;overflow-x:hidden;}
.k1-rail-brand{display:flex;align-items:center;gap:8px;padding:4px 8px 14px;border-bottom:1px solid var(--k1-rail-hair);margin-bottom:11px;cursor:pointer;}
.k1-rail-logo{width:24px;height:24px;border-radius:7px;background:var(--k1-gold);color:var(--k1-rail);display:grid;place-items:center;font-family:var(--k1-display);font-weight:800;font-size:14px;flex:none;}
.k1-rail-wm{font-family:var(--k1-display);font-weight:700;font-size:15px;letter-spacing:-.01em;color:var(--k1-rail-ink);}
.k1-rail-wm sup{font-size:7px;color:var(--k1-gold);vertical-align:super;}
.k1-rail-lab{margin-left:auto;font-family:var(--k1-mono);font-size:9.5px;color:var(--k1-rail-dim);letter-spacing:.02em;text-align:right;max-width:88px;line-height:1.25;text-transform:uppercase;}
.k1-rail-nav{display:flex;flex-direction:column;gap:1px;}
.k1-rail-group{margin:11px 4px 4px;font-family:var(--k1-mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--k1-rail-dim);display:flex;justify-content:space-between;align-items:center;}
.k1-item{display:flex;align-items:center;gap:9px;padding:6px 9px;border-radius:7px;font-size:12.5px;color:var(--k1-rail-muted);background:transparent;border:none;width:100%;text-align:left;cursor:pointer;font-family:var(--k1-display);transition:background .12s,color .12s;}
.k1-item:hover{background:rgba(255,255,255,.05);color:var(--k1-rail-ink);}
.k1-item .k1-dot{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.5;flex:none;}
.k1-item.on{background:var(--k1-active-bg);color:var(--k1-active-ink);font-weight:600;box-shadow:inset 2px 0 0 var(--k1-active-bar);}
.k1-item.on .k1-dot{background:var(--k1-active-bar);opacity:1;}
.k1-item .k1-railbadge{margin-left:auto;}
.k1-item .k1-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* top strip (breadcrumb · ⌘K · avatar · sub-nav) — bleeds full width, sticky */
.k1-topbar{display:none;}
body.k1-mode .k1-topbar{display:block;position:sticky;top:0;z-index:40;margin:0 -24px;background:var(--k1-top);border-bottom:1px solid var(--k1-line);}
.k1-topbar-row{display:flex;align-items:center;gap:12px;padding:11px 24px;}
.k1-railtoggle{display:none;background:transparent;border:1px solid var(--k1-line);border-radius:8px;width:34px;height:32px;align-items:center;justify-content:center;cursor:pointer;color:var(--k1-ink-2);font-size:15px;flex:none;}
.k1-breadcrumb{font-size:12.5px;color:var(--k1-ink-2);display:flex;gap:7px;align-items:center;flex-wrap:wrap;min-width:0;}
.k1-breadcrumb .sep{color:var(--k1-ink-3);}
.k1-breadcrumb .crumb{background:transparent;border:none;color:var(--k1-ink-2);font-size:12.5px;cursor:pointer;padding:0;font-family:var(--k1-display);}
.k1-breadcrumb .crumb:hover{color:var(--k1-teal-ink);text-decoration:underline;}
.k1-breadcrumb .cur{color:var(--k1-ink);font-weight:600;}
.k1-cmdbar{margin-left:auto;display:flex;align-items:center;gap:8px;background:var(--k1-search-bg);border:1px solid var(--k1-line);border-radius:8px;padding:6px 10px;color:var(--k1-ink-3);font-size:12px;min-width:200px;cursor:text;transition:border-color .12s;font-family:var(--k1-display);}
.k1-cmdbar:hover{border-color:var(--k1-ink-3);}
.k1-cmdbar .k1-cmdlabel{white-space:nowrap;}
.k1-cmdbar .k1-k{margin-left:auto;font-family:var(--k1-mono);font-size:10px;border:1px solid var(--k1-line);border-radius:5px;padding:1px 5px;background:#fff;color:var(--k1-ink-2);}
.k1-topbar-util{display:flex;align-items:center;gap:10px;flex:none;}
.k1-syntheticchip{font-family:var(--k1-mono);font-size:10px;letter-spacing:.04em;color:var(--k1-warn-ink);/* CSS-C (B11) warn TEXT */background:var(--k1-warn-soft);border-radius:999px;padding:3px 9px;white-space:nowrap;}
@media(max-width:1080px){.k1-syntheticchip{display:none;}}
.k1-avatar-wrap{position:relative;}
.k1-avatar{width:30px;height:30px;border-radius:50%;background:var(--k1-teal);color:var(--k1-on-teal);display:grid;place-items:center;font-size:11px;font-weight:700;border:none;cursor:pointer;flex:none;}
.k1-avatar:hover{filter:brightness(1.06);}
.k1-avatar-menu{position:absolute;top:38px;right:0;min-width:230px;background:#fff;border:1px solid var(--k1-line);border-radius:12px;box-shadow:0 12px 40px -12px rgba(20,22,20,.34);padding:8px;z-index:60;display:none;flex-direction:column;gap:2px;}
.k1-avatar-menu.open{display:flex;}
.k1-avatar-id{padding:8px 10px 10px;border-bottom:1px solid var(--k1-line-soft);margin-bottom:6px;}
.k1-avatar-id .nm{font-size:13px;font-weight:700;color:var(--k1-ink);}
.k1-avatar-id .rl{font-size:11.5px;color:var(--k1-ink-2);margin-top:2px;}
.k1-menu-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;font-size:12.5px;color:var(--k1-ink);background:transparent;border:none;width:100%;text-align:left;cursor:pointer;font-family:var(--k1-display);}
.k1-menu-item:hover{background:var(--k1-panel-2);}
.k1-menu-item.danger{color:var(--k1-crit);}
.k1-menu-label{font-family:var(--k1-mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--k1-ink-3);padding:8px 10px 3px;}
.k1-menu-select{width:100%;margin:2px 0 4px;padding:6px 8px;border:1px solid var(--k1-line);border-radius:8px;font-size:12px;font-family:var(--k1-display);color:var(--k1-ink);background:#fff;}
.k1-subnav{display:flex;gap:14px;padding:0 24px;border-top:1px solid var(--k1-line-soft);overflow-x:auto;scrollbar-width:none;}
.k1-subnav::-webkit-scrollbar{display:none;}
.k1-subnav .k1-tab{color:var(--k1-ink-3);padding:9px 2px;font-size:12.5px;background:transparent;border:none;border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap;font-family:var(--k1-display);transition:color .12s;}
.k1-subnav .k1-tab:hover{color:var(--k1-ink-2);}
.k1-subnav .k1-tab.on{color:var(--k1-ink);border-bottom-color:var(--k1-teal);font-weight:600;}
/* QMS module horizontal sub-nav — replaces the legacy vertical .qms-nav dark rail (K1 finalization) */
.qms-subnav{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:flex-start;margin:2px 0 18px;padding-bottom:14px;border-bottom:1px solid var(--k1-line-soft);}
.qms-subnav-group{display:flex;flex-direction:column;gap:6px;}
.qms-subnav-group>.k1-sectag{padding-left:2px;}
.qms-subnav-tabs{display:flex;flex-wrap:wrap;gap:8px;}
.qms-subnav .k1-btn{display:inline-flex;align-items:center;gap:7px;}
.qms-subnav .k1-btn.coming-soon{opacity:.5;cursor:not-allowed;}
.qms-subnav .k1-railbadge{background:var(--k1-ink-3);}
.qms-subnav .k1-railbadge.ok{background:var(--k1-good);}
.qms-subnav .k1-railbadge.review{background:var(--k1-warn);color:#231a00;}
.qms-subnav .k1-railbadge.hold{background:var(--k1-crit);}
.qms-subnav .k1-railbadge.neutral{background:var(--k1-ink-3);}
.qms-section-body{margin-top:2px;}
/* k1Meter — segmented gauge/track + marker (K1 replacement for legacy .threshold-track / report bars) */
.k1-meter{position:relative;display:flex;height:8px;border-radius:999px;overflow:hidden;background:var(--k1-line-soft);margin:10px 0;}
.k1-meter-band{height:100%;}
.k1-meter-band.ok{background:var(--k1-good);}
.k1-meter-band.review{background:var(--k1-warn);}
.k1-meter-band.hold{background:var(--k1-crit);}
.k1-meter-band.muted{background:var(--k1-line);}
.k1-meter-marker{position:absolute;top:-3px;width:3px;height:14px;border-radius:2px;background:var(--k1-ink);transform:translateX(-50%);box-shadow:0 0 0 2px var(--k1-panel);}
/* k1FeedItem — tone-accented feed row (K1 replacement for legacy .event-item) */
.k1-feeditem{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--k1-line);border-left-width:3px;border-radius:10px;background:var(--k1-panel);margin:6px 0;}
.k1-feeditem.ok,.k1-feeditem.good{border-left-color:var(--k1-good);}
.k1-feeditem.caution,.k1-feeditem.review,.k1-feeditem.warn{border-left-color:var(--k1-warn);}
.k1-feeditem.action,.k1-feeditem.hold,.k1-feeditem.crit{border-left-color:var(--k1-crit);}
.k1-feeditem.neutral{border-left-color:var(--k1-line);}
.k1-feeditem-main{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;}
.k1-feeditem-main strong{font-size:13px;color:var(--k1-ink);}
.k1-feeditem-main span{font-size:12.5px;color:var(--k1-ink-2);}
.k1-feeditem-meta{font-size:11.5px;color:var(--k1-ink-3);white-space:nowrap;}
/* Scroll-fade affordance: a sticky right-edge fade so clipped tabs (Explore / Audit at ~1280px)
   are discoverable. The pseudo is a sticky flex item pinned to the right of the scrollport; its
   negative margin keeps it from adding scroll width. */
.k1-subnav::after{content:"";position:sticky;right:0;z-index:2;flex:0 0 64px;width:64px;margin-left:-64px;align-self:stretch;pointer-events:none;opacity:0;transition:opacity .15s ease;background:linear-gradient(to right, rgba(255,255,255,0) 0%, var(--k1-top, #fff) 62%, var(--k1-top, #fff) 100%);}
.k1-subnav.k1-subnav--fade::after{opacity:1;} /* only when tabs overflow and not scrolled to the end */

/* ⌘K command palette */
.k1-palette{position:fixed;inset:0;z-index:200;display:none;align-items:flex-start;justify-content:center;padding-top:12vh;background:rgba(15,17,15,.5);}
.k1-palette.open{display:flex;}
.k1-palette-box{width:min(560px,92vw);background:#fff;border:1px solid var(--k1-line);border-radius:14px;box-shadow:0 24px 70px -18px rgba(20,22,20,.5);overflow:hidden;font-family:var(--k1-display);}
.k1-palette-box input{width:100%;border:none;border-bottom:1px solid var(--k1-line);padding:15px 18px;font-size:15px;color:var(--k1-ink);font-family:var(--k1-display);outline:none;}
.k1-palette-box input::placeholder{color:var(--k1-ink-3);}
.k1-palette-list{max-height:52vh;overflow-y:auto;padding:6px;}
.k1-palette-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:9px;cursor:pointer;font-size:13px;color:var(--k1-ink);}
.k1-palette-item .pg{margin-left:auto;font-family:var(--k1-mono);font-size:10px;color:var(--k1-ink-3);letter-spacing:.05em;text-transform:uppercase;}
.k1-palette-item .pgroup{font-family:var(--k1-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--k1-ink-3);}
.k1-palette-item.sel,.k1-palette-item:hover{background:var(--k1-teal-soft);}
.k1-palette-empty{padding:20px;text-align:center;color:var(--k1-ink-3);font-size:13px;}
.k1-palette-foot{display:flex;gap:14px;padding:8px 14px;border-top:1px solid var(--k1-line-soft);font-family:var(--k1-mono);font-size:10px;color:var(--k1-ink-3);}
.k1-palette-foot b{color:var(--k1-ink-2);font-weight:700;}

/* K1 page scaffold (used by restyled module bodies) */
.k1-page{display:flex;flex-direction:column;gap:18px;padding-top:20px;}
.k1-ptitle{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;}
.k1-ptitle h2,.k1-ptitle h4{font-size:20px;font-weight:700;color:var(--k1-ink);letter-spacing:-.01em;margin:0;font-family:var(--k1-display);}
.k1-ptitle .sub{font-size:12.5px;color:var(--k1-ink-2);}
.k1-twocol{display:grid;grid-template-columns:1.55fr 1fr;gap:16px;align-items:start;}
@media(max-width:900px){.k1-twocol{grid-template-columns:1fr;}}
.k1-sectag{font-family:var(--k1-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--k1-ink-3);}

/* hide the redundant legacy hero on the restyled Command Center in k1-mode */
body.k1-mode #command > .page-head.module-hero{display:none;}

/* ===========================================================================
   K1 GLOBAL CHROME KILL — the approved K1 shell already carries the breadcrumb
   + grouped sidebar, and every module body shows a light .k1-ptitle (injected
   by ensureK1PageTitle() where a render doesn't build its own). So the legacy
   dark chrome is redundant on EVERY page in k1-mode. This ONE rule generalises
   the per-page `#page > .page-head.module-hero{display:none}` / `.directory-*`
   idioms so no dark hero band or directory scrim survives anywhere.
   =========================================================================== */
/* dark module-hero bands (scene pages) — the title is re-shown as a light k1-ptitle */
body.k1-mode .scene-page > .page-head.module-hero{display:none;}
/* dark directory chrome (K1-restyled hub pages) — head, bottom scrim, tinted overlay.
   #portal is EXCLUDED: it is the legacy full-page module directory (its own cohesive
   dark-tile design, not a K1 module page and not in the K1 redesign scope) — the K1
   Command Center supersedes it; neutralising only its backdrop would strand its dark
   tiles on a light surface. Every OTHER directory hub injects its own K1 title + tiles,
   so stripping the dark backdrop reveals a clean K1 surface. */
body.k1-mode .directory-page:not(#portal) .directory-head,
body.k1-mode .directory-page:not(#portal) .directory-scrim{display:none;}
body.k1-mode .directory-page:not(#portal) .module-directory::after{display:none;content:none;}
/* the directory shell itself becomes a bare, light passthrough surface */
body.k1-mode .directory-page:not(#portal) .module-directory{
  background:transparent;border:0;box-shadow:none;padding:0;min-height:0;
  color:var(--k1-ink);isolation:auto;overflow:visible;
}
body.k1-mode .directory-page:not(#portal) .directory-content{
  padding:0;display:block;width:100%;max-width:none;margin:0;
}
/* legacy 4-column status grid never imposes its dark grid layout on K1 content */
body.k1-mode .qa-hub-status-grid{display:block;}
/* injected light page title (ensureK1PageTitle): sits at the top of the body,
   relocated hero actions push to the right edge like a native .k1-ptitle. */
body.k1-mode .k1-hero-title{margin:0 0 16px;padding-top:4px;}
body.k1-mode .k1-hero-title > .k1-actions{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap;}

/* ===========================================================================
   K1 module restyle — Report Room · Enterprise · Setup(+Profile/Method/Equipment/
   Standards/Times) · Subscription · Manuals. Scoped to these page sections so
   out-of-scope modules are untouched. The K1 rail + top strip carry navigation,
   so the redundant legacy hero is hidden; remaining legacy form chrome on the
   form-heavy pages is nudged toward the K1 surface. Composition glue only —
   the visuals come from k1ui.js helpers.
   =========================================================================== */
body.k1-mode #reportRoom > .page-head.module-hero,
body.k1-mode #enterprise > .page-head.module-hero,
body.k1-mode #subscription > .page-head.module-hero,
body.k1-mode #profile > .page-head.module-hero,
body.k1-mode #standards > .page-head.module-hero,
body.k1-mode #timeLibrary > .page-head.module-hero,
body.k1-mode #equipment > .page-head.module-hero,
body.k1-mode #method > .page-head.module-hero,
body.k1-mode #setupHub .directory-scrim,
body.k1-mode #setupHub .directory-head,
body.k1-mode #manualsHub .directory-scrim,
body.k1-mode #manualsHub .directory-head{display:none;}

/* the directory wrapper is a bare passthrough surface in k1-mode (its scrim/head are hidden) */
body.k1-mode #setupHub .module-directory,
body.k1-mode #manualsHub .module-directory{background:transparent;border:0;box-shadow:none;padding:0;}
body.k1-mode #setupHub .directory-content,
body.k1-mode #manualsHub .directory-content{padding:0;display:block;}

/* neutralise the legacy summary/tile grids so the K1 rows/tiles inside lay out on their own */
body.k1-mode #setupSummary,
body.k1-mode #setupTiles,
body.k1-mode #manualsSummary,
body.k1-mode #manualsHubTiles,
body.k1-mode #equipmentSummary,
body.k1-mode #profileSummaryCards,
body.k1-mode #subscriptionStageCards,
body.k1-mode #subscriptionSummary,
body.k1-mode #methodPrecisionReference,
body.k1-mode #methodMonitoringBasis{display:block;margin:0;}

/* let a k1 data-table sit flush inside a k1 card (the titled-table pattern) */
body.k1-mode .k1-panel > .k1-table{border:0;border-radius:0;box-shadow:none;}
body.k1-mode .k1-panel > .k1-panelhead + .k1-table > .k1-thead{border-top:0;}
/* a short descriptive caption under a k1 card title, above its table/body */
.k1-cardintro{padding:12px 15px 2px;font-size:12px;line-height:1.5;color:var(--k1-ink-2);}
.k1-cardintro:last-child{padding-bottom:14px;}
/* an action cluster pushed to the right edge of a k1 section title row */
.k1-ptitle .k1-actions{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap;}

/* nudge the remaining legacy form panels toward the K1 surface on the form-heavy pages */
body.k1-mode :is(#profile,#equipment,#method,#subscription) .panel{
  background:var(--k1-panel);border:1px solid var(--k1-line);border-radius:12px;
  box-shadow:var(--k1-tile-shadow);
}
body.k1-mode :is(#profile,#equipment,#method,#subscription) .panel > h3,
body.k1-mode :is(#profile,#equipment,#method,#subscription) .panel-head h3{
  font-family:var(--k1-display);letter-spacing:-.01em;
}
/* a k1 data-table dropped into one of these legacy panels sits flush (no double frame) */
body.k1-mode :is(#profile,#equipment,#method,#subscription) .panel .k1-table{
  border:0;border-radius:0;box-shadow:none;background:transparent;
}
body.k1-mode #equipment .panel .table-wrap.setup-table{overflow:visible;}

/* ═══ K1 restyle — Work & Scheduling · People · Training (module agent) ═══════
   Presentational only, scoped to these module pages. Mirrors the QMS / QA-hub
   conventions: the dark hero stays, the body becomes a clean K1 surface. */

/* Hubs (Work / People / Training): neutralise the legacy dark directory into a
   light K1 surface and drop the oversized hero head (a K1 title is injected). */
body.k1-mode #workHub .module-directory,
body.k1-mode #peopleHub .module-directory,
body.k1-mode #trainingHub .module-directory{background:transparent;border:0;box-shadow:none;padding:0;min-height:0;color:var(--k1-ink);isolation:auto;}
body.k1-mode #workHub .module-directory::after,
body.k1-mode #peopleHub .module-directory::after,
body.k1-mode #trainingHub .module-directory::after,
body.k1-mode #workHub .directory-scrim,
body.k1-mode #peopleHub .directory-scrim,
body.k1-mode #trainingHub .directory-scrim{display:none;}
body.k1-mode #workHub .directory-head,
body.k1-mode #peopleHub .directory-head,
body.k1-mode #trainingHub .directory-head{display:none;}
body.k1-mode #workHub .directory-content,
body.k1-mode #peopleHub .directory-content,
body.k1-mode #trainingHub .directory-content{padding:0;display:block;width:100%;max-width:none;margin:0;}
body.k1-mode #workHubSummary,body.k1-mode #peopleHubSummary,body.k1-mode #trainingHubSummary,
body.k1-mode #workHubTiles,body.k1-mode #peopleHubTiles,body.k1-mode #trainingHubTiles{display:block;margin:0 0 16px;}

/* Lab Operations hub — same K1 neutralisation as Work/People/Training (Lab Ops module) */
body.k1-mode #labOpsHub .module-directory{background:transparent;border:0;box-shadow:none;padding:0;min-height:0;color:var(--k1-ink);isolation:auto;}
body.k1-mode #labOpsHub .module-directory::after,
body.k1-mode #labOpsHub .directory-scrim,
body.k1-mode #labOpsHub .directory-head{display:none;}
body.k1-mode #labOpsHub .directory-content{padding:0;display:block;width:100%;max-width:none;margin:0;}
body.k1-mode #labOpsSummary,body.k1-mode #labOpsTiles{display:block;margin:0 0 16px;}

/* K1 navigation tiles (hub destinations) */
.k1-navgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px;}
.k1-navtile{display:flex;flex-direction:column;gap:6px;text-align:left;background:var(--k1-panel);border:1px solid var(--k1-line);border-radius:12px;box-shadow:var(--k1-tile-shadow);padding:15px 16px;cursor:pointer;font-family:var(--k1-display);transition:border-color .12s,box-shadow .12s,transform .12s;}
.k1-navtile:hover{border-color:var(--k1-teal-mid);box-shadow:0 12px 28px -16px rgba(20,22,20,.3);transform:translateY(-1px);}
.k1-navtile:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none;}
.k1-navtile .nt-eb{font-family:var(--k1-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--k1-ink-3);}
.k1-navtile .nt-title{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;color:var(--k1-ink);letter-spacing:-.01em;}
.k1-navtile .nt-arrow{margin-left:auto;color:var(--k1-teal);font-size:16px;line-height:1;}
.k1-navtile .nt-body{font-size:12px;line-height:1.45;color:var(--k1-ink-2);}

/* Detail pages: dissolve the legacy .panel frames so K1 tiles/tables/table-wraps
   sit flush on the light surface (each .table-wrap keeps its own frame). Hero stays. */
body.k1-mode :is(#assignments,#capacity,#schedule,#testSchedule,#calendar,#training,#people,#access) .panel{background:transparent;border:0;box-shadow:none;padding:0;margin:0 0 18px;}
body.k1-mode :is(#assignments,#capacity,#schedule,#testSchedule,#calendar,#training,#people,#access) .panel-head{background:transparent;border:0;padding:0;margin:0 0 10px;}
body.k1-mode :is(#assignments,#capacity,#schedule,#testSchedule,#calendar,#training,#people,#access) .panel > h3,
body.k1-mode :is(#assignments,#capacity,#schedule,#testSchedule,#calendar,#training,#people,#access) .panel-head h3{font-family:var(--k1-display);font-size:17px;font-weight:700;color:var(--k1-ink);letter-spacing:-.01em;margin:0;}
body.k1-mode :is(#assignments,#capacity,#schedule,#testSchedule,#calendar,#training,#people,#access) .panel-head p{font-size:12px;color:var(--k1-ink-2);line-height:1.45;margin:4px 0 0;}
body.k1-mode #assignmentsSummary,body.k1-mode #capacitySummary,body.k1-mode #testScheduleSummary,
body.k1-mode #calendarSummaryCards,body.k1-mode #trainingSummary,
body.k1-mode #schedulePlanSummary,body.k1-mode #scheduleCoverageSummary{display:block;margin:0;}

/* Assignments work-queue (k1DataTable) — stacked secondary lines inside the item cell */
.k1-asn-item{display:flex;flex-direction:column;gap:3px;min-width:0;}
.k1-asn-title{font-weight:600;color:var(--k1-ink);display:flex;align-items:center;gap:7px;flex-wrap:wrap;}
.k1-asn-meta{font-family:var(--k1-mono);font-size:10.5px;color:var(--k1-ink-3);}
.k1-asn-note{font-size:11px;color:var(--k1-ink-2);line-height:1.4;}
.k1-asn-warn{font-size:11px;color:var(--k1-crit);line-height:1.4;}
.k1-asn-warn::before{content:"\26A0  ";}
.k1-asn-ok{color:var(--k1-good);}
.k1-asn-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;}
.k1-asn-sys{font-family:var(--k1-mono);font-size:9px;letter-spacing:.05em;text-transform:uppercase;color:var(--k1-teal-ink);background:var(--k1-teal-soft);border-radius:5px;padding:1px 5px;}
.k1-asn-due-over{color:var(--k1-crit);font-weight:700;}
.k1-asn-unassigned{color:var(--k1-ink-3);}
.k1-asn-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px;}
.k1-asn-toolbar .k1-spacer{margin-left:auto;}
.k1-asn-banner{margin:0 0 12px;font-size:12.5px;font-weight:600;padding:9px 13px;border-radius:9px;}
.k1-asn-banner.is-ok{background:var(--k1-good-soft);color:var(--k1-good);}
.k1-asn-banner.is-fail{background:var(--k1-warn-soft);color:var(--k1-warn);}
.k1-trow.work-card-focused{background:var(--k1-teal-soft);box-shadow:inset 0 0 0 2px var(--k1-teal);}
/* schedule notes reused inside the item cell read as compact K1 lines */
body.k1-mode .k1-asn-item .work-card-schedule-notes{margin:2px 0 0;padding:0;list-style:none;font-size:11px;color:var(--k1-ink-2);}
body.k1-mode .k1-asn-item .work-card-schedule-notes li{margin:0;}
body.k1-mode .k1-asn-item .work-note-lapse{color:var(--k1-crit);font-weight:600;}

/* responsive: collapse the rail into a slide-in drawer on narrow viewports */
@media(max-width:900px){
  body.k1-mode .shell{grid-template-columns:minmax(0,1fr);}
  body.k1-mode .k1-rail{position:fixed;top:0;left:0;bottom:0;width:250px;z-index:120;transform:translateX(-100%);transition:transform .2s ease;height:100vh;box-shadow:0 20px 60px -12px rgba(0,0,0,.5);}
  body.k1-mode.k1-rail-open .k1-rail{transform:translateX(0);}
  body.k1-mode .k1-railtoggle{display:flex;}
  body.k1-mode .k1-rail-scrim{display:none;position:fixed;inset:0;background:rgba(15,17,15,.42);z-index:110;}
  body.k1-mode.k1-rail-open .k1-rail-scrim{display:block;}
}

/* Narrow phones: the topbar breadcrumb wrapped to 2–3 lines and crowded the ⌘K
   box. Collapse the trail to just the current page (truncated) and shrink ⌘K to an
   icon-only trigger so the row stays a single clean line. Scoped to .k1-topbar so
   the in-page QA/module breadcrumb (.k1-ptitle / .module-breadcrumb) is untouched. */
@media(max-width:430px){
  /* CSS-A (B11): tighter workspace padding on very narrow screens (base 24px) */
  body.k1-mode .workspace{padding:14px;}
  .k1-topbar .k1-topbar-row{gap:8px;padding:10px 14px;}
  .k1-topbar .k1-breadcrumb{flex-wrap:nowrap;overflow:hidden;flex:1 1 auto;min-width:0;}
  .k1-topbar .k1-breadcrumb .crumb,
  .k1-topbar .k1-breadcrumb .sep{display:none;}
  .k1-topbar .k1-breadcrumb .cur{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
  .k1-topbar .k1-cmdbar{margin-left:auto;min-width:0;flex:none;padding:7px 9px;gap:0;}
  .k1-topbar .k1-cmdbar .k1-cmdlabel,
  .k1-topbar .k1-cmdbar .k1-k{display:none;}
}

/* legacy (not-yet-migrated) pages: breathe below the sticky K1 top strip */
body.k1-mode .workspace > .page.active{padding-top:18px;}

/* Command Center K1 proof — attention / health rows + priorities list */
.k1-cc-col{display:flex;flex-direction:column;gap:16px;min-width:0;}
.k1-attn-list,.k1-health-list{display:flex;flex-direction:column;}
.k1-attn-row,.k1-health-row{display:flex;align-items:center;gap:10px;width:100%;padding:10px 14px;border:none;border-top:1px solid var(--k1-line-soft);background:transparent;cursor:pointer;text-align:left;font-family:var(--k1-display);font-size:12.5px;color:var(--k1-ink);transition:background .12s;}
.k1-attn-row:first-child,.k1-health-row:first-child{border-top:none;}
.k1-attn-row:hover,.k1-health-row:hover{background:var(--k1-panel-2);}
.k1-attn-row .pin{width:8px;height:8px;border-radius:50%;flex:none;}
.k1-attn-row .pin.crit{background:var(--k1-crit);} .k1-attn-row .pin.warn{background:var(--k1-warn);} .k1-attn-row .pin.teal{background:var(--k1-teal);} .k1-attn-row .pin.good{background:var(--k1-good);}
.k1-attn-row .atxt{flex:1;font-weight:600;}
.k1-attn-row .anum{font-family:var(--k1-mono);font-weight:700;color:var(--k1-ink);}
.k1-health-row .hlabel{flex:1;font-weight:600;}
.k1-priolist{display:flex;flex-direction:column;gap:10px;}

/* ── QA Program hub · K1 light restyle (Phase-1 module) ───────────────────── */
.qa-hub-k1 .k1-ptitle .sub{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;}
.qa-hub-k1 .k1-ptitle .breadcrumb-link{background:transparent;border:none;color:var(--k1-teal-ink);cursor:pointer;font:inherit;padding:0;}
.qa-hub-k1 .k1-ptitle .breadcrumb-link:hover{text-decoration:underline;}
.qa-hub-k1 .k1-ptitle .breadcrumb-sep{color:var(--k1-ink-3);}
.qa-hub-k1-back{margin-left:auto;}
.qa-hub-cols{align-items:start;}
/* command band */
.qa-hub-command{gap:14px;}
.qa-hub-cmdhead{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;}
.qa-hub-cmdcopy{display:flex;flex-direction:column;gap:4px;min-width:0;}
.qa-hub-cmdtitle{font-size:17px;font-weight:700;color:var(--k1-ink);letter-spacing:-.01em;}
.qa-hub-cmddetail{margin:0;color:var(--k1-ink-2);font-size:13px;line-height:1.4;}
.qa-hub-kpis{margin-top:2px;}
/* consent card */
.qa-hub-consent{border-color:var(--k1-crit);}
.qa-hub-consent-detail{margin:0 0 10px;color:var(--k1-ink-2);font-size:13px;line-height:1.45;}
.qa-hub-consent-chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px;}
.qa-hub-consent-actions{display:flex;gap:8px;flex-wrap:wrap;}
.qa-hub-consent-foot{margin:10px 0 0;color:var(--k1-ink-3);font-size:11.5px;font-family:var(--k1-mono);}
/* action card rows */
.qa-hub-surface-sub{margin:0 0 12px;color:var(--k1-ink-2);font-size:13px;}
.qa-hub-actions{display:grid;gap:10px;}
.qa-hub-k1 .qa-hub-action-item{grid-template-columns:minmax(0,1fr) auto;background:var(--k1-panel-2);border:1px solid var(--k1-line);border-radius:10px;box-shadow:none;}
.qa-hub-k1 .qa-hub-action-item.review{border-color:var(--k1-warn);}
.qa-hub-k1 .qa-hub-action-item.hold{border-color:var(--k1-crit);}
.qa-hub-k1 .qa-hub-action-top strong{color:var(--k1-ink);font-size:15px;}
.qa-hub-k1 .qa-hub-action-main p{color:var(--k1-ink);font-size:13px;}
.qa-hub-k1 .qa-hub-action-main small,.qa-hub-k1 .qa-hub-action-side span,.qa-hub-k1 .qa-hub-empty-state p,.qa-hub-k1 .qa-hub-overflow-note{color:var(--k1-ink-2);font-size:12px;}
.qa-hub-k1 .qa-hub-action-facts dt{color:var(--k1-teal-ink);}
.qa-hub-k1 .qa-hub-action-facts dd{color:var(--k1-ink-2);}
.qa-hub-k1 .qa-hub-empty-state{border-color:var(--k1-teal-mid);background:var(--k1-teal-soft);}
.qa-hub-k1 .qa-hub-empty-state strong{color:var(--k1-ink);font-size:14px;}
.qa-hub-k1 .dashboard-asset-details summary{color:var(--k1-teal-ink);}
.qa-hub-k1 .dashboard-asset-details span,.qa-hub-k1 .dashboard-action-asset-note{color:var(--k1-ink-2);border-color:var(--k1-line);background:var(--k1-panel);}
/* method table */
.qa-hub-methodhead{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:2px;}
.qa-hub-methodtitle{display:block;font-size:14px;font-weight:700;color:var(--k1-ink);margin-top:3px;}
.qa-hub-surface-meta{color:var(--k1-ink-3);font-size:11.5px;font-family:var(--k1-mono);text-align:right;line-height:1.4;}
.qa-hub-method-note{color:var(--k1-ink-2);}
.qa-hub-methodtable-live .k1-trow[data-test]{cursor:pointer;}
/* nav rail */
.qa-hub-k1 .qa-hub-nav{position:sticky;top:16px;padding:14px 12px;border:1px solid var(--k1-line);border-radius:14px;background:var(--k1-panel);box-shadow:var(--k1-tile-shadow);}
.qa-hub-k1 .qa-hub-nav-group + .qa-hub-nav-group{border-top-color:var(--k1-line-soft);}
.qa-hub-k1 .qa-hub-nav-label{color:var(--k1-ink-2);}
.qa-hub-k1 .qa-hub-nav-detail{color:var(--k1-ink-3);}
.qa-hub-k1 .qa-hub-nav-button{border:1px solid var(--k1-line);background:var(--k1-panel);color:var(--k1-ink);}
.qa-hub-k1 .qa-hub-nav-button:hover,.qa-hub-k1 .qa-hub-nav-button:focus-visible{background:var(--k1-teal-soft);border-color:var(--k1-teal);color:var(--k1-ink);box-shadow:none;}
.qa-hub-k1 .qa-hub-nav-copy strong{color:var(--k1-ink);}
.qa-hub-k1 .qa-hub-nav-copy small{color:var(--k1-ink-3);}
.qa-hub-k1 .qa-hub-nav-icon{border-color:var(--k1-line);background:var(--k1-teal-soft);color:var(--k1-teal-ink);}
.qa-hub-k1 .qa-hub-nav-signal{color:var(--k1-ink-2);}
.qa-hub-k1 .qa-hub-nav-signal.ok{color:var(--k1-good);}
.qa-hub-k1 .qa-hub-nav-signal.review{color:var(--k1-warn);}
.qa-hub-k1 .qa-hub-nav-signal.hold{color:var(--k1-crit);}

/* ── QA subpages · shared K1 header + table helpers (Phase-1 module) ───────── */
.k1-ptitle-actions{margin-left:auto;}
.k1-page .k1-ptitle .sub{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;}
.k1-page .k1-ptitle .breadcrumb-link{background:transparent;border:none;color:var(--k1-teal-ink);cursor:pointer;font:inherit;padding:0;}
.k1-page .k1-ptitle .breadcrumb-link:hover{text-decoration:underline;}
.k1-page .k1-ptitle .breadcrumb-sep{color:var(--k1-ink-3);}
.qa-sub-head{display:flex;flex-direction:column;gap:2px;margin-top:4px;}
.qa-sub-detail{margin:0;color:var(--k1-ink-2);font-size:12.5px;line-height:1.4;}
/* summary tiles that double as filter buttons */
.qa-tilebtn{all:unset;cursor:pointer;display:block;min-width:0;}
.qa-tilebtn .k1-tile{height:100%;}
.qa-tilebtn.active .k1-tile{box-shadow:0 0 0 1.5px var(--k1-teal),var(--k1-tile-shadow);}
.qa-tilebtn:focus-visible .k1-tile{box-shadow:0 0 0 2px var(--k1-teal);}
.qa-tilebtn .k1-tile .k1-delta{white-space:normal;line-height:1.35;}
/* worklist / data-table cell helpers */
.qa-td-sub{display:block;color:var(--k1-ink-3);font-family:var(--k1-mono);font-size:10.5px;line-height:1.35;margin-top:2px;}
.qa-signal-lead{display:block;color:var(--k1-ink);font-weight:600;font-size:12px;}
.qa-td-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap;}
.qa-worklist .k1-trow{align-items:start;}
.release-focus-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;margin-bottom:10px;border:1px solid var(--k1-teal-mid);background:var(--k1-teal-soft);border-radius:10px;font-size:12.5px;color:var(--k1-ink);}
.release-focus-bar strong{font-weight:700;}
.release-focus-bar span{color:var(--k1-ink-2);}
.release-focus-bar button{margin-left:auto;}
/* empty-state on light QA subpages */
.qa-k1 .qa-hub-empty-state{border:1px solid var(--k1-teal-mid);background:var(--k1-teal-soft);border-radius:10px;padding:16px 18px;}
.qa-k1 .qa-hub-empty-state strong{color:var(--k1-ink);font-size:14px;display:block;}
.qa-k1 .qa-hub-empty-state p{color:var(--k1-ink-2);font-size:12.5px;line-height:1.45;margin-top:4px;}
/* tasks: k1 panels keep their own head; drop legacy dark panel chrome */
.qa-k1 .tasks-panel.k1-panel{padding:0;}
.qa-k1 .tasks-panel .qa-task-list{padding:14px;display:grid;gap:10px;}
.qa-k1 .run-controls-panel.k1-panel{padding:14px 16px;}
/* detail/run toolbar controls inside the k1 page title */
.qa-detail-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.qa-detail-tools .search{font-size:12px;color:var(--k1-ink-2);display:inline-flex;align-items:center;gap:6px;margin:0;}
.qa-detail-tools .search select,.qa-detail-tools .search input{border:1px solid var(--k1-line);border-radius:8px;padding:5px 9px;font-size:12px;font-family:var(--k1-display);color:var(--k1-ink);background:#fff;}
.qa-detail-tools .search select:focus,.qa-detail-tools .search input:focus{outline:none;border-color:var(--k1-teal);}
/* KPIs dashboard: lay the k1 stat tiles in a responsive grid */
.qa-k1 .kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;}

/* ===========================================================================
   K1 DIALOG CHROME  —  every <dialog> shares the .login-card wrapper (28 also
   .wide-dialog), so restyling that one surface + its form controls brings all
   39 dialogs onto the K1 visual language in a single leverage move.

   UNCONDITIONAL by design (targets `dialog` / `.login-card` directly, NOT
   `body.k1-mode`): the pre-auth dialogs (login, evaluation terms, two-factor,
   walk-in, pricing, account/method/demo request, set-password) render while the
   body is still `signed-out`, so K1-mode scoping would miss them. `.login-card`
   is used ONLY by dialogs, so this is safe and reaches page 0.

   Placed at end of file → wins cascade ties against the legacy dialog rules
   (~7617) and the legacy `.login-card input/label` rules (~2186/~7887). It does
   NOT set width/geometry on `.login-card`, so the per-dialog width overrides
   (.wide-dialog, .pricing-dialog, #capaDialog, .access-detail-dialog,
   .terms-card, .onboarding-wizard) all still apply.
   =========================================================================== */

/* — surface + backdrop — K1 white/ink card floating over an asphalt-tinted scrim */
dialog{
  background:var(--k1-panel);
  border:1px solid var(--k1-line);
  border-radius:16px;
  box-shadow:var(--k1-app-shadow);
  color:var(--k1-ink);
  padding:0;
}
dialog::backdrop{
  background:rgba(19,18,17,.52);
}
/* — background scroll-lock while ANY modal is open — a <dialog>/k1Confirm/
   k1Prompt is position:fixed, so without this the wheel scrolls the page
   BEHIND it (and the fixed modal can paint out of view → blank screen). The
   class is toggled centrally by the showModal() hook in k1ui.js; html has no
   overflow set, so body's overflow propagates to the viewport and locks it. */
body.modal-open{overflow:hidden;}

/* — the inner form card — K1 display type + ink, geometry left to the base rule — */
.login-card{
  font-family:var(--k1-display);
  color:var(--k1-ink);
}
.login-card h2,
.login-card h3{
  font-family:var(--k1-display);
  color:var(--k1-ink);
  letter-spacing:-.01em;
  font-weight:700;
}
.login-card h2{font-size:20px;line-height:1.2;}
.login-card h3{font-size:16px;}
/* eyebrow → K1 mono section tag (was legacy uppercase blue) */
.login-card .eyebrow{
  font-family:var(--k1-mono);
  font-size:10px;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--k1-teal-ink);
  margin:0 0 2px;
}
.login-card p.muted,
.login-card .muted{
  color:var(--k1-ink-2);
  font-size:13px;
  line-height:1.5;
}

/* — labels + fields — K1 inputs (border/radius/teal focus-ring) — */
.login-card label{
  display:grid;
  gap:6px;
  font-family:var(--k1-display);
  font-size:12px;
  font-weight:600;
  color:var(--k1-ink-2);
}
.login-card input,
.login-card select,
.login-card textarea{
  width:100%;
  min-height:40px;
  border:1px solid var(--k1-line);
  border-radius:9px;
  background:#fff;
  color:var(--k1-ink);
  padding:9px 11px;
  font-family:var(--k1-display);
  font-weight:400;
  transition:border-color .15s ease,box-shadow .15s ease;
}
.login-card textarea{min-height:84px;resize:vertical;}
.login-card input:focus,
.login-card input:focus-visible,
.login-card select:focus,
.login-card select:focus-visible,
.login-card textarea:focus,
.login-card textarea:focus-visible{
  outline:none;
  border-color:var(--k1-teal);
  box-shadow:0 0 0 3px var(--k1-teal-soft);
}
.login-card input::placeholder,
.login-card textarea::placeholder{color:var(--k1-ink-3);}
.login-card input:disabled,
.login-card select:disabled,
.login-card textarea:disabled{
  background:var(--k1-panel-2);
  color:var(--k1-ink-3);
  cursor:not-allowed;
}

/* — inline error strip retinted to the K1 critical palette — */
.login-card .login-error{
  border:1px solid var(--k1-crit);
  border-radius:9px;
  background:var(--k1-crit-soft);
  color:var(--k1-crit);
}

/* — buttons — teal primary + neutral ghost secondary (unconditional) — */
/* primary: any unclassed action button in a dialog (Save/Submit/Confirm/Enter…) */
.login-card button:not(.secondary):not(.manual-deeplink):not(.linklike):not(.mini-button){
  min-height:40px;
  border:1px solid transparent;
  border-radius:9px;
  background:var(--k1-teal);
  color:var(--k1-on-teal);
  padding:9px 16px;
  font-family:var(--k1-display);
  font-weight:600;
  font-size:13.5px;
}
.login-card button:not(.secondary):not(.manual-deeplink):not(.linklike):not(.mini-button):hover{
  filter:brightness(1.06);
}
/* ghost secondary: neutral (overrides the legacy gold .secondary hover) */
.login-card .secondary{
  min-height:40px;
  border:1px solid var(--k1-line);
  border-radius:9px;
  background:transparent;
  color:var(--k1-ink-2);
  padding:9px 16px;
  font-family:var(--k1-display);
  font-weight:600;
  font-size:13.5px;
}
.login-card .secondary:hover,
.login-card .secondary:focus-visible{
  background:var(--k1-panel-2);
  border-color:var(--k1-ink-3);
  color:var(--k1-ink);
  box-shadow:none;
  outline:none;
}
.login-card button:disabled{opacity:.5;cursor:not-allowed;filter:none;}
/* link-like button (Forgot password?) reads as a teal text link, not a CTA */
.login-card .manual-deeplink{color:var(--k1-teal-ink);}
/* In-app legacy .secondary buttons — shell nav, page toolbars ("Back"), setup actions —
   were never K1'd and rendered warm-tan legacy (border #b8b09f, Inter). Dialogs are already
   handled by `.login-card .secondary`; the signed-out landing keeps its own design (not
   k1-mode). Recolor-only (no sizing) so each context keeps its own padding/min-height while
   losing the legacy palette. Specificity (0,2,2) beats the base `button.secondary` (0,1,1). */
body.k1-mode button.secondary{
  border:1px solid var(--k1-line);
  border-radius:8px;
  background:transparent;
  color:var(--k1-ink-2);
  font-family:var(--k1-display);
  font-weight:600;
}
body.k1-mode button.secondary:hover,
body.k1-mode button.secondary:focus-visible{
  background:var(--k1-panel-2);
  border-color:var(--k1-ink-3);
  color:var(--k1-ink);
  box-shadow:none; /* kill the legacy amber glow the base button.secondary:hover sets */
}
/* keep a visible focus indicator (the base rule set outline:none) — a K1 teal ring */
body.k1-mode button.secondary:focus-visible{
  box-shadow:0 0 0 3px color-mix(in srgb,var(--k1-teal) 30%,transparent);
  outline:none;
}

/* — <menu> footer — right-aligned K1 action row with a hairline separator — */
.login-card menu{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  align-items:center;
  flex-wrap:wrap;
  margin:6px 0 0;
  padding:14px 0 0;
  border-top:1px solid var(--k1-line-soft);
}

/* — grouped secondary form section inside a dialog — a FLAT warm K1 panel that
   replaces the legacy .module-card (which floats a bordered + cool-grey drop-
   shadowed "card inside the card"). Uses the recessed --k1-panel-2 surface + a
   hairline --k1-line border, NO shadow, so a secondary form-grid + its list /
   record button read as a light grouped block, not a second floating card. — */
.login-card .dialog-section{
  margin-top:16px;
  padding:14px 16px;
  background:var(--k1-panel-2);
  border:1px solid var(--k1-line);
  border-radius:12px;
}
.login-card .dialog-section > h3{margin:0 0 10px;}

/* ===========================================================================
   K1 TRANSIENTS  —  #demoToast + #uiTooltip base styles are inline in
   index.html (dark #1a1f24 / Arial). Retint to the K1 asphalt/ink look from
   here with higher-specificity selectors (#demoToast beats .demo-toast;
   `body #uiTooltip` beats #uiTooltip). Only colour/type/frame is overridden —
   position / transform / transition / opacity stay with the inline base.
   =========================================================================== */
#demoToast{
  background:var(--k1-rail);
  color:var(--k1-rail-ink);
  border:1px solid var(--k1-rail-hair);
  border-radius:11px;
  box-shadow:var(--k1-app-shadow);
  font-family:var(--k1-display);
  font-weight:600;
}
body #uiTooltip{
  background:var(--k1-rail);
  color:var(--k1-rail-ink);
  border:1px solid var(--k1-rail-hair);
  border-radius:8px;
  box-shadow:var(--k1-app-shadow);
  font-family:var(--k1-display);
}

/* chunk D: CAPA workflow — k1Button danger (destructive transitions) + disabled state */
.k1-btn.danger{background:transparent;color:var(--k1-crit);border-color:var(--k1-crit);}
.k1-btn.danger:hover{background:var(--k1-crit-soft);filter:none;}
.k1-btn[disabled],.k1-btn:disabled{opacity:.5;cursor:not-allowed;}
.k1-btn[disabled]:hover,.k1-btn:disabled:hover{filter:none;}
/* chunk K (Reports): K1 disclosure <details> inside a k1Card (replaces legacy .report-disclosures) */
.report-disclosures-k1{display:grid;gap:10px;}
.report-disclosures-k1 details{border:1px solid var(--k1-line);border-radius:10px;background:var(--k1-panel);padding:12px 14px;}
.report-disclosures-k1 summary{cursor:pointer;color:var(--k1-ink);font-size:13.5px;font-weight:600;list-style:none;}
.report-disclosures-k1 summary::-webkit-details-marker{display:none;}
.report-disclosures-k1 p{margin:10px 0 0;color:var(--k1-ink-2);font-size:13px;line-height:1.46;}
/* chunk F: Test Detail + Continuous Improvement + Ranking — K1 restyle helpers */
/* Gate cards (resultThresholdCard etc.) now render as k1Card; this styles the padded body. */
.k1-gate{display:flex;flex-direction:column;gap:8px;}
.k1-gate .gv{font-size:22px;line-height:1.05;font-weight:700;color:var(--k1-ink);letter-spacing:-.01em;}
.k1-gate .k1-meter{margin:6px 0 4px;}
.k1-gate-legend{display:grid;gap:4px;min-height:34px;}
.k1-gate-legend span{color:var(--k1-ink-2);font-size:12px;font-weight:560;line-height:1.35;}
.k1-gate-note{margin:2px 0 0;color:var(--k1-ink-2);font-size:12.5px;line-height:1.42;}
.k1-gate-panel.tone-ok{border-top:2px solid var(--k1-good);}
.k1-gate-panel.tone-review{border-top:2px solid var(--k1-warn);}
.k1-gate-panel.tone-hold{border-top:2px solid var(--k1-crit);}
.k1-gate-panel.tone-muted{border-top:2px solid var(--k1-line);}

/* Verdict hero (detailOverviewHtml) */
.k1-detailhero{display:flex;flex-direction:column;gap:14px;border:1px solid var(--k1-line);border-radius:12px;background:var(--k1-panel);box-shadow:var(--k1-tile-shadow);padding:16px 16px 4px;border-left-width:3px;}
.k1-detailhero.tone-ok{border-left-color:var(--k1-good);}
.k1-detailhero.tone-review{border-left-color:var(--k1-warn);}
.k1-detailhero.tone-hold{border-left-color:var(--k1-crit);}
.k1-detailhero-head{display:flex;flex-direction:column;gap:6px;}
.k1-detailhero-verdict{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.k1-detailhero-verdict strong{font-size:18px;font-weight:700;color:var(--k1-ink);letter-spacing:-.01em;}
.k1-detailhero-head p{margin:0;color:var(--k1-ink-2);font-size:13px;line-height:1.45;}
.k1-detailhero-facts{margin-bottom:12px;}
/* Fact tiles hold prose, not big numerals — shrink the value type so it reads cleanly. */
.k1-detailhero-facts .k1-tile .val{font-size:13.5px;font-weight:600;line-height:1.3;}
.k1-factval{display:block;}

/* Multi-line normality feed row */
.k1-feedline{display:block;margin-top:3px;}
.k1-feedline:first-child{margin-top:0;}

/* Sub text inside k1DataTable cells (asset comparison reason line) */
.k1-td-sub{display:block;color:var(--k1-ink-3);font-family:var(--k1-mono);font-size:10.5px;margin-top:2px;}

/* Panel heads that carry a title + sub-note stack vertically (Test Detail / CI panels) */
.detail-primary-head,.comparison-queue-head-panel,.comparison-dossier-head-panel{flex-direction:column;align-items:flex-start;gap:3px;}
.detail-primary-head .detail-panel-copy,.comparison-queue-head-panel .detail-panel-copy,.comparison-dossier-head-panel .detail-panel-copy{margin:0;}

/* chunk I: Testing Schedule + Training — page-body k1 restyle helpers */
/* Inline labelled control (schedule horizon) replacing legacy .form-grid.schedule-inline-controls */
.k1-inline-controls{display:flex;flex-wrap:wrap;gap:14px;margin:0 0 12px;}
.k1-inline-controls label{display:flex;flex-direction:column;gap:5px;font-size:11px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--k1-ink-3);}
.k1-inline-controls input{padding:8px 11px;border:1px solid var(--k1-line);border-radius:8px;font-size:13.5px;font-family:inherit;color:var(--k1-ink);background:#fff;max-width:170px;}
/* Operator picker inside the k1 rota table cell */
.schedule-rota-table .schedule-operator{width:100%;min-width:120px;padding:6px 8px;border:1px solid var(--k1-line);border-radius:7px;font-size:12.5px;font-family:inherit;color:var(--k1-ink);background:#fff;}
/* Stacked cell content (replaces legacy .dashboard-cell-stack) */
.k1-cellstack{display:grid;gap:4px;}
.k1-cellstack strong{color:var(--k1-ink);font-size:13px;font-weight:700;}
.k1-cellstack small{color:var(--k1-ink-2);font-size:11.5px;line-height:1.4;}
/* In-cell action button cluster (replaces legacy .dashboard-action-group / admin action clusters) */
.k1-cellactions{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px;align-items:center;}
/* chunk J: CAPA feed-item action button spacing (k1FeedItem bodyHtml) */
.k1-feeditem-main .capa-feed-actions{display:inline-block;margin-top:6px;}
/* chunk C: Admin Console — toolbars & note text (renderAdmin* K1 restyle) */
.k1-toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 14px;}
.k1-toolbar-field{display:flex;align-items:center;gap:8px;font-family:var(--k1-display);font-size:12.5px;color:var(--k1-ink-2);}
.k1-toolbar-note{margin:0;font-family:var(--k1-display);font-size:12.5px;line-height:1.5;color:var(--k1-ink-2);}
/* chunk A: Work & Scheduling (Capacity Board + Complete Test Schedule) K1 restyle.
   The capacity grid keeps its dense table layout inside k1Card panels; the legend
   uses k1Chip bands and the backlog rows use k1FeedItem + k1Button. Only the two
   small helper classes below are new; everything else reuses the k1ui kit. */
.cap-legend-note { color: var(--k1-ink-3); font-size: 12px; line-height: 1.45; }
.cap-backlog-actions { display: inline-flex; gap: 6px; margin-left: 8px; vertical-align: middle; }
/* chunk L: Audit Trail records + QA Program Manual restyle (k1) */
.audit-controls-panel { padding: 14px; }
.audit-table-panel { padding: 0; }
details.k1-auditrec { border: 1px solid var(--k1-line); border-radius: 12px; background: var(--k1-panel); box-shadow: var(--k1-tile-shadow); overflow: hidden; }
details.k1-auditrec > summary { list-style: none; cursor: pointer; }
details.k1-auditrec > summary::-webkit-details-marker { display: none; }
/* The feed item is the visible collapsed row; the details wrapper owns the card frame,
   so strip the item's own box but keep its left tone accent. */
details.k1-auditrec > summary > .k1-feeditem { margin: 0; border-top: 0; border-right: 0; border-bottom: 0; border-radius: 0; background: transparent; border-left-width: 4px; }
details.k1-auditrec[open] > summary > .k1-feeditem { border-bottom: 1px solid var(--k1-line); }
.k1-auditrec-body { padding: 12px; }
/* Manual k1 tables sit inside prose; give them a little breathing room. */
.manual-section .manual-k1-table { margin: 6px 0 4px; }
/* chunk H: People (Operational Readiness) · Access (User Setup) · Lab Calendar · QA Testing Setup
   — presentational-only glue so the k1 kit sits flush in these restyled page bodies. */
/* k1 data-tables dropped into a k1 panel on these pages sit flush (no double frame) */
body.k1-mode :is(#people,#access,#calendar,#scheduleSetup) .k1-panel .k1-table{
  border:0;border-radius:0;box-shadow:none;background:transparent;
}
/* keep the legacy availability form readable inside the padded k1 panel */
body.k1-mode #calendar #calendarEntryForm .toolbar.inline-toolbar{margin-top:12px;}
/* QA proficiency-sample panel body copy + the k1Meter progress cell */
body.k1-mode #scheduleSetup .qa-sample-intro{margin:0 0 12px;font-size:12.5px;line-height:1.5;color:var(--k1-ink-2);}
body.k1-mode #scheduleSetup .qa-sample-body .qa-sample-actions{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap;}
body.k1-mode #scheduleSetup .qa-sample-mig-progress{display:flex;align-items:center;gap:8px;}
body.k1-mode #scheduleSetup .qa-sample-mig-progress .k1-meter{flex:1;min-width:80px;}
body.k1-mode #scheduleSetup .qa-sample-mig-progress span{font-family:var(--k1-mono);font-size:11px;color:var(--k1-ink-2);white-space:nowrap;}

/* ===========================================================================
   CSS-B (B11): keyboard focus-visible pass — teal focus affordances matching the
   existing .k1-chart-methodpick:focus-visible convention (~9663). Makes keyboard
   focus visible on the interactive K1 surfaces that previously had none.
   =========================================================================== */
.k1-item:focus-visible{outline:2px solid var(--k1-active-bar);outline-offset:-2px;}
.k1-btn:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--k1-teal) 30%,transparent);}
.k1-breadcrumb .crumb:focus-visible,
.k1-subnav .k1-tab:focus-visible,
.k1-attn-row:focus-visible,
.k1-health-row:focus-visible,
.k1-railtoggle:focus-visible,
.k1-rail-brand:focus-visible,
.k1-trow[data-page]:focus-visible{outline:none;border-color:var(--k1-teal);box-shadow:0 0 0 3px color-mix(in srgb,var(--k1-teal) 22%,transparent);}

/* ===========================================================================
   Chunk L / B-FIELDS (B11): on-page .form-grid fields onto the K1 visual language.
   Base .form-grid fields (~2195) use legacy --line-strong/--muted tokens with no
   k1-mode override; dialogs already get K1 fields via the .login-card rules
   (~10234-10267). This mirrors those exact border/radius/teal-focus values, scoped
   to on-PAGE grids. body.k1-mode prefix = specificity (0,3,1), which beats the
   legacy base .form-grid input rule and the .run-filter-grid/.audit-filter-grid
   label rules. Does NOT touch the .form-grid label{display:grid} layout rule; only
   adds the label[hidden]{display:none} guard so [hidden] wins over display:grid.
   =========================================================================== */
body.k1-mode .form-grid label { color: var(--k1-ink-2); font-size: 13px; font-weight: 600; }
body.k1-mode .form-grid input,
body.k1-mode .form-grid select,
body.k1-mode .form-grid textarea {
  border: 1px solid var(--k1-line); border-radius: 9px;
  background: #fff; color: var(--k1-ink);
}
body.k1-mode .form-grid input:focus,
body.k1-mode .form-grid select:focus,
body.k1-mode .form-grid textarea:focus {
  outline: none; border-color: var(--k1-teal);
  box-shadow: 0 0 0 3px var(--k1-teal-soft);
}
body.k1-mode .form-grid label[hidden] { display: none; }  /* guard: .form-grid label{display:grid} otherwise defeats [hidden] */

/* ===========================================================================
   K1 SELECTOR STANDARDIZATION — every in-app <select> gets the same K1 look
   (appearance:none + custom caret) so no native OS dropdown chrome leaks.
   Excludes .k1-chart-methodpick (its own bespoke shaded pill). Specific classes
   may still set width/margin — those survive; this owns the visual language.
   =========================================================================== */
body.k1-mode select:not(.k1-chart-methodpick){
  font-family:var(--k1-display);font-size:13px;line-height:1.3;color:var(--k1-ink);cursor:pointer;
  /* !important: a design-system reset that must beat scattered legacy ID-scoped field rules
     (#subscriptionCatalog select, #methodSetupDetails select, .setup-table select, …). */
  -webkit-appearance:none!important;appearance:none!important;
  border:1px solid var(--k1-line)!important;border-radius:8px!important;
  background-color:#fff!important;padding:7px 30px 7px 11px!important;
  background-image:linear-gradient(45deg,transparent 50%,var(--k1-ink-3) 50%),linear-gradient(135deg,var(--k1-ink-3) 50%,transparent 50%)!important;
  background-position:calc(100% - 15px) 55%,calc(100% - 10px) 55%!important;background-size:5px 5px,5px 5px!important;background-repeat:no-repeat!important;
  transition:border-color .12s,box-shadow .12s;
}
body.k1-mode select:not(.k1-chart-methodpick):hover{border-color:var(--k1-ink-3)!important;}
body.k1-mode select:not(.k1-chart-methodpick):focus,
body.k1-mode select:not(.k1-chart-methodpick):focus-visible{outline:none;border-color:var(--k1-teal)!important;box-shadow:0 0 0 3px var(--k1-teal-soft);}
body.k1-mode select:not(.k1-chart-methodpick):disabled{opacity:.55;cursor:not-allowed;background-color:var(--k1-panel-2)!important;}
/* number inputs (Tests/instrument, Sample mL/test, …) — same K1 field treatment */
body.k1-mode input[type="number"]{font-family:var(--k1-display);font-size:13px;color:var(--k1-ink);background:#fff!important;border:1px solid var(--k1-line)!important;border-radius:8px!important;padding:7px 10px!important;}
body.k1-mode input[type="number"]:focus{outline:none;border-color:var(--k1-teal)!important;box-shadow:0 0 0 3px var(--k1-teal-soft);}