:root {
  --assessment-ink: #212121;
  --assessment-panel: #fffcf0;
  --assessment-green: #d1e8ca;
  --assessment-yellow: #ffe298;
  --assessment-pink: #fbdce9;
  --assessment-red: #f7a4a6;
  --assessment-blue: #bde7fb;
  --assessment-purple: #d8cfe7;
  --assessment-neutral: #fff2df;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
  margin: 0;
  background: #fbe9f2;
  color: var(--assessment-ink);
  font-family: Verdana, Geneva, sans-serif;
}

.skip-link {
  position: fixed;
  z-index: 100;
  top: 8px;
  left: 8px;
  padding: 10px 14px;
  border: 4px solid var(--assessment-ink);
  background: white;
  color: var(--assessment-ink);
  font-weight: 900;
  transform: translateY(-160%);
}

.skip-link:focus { transform: none; }

.assessment-admin-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px clamp(14px, 3vw, 30px);
  border-bottom: 5px solid var(--assessment-ink);
  background: var(--assessment-panel);
}

.assessment-admin-brand,
.assessment-admin-header nav {
  display: flex;
  align-items: center;
  gap: 10px;
}

.assessment-admin-brand,
.assessment-admin-header a {
  color: var(--assessment-ink);
  font-weight: 900;
  text-decoration: none;
}

.assessment-admin-header a:hover,
.assessment-admin-header a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }

.assessment-admin-badge {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 4px solid var(--assessment-ink);
  background: var(--assessment-green);
}

.assessment-admin-shell {
  display: grid;
  gap: 18px;
  width: min(1480px, 100%);
  margin: 0 auto;
  padding: clamp(16px, 3vw, 30px);
}

#workspace { display: grid; gap: 18px; }
#workspace[hidden] { display: none; }

.assessment-panel {
  display: grid;
  gap: 16px;
  min-width: 0;
  padding: clamp(16px, 2.5vw, 26px);
  border: 5px solid var(--assessment-ink);
  background: var(--assessment-panel);
}

.assessment-panel h1,
.assessment-panel h2,
.assessment-panel h3,
.assessment-panel p { margin: 0; }

.assessment-panel h1 { font-size: clamp(34px, 5vw, 62px); line-height: 0.98; max-width: 16ch; }
.assessment-panel h2 { font-size: clamp(25px, 3vw, 38px); line-height: 1.05; }
.assessment-panel h3 { font-size: 1.15rem; line-height: 1.2; }
.assessment-panel p, .assessment-panel li, .assessment-panel label, table { font-weight: 750; line-height: 1.4; }

.assessment-auth { min-height: 340px; align-content: center; justify-items: start; }
.assessment-hero { grid-template-columns: 1fr minmax(230px, 340px); align-items: stretch; background: var(--assessment-green); }
.assessment-hero > div:first-child { display: grid; gap: 12px; align-content: center; }

