/* Brand colours sampled from holstegelab.eu: forest, leaf green and orange. */
:root {
  --ink: #223b32;
  --muted: #62716b;
  --forest: #00614e;
  --leaf: #6ab650;
  --orange: #f0790c;
  --orange-ink: #a34b08;
  --orange-tint: #fff3e7;
  --forest-light: #14725d;
  --green: #00614e;
  --green-dark: #004f3f;
  --green-tint: #edf6e9;
  --canvas: #f7f9f5;
  --line: #dfe6dc;
  --white: #fff;
  --amber: #a34b08;
  --amber-tint: #fff3e7;
  --red: #ab3d3d;
  --red-tint: #fceeed;
  --radius: 10px;
  --font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Dataset discussions and the curated lab instruction index. */
.guide-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 16px; }
.guide-card { display: flex; flex-direction: column; gap: 12px; padding: 22px; color: var(--ink); }
.guide-card:hover { border-color: var(--green); background: var(--green-tint); text-decoration: none; }
.guide-card h3 { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.guide-card p { color: var(--muted); }
.guide-card > span { margin-top: auto; }
.guide-link-list { display: flex; flex-wrap: wrap; gap: 12px 24px; padding: 18px 22px; }
.guide-link-list .icon { width: 14px; height: 14px; }
.accepted-answer { border-color: var(--green); background: var(--green-tint); }
section.accepted-answer > .discussion-body, section.accepted-answer > p, section.accepted-answer > form { margin: 0 22px 20px; }
.answer-action { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 18px; }
.answer-preview { padding-top: 8px; color: var(--green-dark); overflow-wrap: anywhere; }
.query-context { margin-top: 20px; }
.responsible-list { list-style: none; padding: 0 22px; margin: 14px 0; }
.responsible-list li { display: flex; flex-direction: column; gap: 2px; padding: 8px 0; }
.notification-summary > p.small { padding: 16px 22px 0; }
.questions-filters { flex-wrap: wrap; }
.questions-filters > .search-field { flex-basis: 100%; }
.questions-filters .filter-field { flex: 1 1 170px; min-width: 0; }
.sidebar { overflow-y: auto; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; }
body { margin: 0; background: var(--canvas); color: var(--ink); font-family: var(--font); font-size: 16px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--forest); }
a { color: var(--green-dark); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
button, select { cursor: pointer; }
button { color: inherit; }
button, input, select, textarea { border-radius: 6px; }
input, select, textarea { min-width: 0; width: 100%; border: 1px solid #cbd5dd; background: #fff; color: var(--ink); }
input, select { min-height: 44px; padding: 10px 12px; }
textarea { resize: vertical; padding: 11px 13px; }
input::placeholder, textarea::placeholder { color: #788891; }
:focus-visible { outline: 3px solid #00614e; outline-offset: 3px; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline-offset: 1px; }
h1, h2, h3, p, dl, dd { margin: 0; }
h1 { font-size: 34px; line-height: 1.2; letter-spacing: -1.05px; font-weight: 680; }
h2 { font-size: 19px; line-height: 1.35; font-weight: 650; letter-spacing: -.35px; }
h3 { font-size: 16px; font-weight: 650; line-height: 1.4; }
strong { font-weight: 650; }
code, .mono { font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; font-size: 14px; }
.icon { width: 20px; height: 20px; flex-shrink: 0; vertical-align: middle; }
.muted { color: var(--muted); }
.small { font-size: 14px; }
.eyebrow { margin: 0 0 11px; color: var(--green); font-size: 11px; letter-spacing: 1.65px; font-weight: 750; }
.mini-label { font-size: 10px; letter-spacing: 1.15px; font-weight: 750; color: var(--muted); white-space: nowrap; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: -100px; left: 20px; z-index: 100; background: var(--white); padding: 12px 20px; border: 2px solid var(--green); border-radius: 5px; }
.skip-link:focus { top: 15px; }
.preserve-lines { white-space: pre-wrap; overflow-wrap: anywhere; }
.wrap-anywhere { overflow-wrap: anywhere; }
.full-width { grid-column: 1 / -1; }
.app-shell { display: grid; grid-template-columns: 242px minmax(0, 1fr); min-height: 100vh; }
.sidebar { background: var(--forest); color: #e1eee4; position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 32px 18px 0; z-index: 30; }
.brand { display: flex; align-items: center; gap: 12px; color: #fff; padding: 0 9px; font-size: 18px; font-weight: 650; letter-spacing: -.45px; line-height: 1.25; }
.brand:hover { text-decoration: none; }
.brand-name { min-width: 0; }
.brand-study { display: block; font-size: 25px; letter-spacing: -.8px; margin-top: 2px; }
.brand small { display: block; margin-top: 5px; color: #c0dccb; font-size: 8px; font-weight: 600; letter-spacing: .85px; }
.brand-mark { width: 29px; height: 35px; display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.brand-mark span { width: 6px; height: 26px; display: block; border-radius: 3px; background: var(--leaf); }
.brand-mark span:first-child { height: 15px; align-self: flex-end; margin-bottom: 4px; }
.brand-mark span:last-child { height: 18px; align-self: flex-start; margin-top: 4px; background: var(--orange); }
.nav-label { font-size: 10px; text-transform: uppercase; letter-spacing: 1.5px; color: #bed7c8; margin: 48px 15px 14px; font-weight: 650; }
.main-nav { display: grid; gap: 5px; }
.nav-link { display: flex; gap: 12px; align-items: center; color: #e1eee4; min-height: 48px; font-size: 14px; padding: 12px 14px; border-radius: 7px; }
.nav-link .icon { width: 19px; height: 19px; }
.nav-link:hover { background: #14725d; color: #fff; text-decoration: none; }
.nav-link.active { color: #fff; background: var(--forest-light); box-shadow: inset 3px 0 0 var(--orange); }
.sidebar-note { display: flex; gap: 10px; align-items: flex-start; margin: auto 12px 26px; padding-top: 40px; }
.sidebar-note .icon { width: 16px; height: 16px; color: #a7d794; margin-top: 3px; }
.sidebar-note strong { font-size: 13px; color: #edf6e9; }
.sidebar-note p { margin-top: 7px; font-size: 12px; line-height: 1.6; color: #c0dccb; }
.profile { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 10px; margin: 0 -18px; padding: 20px 22px; border-top: 1px solid #267b65; background: #005342; }
.avatar { width: 34px; height: 34px; background: #267b65; color: #edf6e9; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 14px; font-weight: 700; }
.profile strong { display: block; font-size: 13px; font-weight: 600; color: #edf6e9; overflow-wrap: anywhere; }
.profile div > span { color: #c0dccb; font-size: 12px; }
.profile form { grid-column: 2; margin-top: 2px; }
.logout-button { font-size: 12px; color: #d4e8d9; border: none; padding: 0; background: transparent; }
.logout-button:hover { color: #fff; text-decoration: underline; }
.workspace { min-width: 0; }
.topbar { background: var(--white); display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 68px; border-top: 3px solid var(--orange); border-bottom: 1px solid var(--line); padding: 0 38px; }
.topbar-start { display: flex; align-items: center; gap: 12px; }
.topbar-label { color: #85939b; font-size: 13px; }
.topbar-label strong { color: #425866; font-weight: 500; }
.topbar-separator { margin: 0 12px; color: #c8d1d6; }
.prototype-label { font-size: 9px; font-weight: 700; letter-spacing: 1.2px; color: #627883; display: inline-flex; gap: 8px; align-items: center; }
.prototype-label > span:first-child { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--leaf); }
.prototype-divider { color: #b5c3ca; }
.menu-toggle { display: none; border: 1px solid var(--line); background: #fff; padding: 8px; }
.main-content { padding: 34px 38px 0; max-width: 1640px; margin: 0 auto; outline: none; }
.page-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 25px; }
.page-heading > div:first-child { min-width: 0; }
.page-subtitle { color: var(--muted); font-size: 16px; margin-top: 12px; max-width: 790px; line-height: 1.65; }
.page-heading > .button { flex-shrink: 0; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 10px 16px; border: 1px solid transparent; border-radius: 7px; font-size: 14px; font-weight: 650; line-height: 1.4; white-space: nowrap; }
.button .icon { width: 17px; height: 17px; }
.button:hover { text-decoration: none; }
.button-primary { background: var(--green); color: #fff; border-color: var(--green); }
.button-primary:hover { background: var(--green-dark); border-color: var(--green-dark); }
.button-secondary { background: #fff; color: #354e5b; border-color: #ccd8df; }
.button-secondary:hover, .button-filter:hover { background: #eef4f5; border-color: #aabdc7; }
.button-filter { background: #fff; border-color: #cbd6dd; color: var(--ink); }
.heading-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.notice { display: flex; align-items: center; gap: 12px; border-radius: 7px; padding: 14px 17px; font-size: 14px; }
.notice p { line-height: 1.65; }
.notice strong { font-weight: 650; }
.notice-subtle { color: #45604c; background: #f0f6ec; border: 1px solid #dfe6dc; }
.notice-subtle > .icon { color: #00614e; width: 19px; height: 19px; }
.notice-tag { margin-left: auto; flex-shrink: 0; font-size: 9px; letter-spacing: 1.1px; font-weight: 650; color: #62716b; }
.notice-attention { color: #a34b08; background: var(--amber-tint); border: 1px solid #f7d6b5; margin-top: 24px; }
.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin: 24px 0 33px; }
.stat-card { background: #fff; border: 1px solid var(--line); padding: 19px 22px 18px; border-radius: var(--radius); display: flex; flex-direction: column; min-width: 0; }
.stat-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #596d79; font-size: 14px; }
.stat-top .icon { color: #8b9ba4; width: 19px; height: 19px; }
.stat-card > strong { color: var(--forest); font-size: 34px; line-height: 1.25; font-weight: 650; letter-spacing: -1.2px; margin-top: 12px; }
.stat-caption { display: block; color: #72828c; font-size: 12px; margin-top: 6px; }
.stat-attention .stat-top .icon { color: #f0790c; }
.stat-attention > strong { color: #a34b08; }
.stat-link { color: inherit; }
.stat-link:hover { text-decoration: none; border-color: #a1cfc6; }
.stat-link .stat-caption { display: flex; align-items: center; justify-content: space-between; gap: 4px; }
.stat-link .action-word { display: none; }
.section-block { margin-top: 30px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 17px; }
.section-heading h2 { display: flex; align-items: center; gap: 10px; }
.section-heading p { margin-top: 6px; color: var(--muted); font-size: 14px; }
.count-pill { font-size: 12px; padding: 1px 7px; line-height: 1.55; border-radius: 5px; color: #70828c; background: #e8eef2; display: inline-block; font-weight: 600; }
.filter-bar { display: flex; align-items: center; gap: 9px; margin-bottom: 20px; }
.filter-bar input, .filter-bar select { min-height: 43px; font-size: 14px; padding: 9px 11px; }
.search-field { flex: 2.2; min-width: 140px; position: relative; }
.search-field .icon { position: absolute; top: 12px; left: 12px; width: 18px; height: 18px; color: #81929b; pointer-events: none; }
.search-field input { padding-left: 38px; }
.filter-field { flex: 1; min-width: 120px; }
.clear-filter { font-size: 14px; padding: 9px 4px; }
.projects-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.project-card { border: 1px solid var(--line); border-radius: var(--radius); padding: 21px 22px 15px; background: #fff; min-width: 0; display: flex; flex-direction: column; transition: border-color .15s; }
.project-card:hover { border-color: #afc8cf; }
.project-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; gap: 10px; }
.project-glyph { background: #edf6e9; color: #00614e; width: 35px; height: 35px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; }
.project-glyph .icon { width: 20px; height: 20px; }
.project-card h3 { font-size: 18px; letter-spacing: -.25px; line-height: 1.4; }
.project-card h3 a { color: var(--ink); }
.project-description { font-size: 14px; color: var(--muted); line-height: 1.65; margin-top: 9px; margin-bottom: 17px; min-height: 46px; }
.project-owner { display: flex; align-items: center; gap: 8px; color: #4f6370; font-size: 14px; margin-top: auto; padding-bottom: 18px; }
.avatar-small { width: 28px; height: 28px; color: #4f7e78; background: #eaf2ef; font-size: 11px; }
.project-owner small { display: block; font-size: 10px; color: #82919a; line-height: 1.4; margin-top: 1px; }
.project-summaries { border-top: 1px solid #edf0f2; border-bottom: 1px solid #edf0f2; padding: 14px 0; display: grid; gap: 11px; }
.project-summaries > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.project-summaries dt { font-size: 14px; color: var(--muted); }
.project-summaries dd { line-height: 1; }
.badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; background: #edf1f4; color: #546b79; border-radius: 4px; line-height: 1.25; font-size: 14px; font-weight: 500; text-transform: capitalize; }
.status-dot { width: 5px; height: 5px; flex-shrink: 0; border-radius: 50%; background: currentColor; opacity: .85; }
.status-complete, .status-completed, .status-accepted, .status-reviewed, .status-resolved, .status-approved, .complete, .completed, .accepted, .reviewed, .resolved, .approved { background: #edf6e9; color: #3d732b; }
.status-partial, .status-expected, .status-in-progress, .status-running, .status-open, .partial, .expected, .in-progress, .running, .open { background: #fff0e1; color: #a34b08; }
.status-blocked, .status-failed, .status-conflicting, .status-needs-attention, .status-unavailable, .status-declined, .blocked, .failed, .conflicting, .needs-attention, .unavailable, .declined { background: #fceeed; color: #a3433e; }
.status-incomplete, .status-unreviewed, .status-waiting-for-information, .status-pending, .status-unknown, .incomplete, .unreviewed, .waiting-for-information, .pending, .unknown { background: #fff3e7; color: #a34b08; }
.status-not-reviewed, .status-not-assessed, .status-not-started, .status-not-applicable, .status-closed, .status-mixed, .not-reviewed, .not-assessed, .not-started, .not-applicable, .closed, .mixed { background: #eef1f4; color: #617582; }
.project-card-bottom { display: flex; align-items: center; justify-content: space-between; font-size: 14px; color: var(--muted); padding-top: 15px; gap: 8px; }
.project-card-bottom > span { display: flex; gap: 6px; align-items: center; }
.project-card-bottom .icon { width: 15px; height: 15px; color: #8a9ca5; }
.icon-link { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; min-height: 34px; padding: 5px 8px; border-radius: 5px; color: var(--green); font-size: 14px; }
.icon-link:hover { background: #edf6f4; text-decoration: none; }
.icon-link .icon { width: 17px; height: 17px; }
.project-update { color: #8999a2; font-size: 10px; margin-top: 9px; }
.overview-lower { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 22px; margin-top: 28px; }
.panel { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); min-width: 0; }
.panel-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; border-bottom: 1px solid #edf0f3; padding: 18px 22px; }
.panel-heading h2 { font-size: 17px; display: flex; align-items: center; gap: 9px; }
.panel-heading .icon { color: #8098a3; }
.text-link { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; }
.text-link .icon { width: 15px; height: 15px; }
.text-link .action-word { display: none; }
.attention-list { padding: 0 22px; }
.attention-item { display: flex; align-items: flex-start; padding: 17px 0; gap: 11px; color: inherit; border-bottom: 1px solid #edf1f3; }
.attention-item:last-child { border-bottom: none; }
.attention-item:hover { text-decoration: none; }
.attention-item:hover h3 { text-decoration: underline; text-underline-offset: 3px; }
.attention-icon { padding: 6px; border-radius: 6px; background: #fff3e7; color: #a34b08; flex-shrink: 0; }
.attention-icon .icon { width: 16px; height: 16px; display: block; }
.attention-item h3 { font-size: 14px; font-weight: 650; }
.attention-item p { font-size: 14px; color: var(--muted); margin-top: 4px; }
.attention-item > .action-word { display: none; }
.activity-list { padding: 5px 22px; }
.activity-item { display: flex; gap: 12px; padding: 14px 0; position: relative; border-bottom: 1px solid #edf1f3; align-items: flex-start; }
.activity-item:last-child { border-bottom: 0; }
.activity-marker { background: #dcece8; width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; margin-top: 8px; }
.activity-copy { flex: 1; min-width: 0; font-size: 14px; }
.activity-copy p + p { margin-top: 4px; }
.activity-item time { flex-shrink: 0; font-size: 11px; margin-top: 3px; }
.overview-lower .activity-item { flex-wrap: wrap; }
.overview-lower .activity-item time { margin-left: 19px; flex-basis: calc(100% - 19px); margin-top: -5px; }
.empty-state { padding: 34px 20px; text-align: center; max-width: 580px; margin: 0 auto; }
.empty-icon { display: inline-flex; align-items: center; justify-content: center; color: #6b9792; width: 44px; height: 44px; border-radius: 10px; background: #edf5f3; margin-bottom: 15px; }
.empty-state h3 { font-size: 16px; }
.empty-state p { color: var(--muted); font-size: 14px; margin-top: 8px; }
.workspace-footer { border-top: 1px solid var(--line); margin-top: 38px; padding: 20px 0 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #84939c; font-size: 11px; }
.footer-dot { margin: 0 8px; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 10px; color: #8b9aa3; font-size: 13px; margin-bottom: 23px; }
.breadcrumbs a { color: #627b88; }
.breadcrumbs > span:last-child { color: #496170; }
.project-meta-strip { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; font-size: 14px; color: var(--muted); margin: 2px 0 24px; }
.project-meta-strip > span { display: flex; align-items: center; gap: 8px; }
.project-meta-strip .icon { width: 16px; height: 16px; color: #829ca5; }
.project-meta-strip strong { color: #365563; font-size: 14px; font-weight: 550; }
.project-page-summary { display: grid; grid-template-columns: .7fr 1.25fr 1.25fr .7fr; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.project-page-summary > div { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; padding: 19px 22px; border-right: 1px solid var(--line); }
.project-page-summary > div:last-child { border-right: none; }
.project-page-summary strong { font-size: 24px; line-height: 1; font-weight: 600; }
.section-nav { display: flex; gap: 30px; border-bottom: 1px solid #dce5e9; margin: 29px 0 3px; overflow-x: auto; }
.section-nav a { white-space: nowrap; color: #587280; font-size: 14px; padding: 12px 0 15px; font-weight: 600; border-bottom: 2px solid transparent; }
.section-nav a:first-child { color: var(--green); border-bottom-color: var(--green); }
.section-nav a:hover { text-decoration: none; border-bottom-color: #78b6aa; }
.section-nav a span { display: inline-block; margin-left: 6px; font-size: 11px; padding: 0 5px; background: #e9eef1; color: #85959f; border-radius: 4px; }
.table-panel { overflow: hidden; }
.table-scroll { overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; text-align: left; font-size: 14px; }
.data-table th { padding: 14px 17px; background: #fafcfd; color: #748894; font-size: 11px; text-transform: uppercase; letter-spacing: .7px; font-weight: 650; white-space: nowrap; border-bottom: 1px solid var(--line); }
.data-table td { padding: 20px 17px; border-bottom: 1px solid #edf1f3; vertical-align: middle; min-width: 125px; }
.data-table td:first-child { min-width: 220px; }
.data-table td:last-child { min-width: 54px; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.table-title { color: #294d5b; display: block; font-size: 14px; font-weight: 650; }
.table-secondary { display: block; font-size: 12px; color: #7a8d98; margin-top: 5px; }
.table-value { font-weight: 500; }
.project-lower-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 22px; margin-top: 30px; }
.question-list { padding: 0 22px; }
.question-list-item { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 18px 0; color: var(--ink); border-bottom: 1px solid #edf1f3; }
.question-list-item:last-child { border-bottom: 0; }
.question-list-item:hover { text-decoration: none; }
.question-list-item:hover h3 { text-decoration: underline; text-underline-offset: 3px; }
.question-list-item .eyebrow { margin-bottom: 6px; font-size: 9px; color: #84959d; }
.question-list-item h3 { font-size: 15px; font-weight: 650; }
.question-list-item p { font-size: 13px; margin-top: 5px; color: var(--muted); }
.question-list-item > .badge { flex-shrink: 0; }
.member-list { padding: 0 22px; }
.member-item { display: flex; gap: 10px; padding: 17px 0; align-items: center; border-bottom: 1px solid #edf1f3; }
.member-item:last-child { border-bottom: none; }
.avatar-light { background: #e9f2ef; color: #50847b; }
.member-item strong { display: block; font-size: 14px; font-weight: 600; }
.member-item div span { font-size: 12px; color: #8797a0; }
.member-role { margin-left: auto; font-size: 12px; color: #6c8590; border: 1px solid #e1e8eb; background: #f7f9f5; border-radius: 4px; padding: 2px 6px; }
.panel-note { margin: 0; padding: 14px 22px; background: #fafcfd; border-top: 1px solid #edf1f3; border-radius: 0 0 var(--radius) var(--radius); color: #718490; font-size: 12px; line-height: 1.6; }
.dataset-facts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding: 20px 22px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); gap: 16px; }
.dataset-facts > div { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.dataset-facts > div > span:first-child { font-size: 12px; color: #748893; }
.dataset-facts strong { font-size: 14px; font-weight: 550; }
.counts-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.count-card { border: 1px solid var(--line); background: #fff; padding: 20px 22px; border-radius: var(--radius); }
.count-card h3 { font-size: 14px; color: #476471; font-weight: 600; }
.count-pair { display: flex; align-items: center; gap: 22px; margin-top: 15px; }
.count-pair > div { display: flex; flex-direction: column; gap: 5px; }
.count-pair > div > span { font-size: 10px; letter-spacing: .35px; text-transform: uppercase; color: #91a0a8; }
.count-pair strong { font-size: 29px; line-height: 1.3; font-weight: 600; letter-spacing: -.7px; }
.count-pair > div:last-child strong { color: #82949d; }
.count-pair strong .muted { font-size: 16px; font-weight: 500; letter-spacing: 0; }
.count-separator { font-size: 23px; color: #d2dce1; margin-top: 20px; font-weight: 300; }
.count-card > p { font-size: 12px; color: #84949e; margin-top: 12px; }
.inline-note { display: flex; align-items: flex-start; gap: 7px; color: #758891; font-size: 13px; margin-top: 14px; }
.inline-note .icon { width: 15px; height: 15px; margin-top: 3px; }
.evidence-note { border-left: 2px solid #9ebcb8; padding: 0 0 0 15px; margin-top: 18px; }
.evidence-note h3 { font-size: 13px; color: #52736f; }
.evidence-note p { font-size: 14px; color: var(--muted); margin-top: 5px; }
.location-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 19px; }
.location-card { padding: 21px 22px 0; display: flex; flex-direction: column; }
.location-heading { display: flex; align-items: center; gap: 10px; }
.storage-glyph { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; color: #548981; background: #edf5f3; flex-shrink: 0; }
.storage-glyph .icon { width: 19px; height: 19px; }
.location-heading h3 { font-size: 16px; }
.location-heading p { font-size: 13px; color: var(--muted); margin-top: 3px; }
.location-heading .badge { margin-left: auto; }
.path-box { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; padding: 11px 12px; background: #f5f8fa; border: 1px solid #e4eaf0; border-radius: 5px; margin-top: 17px; }
.path-box code { overflow-wrap: anywhere; font-size: 12px; color: #506975; line-height: 1.65; }
.copy-button { font-size: 11px; border: 1px solid #d5e1e6; padding: 3px 7px; background: #fff; color: #5a7d84; flex-shrink: 0; border-radius: 4px; }
.copy-button:hover { border-color: #8ab6ac; background: #eff7f4; }
.detail-list { display: grid; gap: 13px; padding: 18px 0; }
.detail-list dt { color: #8799a3; font-size: 11px; margin-bottom: 4px; }
.detail-list dd { font-size: 14px; line-height: 1.6; color: #4f6874; }
.card-bottom { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 0; margin-top: auto; border-top: 1px solid #edf1f3; }
.card-bottom > .small { font-size: 11px; }
.processing-list { display: grid; gap: 14px; }
.processing-header { display: flex; gap: 15px; align-items: center; padding: 20px 22px; }
.step-number { display: inline-flex; width: 31px; height: 31px; align-items: center; justify-content: center; background: #f0f4f6; color: #92a4ac; font-size: 11px; border-radius: 6px; flex-shrink: 0; }
.processing-header h3 { font-size: 16px; }
.processing-header p { font-size: 13px; color: var(--muted); margin-top: 4px; }
.step-statuses { display: flex; align-items: flex-start; gap: 21px; margin-left: auto; }
.step-statuses > div { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.step-statuses > div > span:first-child { font-size: 10px; color: #879aa4; text-transform: uppercase; letter-spacing: .5px; }
.processing-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 30px; border-top: 1px solid #edf1f3; padding: 18px 22px; }
.detail-label { display: block; font-size: 11px; color: #8497a2; margin-bottom: 6px; }
.processing-details p { font-size: 14px; color: #566e7a; }
.path-box-compact { margin-top: 0; padding: 7px 9px; }
.processing-dates { display: flex; gap: 20px; padding: 10px 22px; border-top: 1px solid #edf1f3; font-size: 11px; color: #8597a0; background: #fbfcfd; border-radius: 0 0 var(--radius) var(--radius); }
.source-reference { margin-bottom: 19px; padding: 18px 22px; border: 1px solid #dfe7ec; border-radius: var(--radius); background: #f0f4ed; }
.source-reference p { color: #5f7784; }
.questions-filters { margin-bottom: 28px; }
.questions-filters .search-field { flex: 2; }
.questions-board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(290px, 1fr); gap: 20px; overflow-x: auto; padding-bottom: 12px; align-items: start; }
.board-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 12px 0; }
.board-toolbar .button { flex-shrink: 0; }
.board-feedback { min-height: 24px; margin-bottom: 8px; }
.board-feedback.is-error { color: #a32929; }
.board-question { position: relative; }
.board-question[data-movable] { cursor: grab; }
.board-question.is-dragging { opacity: .45; }
.board-question.is-saving { opacity: .65; cursor: progress; }
.board-question .question-card { cursor: inherit; }
.board-move-form { display: flex; gap: 6px; margin-top: 6px; }
.board-move-form select { min-width: 0; flex: 1; padding: 6px; }
.board-move-form .button { padding: 6px 10px; }
.board-column.is-drop-target { border-color: var(--leaf); outline: 2px solid var(--leaf); outline-offset: -2px; }
.board-column .board-cards { min-height: 160px; }
.board-empty[hidden] { display: none; }
.board-column { border: 1px solid #dfe7ec; background: #f0f4ed; border-radius: var(--radius); padding: 16px; min-width: 0; }
.board-column-heading { display: flex; align-items: center; gap: 8px; padding: 0 2px 16px; }
.board-column-heading h2 { font-size: 14px; letter-spacing: -.1px; }
.board-column-heading .count-pill { margin-left: auto; background: #e1e9ee; }
.board-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--orange); }
.board-dot.status-waiting-for-information { background: #a34b08; }
.board-dot.status-in-progress { background: var(--leaf); }
.board-cards { display: grid; gap: 12px; }
.question-card { display: block; background: #fff; border: 1px solid #dfe6ec; border-radius: 7px; padding: 17px 17px 13px; color: var(--ink); box-shadow: 0 2px 4px #12304403; }
.question-card:hover { text-decoration: none; border-color: #aac9c4; }
.question-card .eyebrow { font-size: 9px; color: #73938c; letter-spacing: .8px; display: block; margin-bottom: 9px; }
.question-card h3 { font-size: 16px; }
.question-context { font-size: 12px; color: #84959f; margin-top: 11px; line-height: 1.6; }
.question-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid #edf1f3; margin-top: 14px; padding-top: 12px; font-size: 12px; color: #75919a; }
.question-card-footer > span { display: flex; align-items: center; gap: 6px; }
.question-card-footer .icon { width: 13px; height: 13px; }
.board-empty { font-size: 13px; color: #879aa3; padding: 20px 8px; text-align: center; }
.question-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 24px; }
.discussion-opening, .comment { padding: 22px; }
.discussion-author { display: flex; gap: 10px; align-items: center; }
.discussion-author strong { font-size: 14px; display: block; }
.discussion-author time { color: #899ba5; font-size: 11px; display: block; margin-top: 2px; }
.discussion-author .badge { margin-left: auto; }
.discussion-body { padding-top: 20px; font-size: 16px; line-height: 1.8; color: #4f6774; }
.comments-list { display: grid; gap: 14px; }
.comment .discussion-body { padding-top: 17px; }
.comment-form { padding: 21px 22px; margin-top: 17px; }
.comment-form label { display: block; margin-bottom: 12px; font-size: 14px; font-weight: 600; }
.comment-form textarea { font-size: 14px; }
.comment-form-footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 15px; }
.empty-discussion { display: flex; align-items: center; gap: 10px; color: #8297a1; font-size: 14px; padding: 22px 2px; }
.question-aside { display: grid; align-content: start; gap: 18px; }
.question-details { padding: 20px 22px; gap: 18px; }
.question-details dt { font-size: 12px; }
.decision-body { padding: 20px 22px; }
.decision-body p { font-size: 14px; margin-top: 14px; }
.decision-history-item { padding: 17px 22px; border-bottom: 1px solid #edf1f3; }
.decision-history-item:last-child { border-bottom: 0; }
.decision-history-item p { margin-top: 8px; font-size: 12px; color: #78909a; }
.decision-history-item p:last-child { font-size: 14px; color: #526e7b; }
.heading-chip { display: inline-flex; gap: 8px; align-items: center; font-size: 13px; padding: 8px 11px; border: 1px solid #dde7eb; background: #fff; border-radius: 6px; white-space: nowrap; color: #6b8895; }
.heading-chip .icon { width: 14px; height: 14px; }
.activity-page .activity-item { padding: 21px 0; }
.activity-page .activity-copy { font-size: 16px; }
.activity-page .activity-item time { font-size: 13px; }
.storage-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.storage-system { padding: 23px 24px 0; display: flex; flex-direction: column; }
.storage-system-heading { display: flex; gap: 12px; align-items: center; margin-bottom: 16px; }
.storage-system-heading h2 { font-size: 19px; }
.storage-system > p { font-size: 16px; color: #627c88; line-height: 1.75; margin-bottom: 22px; }
.storage-system .card-bottom { font-size: 13px; color: #6f8691; }
.storage-explainer { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 30px; }
.storage-explainer > div { padding: 23px 24px; border-right: 1px solid #e8edf1; }
.storage-explainer > div:last-child { border-right: 0; }
.explainer-number { color: #73a49a; font-size: 11px; font-weight: 650; }
.storage-explainer h3 { margin: 10px 0; font-size: 15px; }
.storage-explainer p { color: #7b8f99; font-size: 14px; line-height: 1.7; }
.back-link { display: inline-block; color: #5f7e8a; font-size: 14px; margin-bottom: 24px; }
.form-page-heading { max-width: 900px; }
.editor-form { max-width: 950px; padding: 25px 28px 0; }
.required-hint { color: #8b9da5; font-size: 12px; margin-bottom: 25px; }
.required-marker { color: #458b7e; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 26px; }
.form-field { min-width: 0; }
.form-field-wide { grid-column: 1 / -1; }
.form-field label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 8px; color: #3c5966; }
.form-field input, .form-field select, .form-field textarea { font-size: 16px; }
.field-help { font-size: 13px; line-height: 1.6; color: #82969f; margin-top: 6px; }
.field-help:empty { display: none; }
.field-error { font-size: 14px; color: var(--red); margin-top: 6px; }
[aria-invalid="true"] { border-color: #b75a53; background: #fffafa; }
.form-actions { border-top: 1px solid #e8eef1; margin-top: 27px; padding: 21px 0; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.form-actions > div { display: flex; gap: 9px; }
.validation-summary { background: var(--red-tint); color: #963d37; border: 1px solid #eccbc7; padding: 17px 20px; border-radius: 7px; font-size: 14px; margin: 0 0 20px; max-width: 950px; }
.validation-summary h2 { font-size: 16px; }
.validation-summary ul { margin: 10px 0 0; padding-left: 20px; }
.validation-summary a { color: inherit; text-decoration: underline; }
.flash-messages { margin-bottom: 24px; }
.flash { display: flex; gap: 10px; align-items: center; background: #eaf4ef; color: #36725d; border: 1px solid #cfdfd5; padding: 13px 17px; border-radius: 7px; font-size: 14px; margin-bottom: 10px; }
.flash.error { color: #963d37; background: var(--red-tint); border-color: #eccbc7; }
.error-page { text-align: center; max-width: 600px; margin: 75px auto; }
.error-code { display: block; font-size: 11px; letter-spacing: 3px; color: #8ca6b0; margin-bottom: 20px; }
.error-page .empty-icon { display: flex; margin: 0 auto 24px; width: 60px; height: 60px; }
.error-page p { color: var(--muted); margin: 20px auto 27px; font-size: 16px; }
.signed-out { background: #fff; }
.login-main { min-height: 100vh; outline: none; }
.login-main > .flash-messages { position: absolute; top: 20px; right: 20px; width: calc(50% - 40px); z-index: 20; }
.login-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 100vh; }
.login-story { border-top: 4px solid var(--orange); background: var(--forest); color: #fff; padding: 48px 60px 30px; display: flex; flex-direction: column; min-width: 0; }
.login-story .brand { padding: 0; }
.login-story-content { margin: auto 0; padding: 70px 0; max-width: 470px; }
.login-eyebrow { font-size: 10px; color: #f8b87f; letter-spacing: 2px; font-weight: 650; }
.login-story h1 { font-size: clamp(32px, 3.2vw, 49px); line-height: 1.24; font-weight: 550; letter-spacing: -1.3px; margin: 22px 0 21px; }
.login-story-content > p { color: #e1eee4; font-size: 17px; line-height: 1.8; max-width: 430px; }
.login-capabilities { display: grid; gap: 19px; border-top: 1px solid #267b65; margin-top: 36px; padding-top: 28px; }
.login-capabilities > div { display: flex; align-items: center; gap: 12px; font-size: 14px; color: #e1eee4; }
.login-capabilities .icon { color: #f8b87f; width: 18px; height: 18px; }
.login-story-footer { color: #c0dccb; font-size: 11px; }
.login-story-footer span { margin: 0 8px; }
.login-panel { padding: 48px 50px; display: flex; align-items: center; justify-content: center; }
.login-panel-inner { width: 100%; max-width: 430px; }
.local-chip { display: inline-flex; align-items: center; gap: 6px; color: #6e948c; border: 1px solid #dce9e5; border-radius: 5px; background: #f3f8f6; font-size: 9px; font-weight: 650; padding: 4px 8px; letter-spacing: 1.2px; margin-bottom: 24px; }
.local-chip .icon { width: 12px; height: 12px; }
.login-panel h2 { font-size: 27px; letter-spacing: -.75px; line-height: 1.3; font-weight: 650; }
.login-intro { color: #7e919c; font-size: 16px; line-height: 1.7; margin-top: 12px; margin-bottom: 25px; }
.login-form { display: grid; gap: 18px; }
.login-form .button { width: 100%; margin-top: 4px; font-size: 16px; min-height: 45px; }
.demo-accounts { border-top: 1px solid #e2e9ee; margin-top: 28px; padding-top: 23px; }
.demo-accounts h3 { font-size: 13px; color: #607d88; font-weight: 600; margin-bottom: 13px; }
.demo-role-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.demo-role-grid button { border: 1px solid #dce7ec; text-align: left; background: #f7f9f5; padding: 10px 11px; }
.demo-role-grid button:hover { border-color: #90bdb1; background: #f1f8f5; }
.demo-role-grid strong { font-size: 14px; display: block; font-weight: 550; color: #486d78; }
.demo-role-grid span { display: block; font-size: 11px; color: #90a0a8; margin-top: 3px; }
.demo-password { display: flex; flex-wrap: wrap; gap: 6px 10px; background: #edf5f2; padding: 12px; border-radius: 5px; margin-top: 14px; }
.demo-password > span { flex-basis: 100%; color: #69897e; font-size: 10px; }
.demo-password code { color: #567b70; font-size: 12px; overflow-wrap: anywhere; flex: 1; }
.demo-accounts > p { font-size: 11px; color: #98a8af; margin-top: 13px; line-height: 1.7; }
@media (min-width: 1800px) { .app-shell { grid-template-columns: 265px minmax(0, 1fr); } .sidebar { padding-top: 37px; } }
@media (max-width: 1250px) {
  .app-shell { grid-template-columns: 218px minmax(0, 1fr); }
  .sidebar { padding-left: 13px; padding-right: 13px; }
  .profile { margin-left: -13px; margin-right: -13px; }
  .brand { font-size: 22px; gap: 10px; padding-left: 8px; }
  .brand small { font-size: 7px; }
  .nav-link { padding-left: 12px; gap: 9px; font-size: 13px; }
  .topbar { padding: 0 26px; }
  .main-content { padding: 28px 26px 0; }
  .filter-bar { flex-wrap: wrap; }
  .filter-bar .search-field { flex-basis: 100%; }
  .projects-grid { gap: 15px; }
  .project-card { padding: 18px 17px 14px; }
  .project-summaries > div { align-items: flex-start; flex-direction: column; gap: 7px; }
  .stats-grid { gap: 12px; }
  .stat-card { padding: 17px; }
  .stat-caption { font-size: 11px; }
  .notice-tag { display: none; }
  .heading-actions { flex-wrap: wrap; justify-content: flex-end; }
  .page-heading { align-items: flex-start; }
  .question-detail-grid { grid-template-columns: minmax(0, 1fr) 280px; gap: 18px; }
  .location-heading { flex-wrap: wrap; }
  .location-heading .badge { margin-left: 0; }
  .processing-header { flex-wrap: wrap; }
  .step-statuses { margin-left: 46px; flex-basis: calc(100% - 84px); }
  .dataset-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1020px) {
  .projects-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-summaries > div { flex-direction: row; align-items: center; }
  .projects-grid .project-card:last-child { grid-column: auto; }
  .overview-lower { grid-template-columns: 1fr; }
  .overview-lower .activity-item { flex-wrap: nowrap; }
  .overview-lower .activity-item time { flex-basis: auto; margin: 3px 0 0; }
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-lower-grid { grid-template-columns: 1fr; }
  .location-grid { grid-template-columns: 1fr; }
  .location-heading { flex-wrap: nowrap; }
  .location-heading .badge { margin-left: auto; }
  .counts-grid { gap: 12px; }
  .count-card { padding: 17px; }
  .count-pair { gap: 13px; }
  .questions-board { grid-template-columns: 1fr; grid-auto-flow: row; grid-auto-columns: auto; overflow-x: visible; }
  .board-toolbar { align-items: flex-start; flex-wrap: wrap; }
  .board-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .question-detail-grid { grid-template-columns: 1fr; }
  .question-aside { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .question-aside .decision-history { grid-column: 1 / -1; }
  .storage-grid, .storage-explainer { grid-template-columns: 1fr; }
  .storage-explainer > div { border-right: 0; border-bottom: 1px solid #e8edf1; }
  .storage-explainer > div:last-child { border-bottom: 0; }
  .workspace-footer { flex-direction: column; align-items: flex-start; gap: 5px; }
  .login-story { padding: 42px 38px 28px; }
  .login-panel { padding: 42px 35px; }
}
@media (max-width: 760px) {
  .app-shell { display: block; }
  .sidebar { position: fixed; width: 242px; left: -260px; top: 0; transition: left .18s ease; box-shadow: 8px 0 26px #18374124; }
  .sidebar.is-open { left: 0; }
  .menu-toggle { display: inline-flex; }
  .topbar { height: 63px; padding: 0 20px; }
  .topbar-label { font-size: 12px; }
  .topbar-label { max-width: 250px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .topbar-separator { margin: 0 7px; }
  .prototype-label { font-size: 8px; letter-spacing: .7px; }
  .prototype-label .prototype-divider, .prototype-label .prototype-divider ~ span { display: none; }
  .main-content { padding: 25px 20px 0; }
  h1 { font-size: 29px; }
  .page-heading { flex-wrap: wrap; gap: 18px; }
  .page-subtitle { font-size: 15px; }
  .notice { align-items: flex-start; padding: 13px 14px; }
  .notice > .icon { margin-top: 3px; }
  .filter-field { min-width: 140px; }
  .section-heading { align-items: flex-start; }
  .section-heading > .mini-label { display: none; }
  .projects-grid { gap: 15px; }
  .project-page-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-page-summary > div:nth-child(2) { border-right: 0; }
  .project-page-summary > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .section-nav { gap: 24px; }
  .dataset-facts { gap: 17px; }
  .heading-actions { justify-content: flex-start; }
  .form-actions { flex-wrap: wrap; }
  .form-actions > .small { flex-basis: 100%; }
  .login-layout { grid-template-columns: 1fr; }
  .login-story { padding: 26px 26px 0; }
  .login-story-content { padding: 40px 0 35px; margin: 0; }
  .login-story h1 { font-size: 36px; }
  .login-story-content > p { font-size: 15px; }
  .login-capabilities { display: none; }
  .login-story-footer { display: none; }
  .login-panel { padding: 34px 26px 40px; }
  .login-panel-inner { max-width: 520px; }
  .login-main > .flash-messages { position: relative; top: auto; right: auto; width: auto; margin: 20px; }
}
@media (max-width: 540px) {
  .topbar { gap: 8px; }
  .topbar-label { max-width: 145px; }
  .prototype-label { max-width: 125px; line-height: 1.5; }
  .main-content { padding-left: 16px; padding-right: 16px; }
  .stats-grid { gap: 10px; }
  .stat-card { padding: 15px; }
  .stat-top { font-size: 13px; }
  .stat-caption { font-size: 10px; }
  .stat-card > strong { font-size: 30px; }
  .projects-grid { grid-template-columns: 1fr; }
  .project-card { padding: 20px; }
  .section-heading { flex-wrap: wrap; gap: 13px; }
  .panel-heading { padding-left: 18px; padding-right: 18px; }
  .panel-heading h2 { font-size: 16px; }
  .panel-heading .mini-label { display: none; }
  .activity-list, .attention-list { padding-left: 18px; padding-right: 18px; }
  .activity-item { flex-wrap: wrap; }
  .activity-item time, .overview-lower .activity-item time { flex-basis: calc(100% - 19px); margin: -4px 0 0 19px; }
  .overview-lower .activity-item { flex-wrap: wrap; }
  .counts-grid { grid-template-columns: 1fr; }
  .count-card { display: grid; grid-template-columns: 1fr 1.4fr; gap: 4px 14px; align-items: start; }
  .count-card h3 { align-self: center; }
  .count-card > p { grid-column: 1 / -1; margin-top: 6px; }
  .count-pair { margin-top: 0; gap: 18px; }
  .count-pair strong { font-size: 26px; }
  .dataset-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 17px; }
  .location-card { padding: 18px 17px 0; }
  .location-heading { flex-wrap: wrap; }
  .location-heading .badge { margin-left: 0; }
  .processing-header { padding: 18px 17px; gap: 11px; }
  .processing-header > div:nth-child(2) { flex: 1; }
  .step-statuses { margin-left: 42px; gap: 14px; flex-basis: calc(100% - 79px); }
  .processing-details { grid-template-columns: 1fr; padding: 18px 17px; }
  .processing-dates { padding-left: 17px; flex-wrap: wrap; gap: 5px 15px; }
  .question-list { padding: 0 18px; }
  .question-list-item { align-items: flex-start; flex-direction: column; gap: 12px; }
  .board-cards { grid-template-columns: 1fr; }
  .question-aside { grid-template-columns: 1fr; }
  .discussion-opening, .comment, .comment-form { padding: 18px; }
  .discussion-author { flex-wrap: wrap; }
  .discussion-author .badge { margin-left: 44px; }
  .comment-form-footer { align-items: flex-start; flex-direction: column; }
  .comment-form-footer .button { align-self: flex-end; }
  .editor-form { padding: 22px 19px 0; }
  .form-grid { grid-template-columns: 1fr; }
  .form-field-wide { grid-column: auto; }
  .required-hint { margin-bottom: 22px; }
  .form-actions > div { width: 100%; justify-content: flex-end; }
  .project-meta-strip { gap: 12px; }
  .storage-system { padding: 22px 18px 0; }
  .storage-system .mini-label { display: none; }
  .heading-chip { white-space: normal; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; } }
@media print { .sidebar, .topbar, .button, .section-nav, .copy-button, .workspace-footer { display: none !important; } .app-shell { display: block; } .main-content { padding: 0; } body { background: #fff; } .panel, .project-card, .count-card { break-inside: avoid; } }
/* Backend status families keep the same meaning across all pages. */
.status-good { background: #edf6e9; color: #3d732b; }
.status-danger { background: #fceeed; color: #a3433e; }
.status-warning { background: #fff3e7; color: #a34b08; }
.status-info { background: #fff0e1; color: #a34b08; }
.status-neutral { background: #eef1f4; color: #617582; }
.board-dot.status-warning { background: #a34b08; }
.board-dot.status-info { background: var(--orange); }
.badge-group { display: inline-flex; align-items: flex-start; flex-wrap: wrap; gap: 5px; }
.project-summaries > div { align-items: flex-start; flex-direction: column; gap: 7px; }
.project-summaries dd { width: 100%; }
.project-page-summary .badge-group { align-items: flex-start; }
.project-description, .notice p, .storage-explainer p, .empty-state p,
.evidence-note p, .detail-list dd, .processing-details p, .question-list-item p,
.attention-item p, .question-context, .board-empty, .field-help { font-size: 16px; }
.stat-caption, .table-secondary, .panel-note, .count-card > p, .inline-note,
.sidebar-note p, .login-story-footer, .demo-role-grid span, .demo-accounts > p,
.copy-button, .demo-password code, .login-capabilities > div { font-size: 14px; }
.project-update, .activity-item time, .activity-page .activity-item time,
.discussion-author time, .processing-dates, .decision-history-item p,
.question-card-footer, .member-role, .member-item div span, .profile div > span,
.profile strong, .logout-button, .topbar-label, .breadcrumbs { font-size: 14px; }
.detail-list dt, .detail-label, .dataset-facts > div > span:first-child,
.count-pair > div > span, .step-statuses > div > span:first-child,
.required-hint, .demo-accounts h3, .demo-password > span { font-size: 14px; }
.count-pair > div > span, .step-statuses > div > span:first-child { text-transform: none; letter-spacing: 0; }
.processing-header p, .location-heading p, .evidence-note h3,
.card-bottom > .small, .profile form { font-size: 14px; }
.data-table th { font-size: 12px; letter-spacing: .3px; text-transform: none; }
.question-list-item h3, .storage-explainer h3, .attention-item h3 { font-size: 16px; }
.project-card h3 { font-size: 20px; }
.login-intro, .login-story-content > p, .page-subtitle { font-size: 16px; }
@media (max-width: 760px) { .project-update { font-size: 13px; } }
.project-summaries { margin-top: 16px; padding-top: 13px; }
@media (min-width: 541px) and (max-width: 1100px) {
  .overview-heading .eyebrow, .overview-heading .page-subtitle,
  .overview-projects .section-heading p { display: none; }
  .overview-heading { align-items: center; margin-bottom: 20px; }
  .stats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 20px; margin-bottom: 25px; }
  .stat-card { padding: 12px 14px; }
  .stat-top { font-size: 14px; min-height: 42px; align-items: flex-start; }
  .stat-top .icon, .stat-caption { display: none; }
  .stat-card > strong { font-size: 28px; margin-top: 1px; }
  .overview-projects { margin-top: 24px; }
}
@media (max-width: 760px) {
  body:not(.js-enabled) .sidebar { position: static; width: 100%; height: auto; box-shadow: none; padding: 20px; }
  body:not(.js-enabled) .sidebar .nav-label { margin-top: 20px; }
  body:not(.js-enabled) .sidebar .main-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body:not(.js-enabled) .sidebar .sidebar-note { display: none; }
  body:not(.js-enabled) .sidebar .profile { display: flex; margin-top: 18px; }
  body:not(.js-enabled) .menu-toggle { display: none; }
}
/* Administration and manually selected project/dataset labels. */
.admin-nav-label { margin-top: 26px; }
.sidebar { overflow-y: auto; }
.sidebar-note { flex-shrink: 0; }
.user-person { display: flex; align-items: center; gap: 10px; }
.users-table td { overflow-wrap: anywhere; }
.users-table td:first-child { min-width: 230px; }
.users-table th, .users-table td { font-size: 14px; }
.project-access-fieldset, .workflow-fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.project-access-fieldset legend, .workflow-fieldset legend { font-size: 14px; font-weight: 600; color: #3c5966; margin-bottom: 10px; padding: 0; }
.project-access-fieldset > .field-help { margin: 0 0 15px; }
.project-access-options { display: grid; gap: 10px; }
.project-access-option { display: flex !important; align-items: flex-start; gap: 10px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 6px; background: #f9fbfc; cursor: pointer; margin-bottom: 0 !important; font-size: 14px; font-weight: 500 !important; }
.project-access-option input { width: 18px; height: 18px; min-height: 18px; flex-shrink: 0; margin: 2px 0 0; padding: 0; accent-color: var(--green); }
.project-access-option span { overflow-wrap: anywhere; }
.workflow-status-panel { margin-top: 23px; }
.workflow-status-panel .panel-heading { padding-top: 16px; padding-bottom: 16px; }
.workflow-status-form, .workflow-status-readonly { padding: 19px 22px; }
.workflow-status-form .field-help { font-size: 14px; margin: 0 0 13px; }
.workflow-status-buttons { display: flex; flex-wrap: wrap; gap: 9px; }
.workflow-status-option { position: relative; display: inline-flex !important; cursor: pointer; max-width: 100%; margin: 0 !important; }
.workflow-status-option input { position: absolute; opacity: 0; width: 1px; height: 1px; min-height: 0; margin: 0; padding: 0; }
.workflow-status-button { display: inline-flex; align-items: center; gap: 8px; padding: 10px 13px; min-height: 43px; border: 1px solid #cbd8df; border-radius: 6px; background: #fff; color: #506b78; font-size: 14px; font-weight: 500; line-height: 1.5; overflow-wrap: anywhere; transition: background-color .12s, border-color .12s; }
.workflow-status-check { display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px; flex-shrink: 0; border: 1px solid #b9cbd3; border-radius: 4px; background: #fff; }
.workflow-status-check .icon { width: 13px; height: 13px; opacity: 0; }
.workflow-status-option:hover .workflow-status-button { border-color: #7daea5; background: #f4faf7; }
.workflow-status-option input:checked + .workflow-status-button { border-color: var(--green); background: #edf6e9; color: #00614e; }
.workflow-status-option input:checked + .workflow-status-button .workflow-status-check { background: var(--green); border-color: var(--green); color: #fff; }
.workflow-status-option input:checked + .workflow-status-button .icon { opacity: 1; }
.workflow-status-option input:focus-visible + .workflow-status-button { outline: 3px solid #00614e; outline-offset: 3px; }
.workflow-status-form-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; border-top: 1px solid #edf1f3; padding-top: 16px; margin-top: 18px; }
.workflow-selected-statuses { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px; }
.workflow-label { display: inline-flex; background: #edf6e9; border: 1px solid #d7e8e2; padding: 5px 9px; border-radius: 5px; color: #00614e; line-height: 1.5; font-size: 14px; font-weight: 500; overflow-wrap: anywhere; max-width: 100%; }
.project-workflow-statuses { margin-top: 16px; }
.project-workflow-statuses .detail-label { margin-bottom: 8px; }
.workflow-filter { flex: 1.15; min-width: 155px; }
.status-catalogue { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 7px 22px; column-gap: 28px; }
.status-catalogue-item { display: flex; align-items: center; gap: 13px; padding: 17px 0; border-bottom: 1px solid #edf1f3; min-width: 0; }
.status-catalogue-item > .workflow-label { flex: 1; justify-content: flex-start; }
.status-catalogue-item > .text-link { flex-shrink: 0; }
.status-order { font-size: 14px; color: #899ca6; min-width: 22px; font-variant-numeric: tabular-nums; }
.status-catalogue > .empty-state { grid-column: 1 / -1; }
@media (max-width: 1250px) { .overview-heading .heading-actions { flex-wrap: wrap; } }
@media (max-width: 1020px) { .status-catalogue { grid-template-columns: 1fr; } }
@media (max-width: 760px) {
  .overview-heading { flex-wrap: wrap; }
  .overview-heading .heading-actions { flex-wrap: wrap; justify-content: flex-start; }
  body:not(.js-enabled) .admin-nav-label { margin-top: 16px; }
}
@media (max-width: 540px) {
  .workflow-status-form, .workflow-status-readonly { padding: 18px; }
  .workflow-status-form-footer { flex-wrap: wrap; }
  .workflow-status-form-footer > .button { margin-left: auto; }
  .status-catalogue { padding-left: 18px; padding-right: 18px; }
  .status-catalogue-item { gap: 8px; }
  .workflow-status-buttons { gap: 8px; }
  .workflow-status-button { padding: 9px 11px; }
}

/* Daily batch scan. */
.batch-list { display: grid; gap: 12px; }
.batch-row { display: grid; grid-template-columns: minmax(180px, .95fr) minmax(210px, 1fr) minmax(230px, 1.2fr) auto; gap: 22px; padding: 20px; align-items: start; }
.batch-row > * { min-width: 0; overflow-wrap: anywhere; }
.batch-identity .workflow-selected-statuses { margin: 9px 0; }
.batch-location, .batch-operation { display: block; color: var(--ink); font-size: 14px; line-height: 1.7; margin-top: 8px; }
.batch-location:hover, .batch-operation:hover { text-decoration: underline; }
.overview-operations { display: grid; gap: 8px; border-top: 1px solid var(--line); padding-top: 14px; margin-bottom: 20px; }
.overview-operations > a { color: var(--ink); font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.manual-status-details, .counts-details { margin-top: 18px; }
.manual-status-details > summary, .counts-details > summary { cursor: pointer; padding: 13px 16px; border: 1px solid var(--line); border-radius: 6px; font-size: 14px; color: #3c5966; }
.workflow-status-option input { z-index: 1; inset: 0; width: 100%; height: 100%; cursor: pointer; }
@media (max-width: 1100px) { .batch-row { grid-template-columns: minmax(180px, 1fr) minmax(200px, 1fr); } .batch-open { justify-self: start; } }
@media (max-width: 640px) { .batch-row { grid-template-columns: minmax(0, 1fr); gap: 16px; } .dataset-facts, .path-box { min-width: 0; } .page-heading .heading-actions { flex-wrap: wrap; } }

.optional-count-fields > summary { cursor: pointer; padding: 12px 0; font-weight: 600; color: #3c5966; }
.optional-count-fields > .form-grid { margin-top: 16px; }

/* Compact daily scan; full evidence stays one click away. */
.batch-list { gap: 0; margin-top: 10px; }
.batch-row { border-radius: 0; border-bottom: 0; padding: 11px 14px; gap: 16px; grid-template-columns: minmax(170px, .8fr) minmax(170px, .95fr) minmax(290px, 1.6fr) auto; }
.batch-row:last-child { border-bottom: 1px solid var(--line); }
.batch-row .table-title { font-size: 14px; }
.batch-row .table-secondary { font-size: 12px; margin-top: 2px; }
.batch-row .detail-label { font-size: 10px; margin-bottom: 3px; }
.batch-row .batch-location, .batch-row .batch-operation { font-size: 12px; line-height: 1.5; margin-top: 2px; }
.batch-row .workflow-label { font-size: 11px; padding: 1px 5px; }
.batch-row .batch-identity .workflow-selected-statuses { margin: 3px 0 0; }
.batch-row .batch-open { font-size: 12px; }
.shared-analysis-link > span { display: block; line-height: 1.5; }
.batch-row .status-badge { font-size: 11px; padding: 1px 5px; }
@media (max-width: 1100px) { .batch-row { grid-template-columns: minmax(170px, .85fr) minmax(200px, 1fr) minmax(260px, 1.3fr); } .batch-open { grid-column: 1 / -1; } }
@media (max-width: 850px) { .batch-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .batch-operations { grid-column: 1 / -1; } }
@media (max-width: 540px) { .batch-row { grid-template-columns: minmax(0, 1fr); gap: 8px; } .batch-operations { grid-column: auto; } }

/* Review improvements use existing cards and disclosure controls. */
.matching-records { display: grid; gap: 9px; margin: 16px 0; }
.matching-records a, .grant-project-link { display: block; overflow-wrap: anywhere; }
.activity-record-link { display: inline-block; margin-top: 8px; }
.audit-changes { margin-top: 10px; }
.audit-changes dl { display: grid; gap: 12px; margin: 12px 0; }
.audit-changes dt { font-weight: 600; }
.audit-changes dd { margin: 4px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.change-before { color: var(--muted); }
.reconcile-control { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 20px; }
.reconcile-control input { flex-shrink: 0; margin-top: 4px; }
.drawer-close { display: none; }
.conflict-notice:focus, .validation-summary:focus, #comment-error:focus { outline: 3px solid var(--green); outline-offset: 4px; }
@media (max-width: 760px) {
  body.js-enabled .sidebar .drawer-close { display: block; margin: 0 0 18px; }
  .sidebar.is-open { width: min(300px, calc(100vw - 36px)); }
  body:not(.js-enabled) .sidebar .profile { flex-wrap: wrap; }
}

.recovery-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin: 20px 0; }
body:not(.js-enabled) .draft-back { display: none; }

[hidden] { display: none !important; }
.reconcile-control input { width: 18px; min-height: 18px; padding: 0; }
.project-access-options input:disabled + span { opacity: .65; }

.recovery-draft { text-align: left; margin: 24px 0; }
.recovery-draft .form-field { margin: 18px 0; }
.recovery-draft textarea { white-space: pre-wrap; }
.recovery-draft .copy-button { margin-top: 6px; }

/* Registration and authenticator setup. */
.auth-page { min-height: 100vh; display: grid; place-items: center; padding: 32px 20px; }
.auth-card { width: min(100%, 560px); padding: 32px; }
.auth-card > .brand { margin-bottom: 32px; }
.auth-card h1 { font-size: 28px; line-height: 1.25; margin: 16px 0; }
.auth-card p { margin: 16px 0; }
.auth-qr { display: block; width: 240px; max-width: 100%; height: auto; margin: 24px auto; }
.auth-secret { display: block; overflow-wrap: anywhere; margin: 16px 0; }
.auth-actions { display: flex; align-items: end; gap: 12px; flex-wrap: wrap; }
.recovery-codes { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 24px 0; }
.recovery-codes code { font-size: 13px; overflow-wrap: anywhere; }
.panel-help { padding: 0 24px 16px; }
@media (max-width: 520px) { .auth-card { padding: 24px 20px; } .recovery-codes { grid-template-columns: 1fr; } }
.auth-card > .brand { color: var(--ink); }
.auth-card > .brand small { color: var(--muted); }
/* Optional sample sheets and researcher-defined metadata. */
.optional-label { font-size: .72rem; font-weight: 500; color: var(--muted, #66788a); margin-left: .5rem; }
.sample-editor, .custom-fields-editor { border-top: 1px solid var(--border, #dfe6dc); padding-top: 1.5rem; }
.sample-upload-box { background: #f3f7ef; border: 1px dashed #b1c4a9; border-radius: 10px; padding: 1.2rem; }
.sample-upload-box label, [data-manual-editor] > label { display: block; font-weight: 600; margin-bottom: .6rem; }
.sample-upload-box input { max-width: 100%; }
.sample-mapping-grid { margin: 1rem 0; }
.sample-column-fields { border: 1px solid #dfe6dc; border-radius: 8px; padding: 1rem; margin-bottom: 1rem; }
[data-sample-columns] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem 1.2rem; max-height: 340px; overflow: auto; }
.sample-column-choice { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: .65rem; }
.sample-column-choice label { display: flex; align-items: center; gap: .4rem; font-size: .8rem; }
.sample-column-choice input[type="checkbox"] { width: auto; }
.sample-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; margin: 1rem 0; }
.sample-summary > div { display: flex; flex-direction: column; }
.sample-summary strong { font-size: 1.65rem; color: #00614e; }
.sample-summary span, .sample-summary p { font-size: .85rem; color: #62716b; }
.sample-summary p { overflow-wrap: anywhere; }
.sample-table-scroll { max-width: 100%; overflow: auto; max-height: 460px; margin: 1rem 0; }
.sample-table-scroll table { width: 100%; border-collapse: collapse; font-size: .85rem; }
.sample-table-scroll th, .sample-table-scroll td { padding: .65rem .8rem; text-align: left; border-bottom: 1px solid #dfe6dc; min-width: 130px; max-width: 320px; overflow-wrap: anywhere; }
.sample-table-scroll th { background: #edf6e9; position: sticky; top: 0; }
.sample-tools { display: flex; flex-wrap: wrap; gap: .65rem; margin: 1rem 0; }
[data-manual-editor] textarea { width: 100%; }
.custom-field-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) auto; gap: 1rem; align-items: start; margin-bottom: 1rem; }
.custom-field-row label { display: flex; flex-direction: column; gap: .5rem; font-weight: 600; font-size: .85rem; }
.custom-field-row button { margin-top: 1.6rem; }
.custom-fields-list { margin-top: 1.2rem; }
.custom-field-row input, .custom-field-row textarea { font-weight: 400; }
.sample-information { padding-bottom: 22px; }
.sample-information > .sample-summary, .sample-information > .field-help, .sample-information > details, .sample-information > p, .sample-information > .custom-fields-list { margin-left: 22px; margin-right: 22px; }
.sample-editor .field-help, .sample-information .field-help { color: var(--muted); }
.sample-ai-details, .sample-standard-review { background: #f3f7ef; border: 1px solid #dfe6dc; border-radius: 8px; padding: 1rem; margin: 1rem 0; }
.sample-ai-details summary, .sample-standard-review summary { cursor: pointer; font-weight: 600; }
.sample-review-check { display: flex; align-items: start; gap: .6rem; margin: 1rem 0; font-size: .9rem; }
.sample-review-check input { width: auto; flex-shrink: 0; margin-top: .25rem; }
#sample-format-name { display: block; max-width: 420px; margin-top: .5rem; }
@media (max-width: 760px) {
  [data-sample-columns], .custom-field-row { grid-template-columns: minmax(0, 1fr); }
  .custom-field-row button { margin-top: 0; justify-self: start; }
  .sample-information .panel-heading { align-items: start; flex-direction: column; gap: .65rem; }
}

/* Personal request coordination uses the existing catalogue panels and tables. */
.work-view-switch { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; }
.work-view-switch [aria-current="page"] { background: var(--leaf); color: #fff; }
.personal-filters { display: flex; flex: 1 1 100%; flex-wrap: wrap; gap: 12px 22px; }
.personal-filters label { display: flex; align-items: center; gap: 7px; font-size: 13px; }
.personal-filters input { width: 17px; height: 17px; }
.request-table td { vertical-align: top; }
.request-table td:nth-child(6) { min-width: 220px; max-width: 340px; overflow-wrap: anywhere; }
.due-overdue, .table-secondary.due-overdue { color: #9b381e; font-weight: 650; }
.request-recorded-issue { padding: 14px 22px; border-top: 1px solid var(--line); }
.request-inbox-update { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; border-bottom: 1px solid var(--line); }
.request-inbox-update.update-unread { border-left: 4px solid var(--leaf); }
@media (max-width: 640px) { .request-inbox-update { flex-wrap: wrap; } }
.request-table-compact { table-layout: fixed; }
.request-table-compact th { white-space: normal; overflow-wrap: anywhere; }
.request-table-compact td, .request-table-compact td:first-child, .request-table-compact td:last-child { min-width: 0; overflow-wrap: anywhere; }
.request-table-compact th:first-child { width: 28%; }
.request-table-compact th:nth-child(2) { width: 23%; }
.request-table-compact th:nth-child(3) { width: 19%; }
.request-table-compact th:nth-child(4) { width: 30%; }
.request-table-compact .badge { margin-top: 6px; }
@media (max-width: 640px) {
  .request-table-compact thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .request-table-compact tbody, .request-table-compact tr, .request-table-compact td { display: block; width: 100%; }
  .request-table-compact tr { border-bottom: 1px solid var(--line); padding: 12px 0; }
  .request-table-compact td { padding: 6px 17px; border: 0; }
  .request-table-compact td:nth-child(2)::before { content: "Requester: "; color: #566e7a; }
  .request-table-compact td:nth-child(3)::before { content: "Created: "; color: #566e7a; }
}