.assessment-eyebrow {
  width: fit-content;
  padding: 4px 7px;
  border: 3px solid var(--assessment-ink);
  background: var(--assessment-yellow);
  font-size: .76rem;
  font-weight: 900 !important;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.assessment-trust-card {
  display: grid;
  gap: 10px;
  align-content: center;
  padding: 18px;
  border: 5px solid var(--assessment-ink);
  background: var(--assessment-blue);
  font-weight: 850;
}

.assessment-trust-card strong { font-size: clamp(24px, 3vw, 38px); }

.assessment-emergency-banner {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  padding: 14px 18px;
  border: 5px solid var(--assessment-ink);
  background: var(--assessment-red);
  font-weight: 900;
}

.assessment-jump-nav {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 8px;
}

.assessment-legal-review { background: var(--assessment-yellow) !important; }
.assessment-table-wrap td:first-child { min-width: 250px; }

.assessment-jump-nav a,
.assessment-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 8px 13px;
  border: 4px solid var(--assessment-ink);
  border-radius: 0;
  background: var(--assessment-yellow);
  color: var(--assessment-ink);
  font: inherit;
  font-weight: 900;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

.assessment-jump-nav a:nth-child(2n) { background: var(--assessment-pink); }
.assessment-jump-nav a:hover,
.assessment-jump-nav a:focus-visible,
.assessment-button:hover,
.assessment-button:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.assessment-button:disabled { cursor: not-allowed; opacity: .45; text-decoration: none; }
.assessment-button-secondary { background: var(--assessment-neutral); }
.assessment-button-danger { background: var(--assessment-red); }

.assessment-heading-row,
.assessment-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.assessment-heading-row > div { display: grid; gap: 6px; }
.assessment-actions { justify-content: flex-start; }

.assessment-status {
  min-height: 1.5em;
  padding: 8px 10px;
  border-left: 5px solid var(--assessment-ink);
  background: var(--assessment-neutral);
}

.assessment-status:empty { display: none; }
.assessment-status[data-error="true"] { background: var(--assessment-red); }

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

.assessment-metric,
.assessment-mini-metric {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 12px;
  border: 4px solid var(--assessment-ink);
  background: var(--assessment-blue);
}

.assessment-metric:nth-child(2n), .assessment-mini-metric:nth-child(2n) { background: var(--assessment-yellow); }
.assessment-metric:nth-child(3n) { background: var(--assessment-pink); }
.assessment-metric strong { font-size: clamp(25px, 3vw, 42px); line-height: 1; }
.assessment-metric span, .assessment-mini-metric span { font-size: .82rem; font-weight: 900; }

.assessment-two-column {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.assessment-subpanel {
  display: grid;
  gap: 12px;
  min-width: 0;
  align-content: start;
  padding: 14px;
  border: 4px solid var(--assessment-ink);
  background: var(--assessment-neutral);
}

.assessment-subpanel:nth-child(2n) { background: #fff; }
.assessment-card-list, .assessment-calendar { display: grid; gap: 10px; }
.assessment-calendar { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.assessment-card {
  display: grid;
  gap: 7px;
  padding: 12px;
  border: 4px solid var(--assessment-ink);
  background: white;
}

.assessment-card[data-tone="warning"] { background: var(--assessment-yellow); }
.assessment-card[data-tone="danger"] { background: var(--assessment-red); }
.assessment-card[data-tone="success"] { background: var(--assessment-green); }
.assessment-card[data-tone="info"] { background: var(--assessment-blue); }
.assessment-card p { font-size: .9rem; }

.assessment-card-heading {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  align-items: start;
}

.assessment-chip,
.assessment-privacy-chip {
  display: inline-flex;
  width: fit-content;
  padding: 3px 6px;
  border: 3px solid var(--assessment-ink);
  background: var(--assessment-purple);
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.assessment-privacy-chip { background: var(--assessment-green); }
.assessment-boundary-note { padding: 10px; border: 3px solid var(--assessment-ink); background: var(--assessment-blue); font-size: .86rem; }

.assessment-table-wrap { max-width: 100%; overflow-x: auto; border: 4px solid var(--assessment-ink); background: white; }
.assessment-table-scroll-note { display: none; padding: 8px 10px; border-left: 4px solid var(--assessment-ink); background: var(--assessment-blue); font-size: .82rem; }
table { width: 100%; border-collapse: collapse; min-width: 660px; }
th, td { padding: 9px; border: 2px solid var(--assessment-ink); text-align: left; vertical-align: top; }
th { background: var(--assessment-purple); font-size: .78rem; text-transform: uppercase; }
td { font-size: .84rem; }

.assessment-mini-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.assessment-mini-metric strong { font-size: 1.6rem; }

.assessment-form-grid,
.assessment-dialog-body {
  display: grid;
  gap: 12px;
}

.assessment-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.assessment-form-grid label,
.assessment-dialog label { display: grid; gap: 6px; font-weight: 900; }
.assessment-form-grid input,
.assessment-form-grid select,
.assessment-dialog input,
.assessment-dialog select,
.assessment-dialog textarea {
  width: 100%;
  min-height: 44px;
  padding: 8px 10px;
  border: 4px solid var(--assessment-ink);
  border-radius: 0;
  background: white;
  color: var(--assessment-ink);
  font: inherit;
  font-weight: 750;
}

.assessment-dialog textarea { min-height: 110px; resize: vertical; }
.assessment-form-grid .assessment-checkbox { display: flex; align-items: center; }
.assessment-checkbox input { width: 26px; min-height: 26px; }
.assessment-full { grid-column: 1 / -1; }
.assessment-danger-zone { background: var(--assessment-red); }

.assessment-dialog {
  width: min(680px, calc(100vw - 24px));
  max-height: calc(100vh - 30px);
  padding: 0;
  border: 5px solid var(--assessment-ink);
  border-radius: 0;
  background: var(--assessment-panel);
  color: var(--assessment-ink);
}

.assessment-dialog::backdrop { background: rgb(33 33 33 / .62); }
.assessment-dialog-body { padding: clamp(16px, 3vw, 24px); overflow-y: auto; }
.assessment-dialog-body h2, .assessment-dialog-body p { margin: 0; }
.assessment-icon-button { width: 46px; height: 46px; border: 4px solid var(--assessment-ink); background: var(--assessment-red); font: 900 1.5rem/1 Verdana, sans-serif; cursor: pointer; }

@media (max-width: 1100px) {
  .assessment-jump-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .assessment-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .assessment-calendar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .assessment-admin-header { align-items: flex-start; }
  .assessment-admin-header nav { flex-direction: column; align-items: flex-end; font-size: .8rem; }
  .assessment-admin-brand > span:last-child { display: none; }
  .assessment-hero, .assessment-two-column { grid-template-columns: 1fr; }
  .assessment-jump-nav { display: flex; overflow-x: auto; padding-bottom: 4px; }
  .assessment-jump-nav a { min-width: 130px; }
  .assessment-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .assessment-calendar, .assessment-mini-metrics { grid-template-columns: 1fr; }
  .assessment-form-grid { grid-template-columns: 1fr; }
  .assessment-full { grid-column: auto; }
  .assessment-panel { border-width: 4px; }
  .assessment-table-scroll-note { display: block; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
}