:root {
  color-scheme: dark;
  --bg: #090b10;
  --panel: #11151d;
  --panel-2: #171d27;
  --line: #293240;
  --text: #f5f7fb;
  --muted: #9ca9b8;
  --mint: #62e6b7;
  --violet: #a58cff;
  --amber: #f1bd68;
  --danger: #ff7f8b;
  --radius: 14px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 300px; background: radial-gradient(circle at 20% 0, #172036 0, var(--bg) 38rem); color: var(--text); }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button, .button { min-height: 42px; }
/* WCAG 2.2 target-size minimum (24x24) for the only UA-sized inline controls we author. */
input[type="checkbox"], input[type="radio"] { width: 24px; height: 24px; accent-color: var(--mint); }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 20; padding: .75rem 1rem; background: var(--mint); color: #03110d; }
.skip-link:focus { top: 1rem; }
.forge-shell { min-height: 100vh; display: flex; flex-direction: column; }
.topbar { position: sticky; top: 0; z-index: 10; display: grid; grid-template-columns: auto 1fr auto; gap: 2rem; align-items: center; min-height: 68px; padding: .7rem clamp(1rem, 3vw, 3rem); border-bottom: 1px solid color-mix(in srgb, var(--line), transparent 25%); background: color-mix(in srgb, var(--bg), transparent 8%); backdrop-filter: blur(20px); }
.brand { font-weight: 900; letter-spacing: .22em; color: var(--mint); }
/* WCAG 2.2 2.5.8 target-size minimum: standalone links present at least a 24x24 pointer target. */
.brand, main a:not(.button) { display: inline-flex; align-items: center; min-height: 24px; min-width: 24px; }
.topbar nav, .top-actions, .repo-tabs, .repo-signals, .repo-controls, .form-actions { display: flex; align-items: center; gap: .4rem; }
.topbar nav a, .repo-tabs a { padding: .55rem .75rem; border-radius: 9px; color: var(--muted); }
.topbar nav a:hover, .topbar nav a.active, .repo-tabs a:hover, .repo-tabs a.active { color: var(--text); background: var(--panel-2); }
.button { display: inline-flex; align-items: center; justify-content: center; padding: .65rem 1rem; border: 1px solid var(--line); border-radius: 9px; background: var(--panel-2); color: var(--text); cursor: pointer; }
.button:hover { border-color: var(--violet); }
.button.primary { color: #06140f; border-color: var(--mint); background: var(--mint); font-weight: 750; }
.button.quiet { background: transparent; }
.avatar-link { display: inline-flex; min-height: 38px; align-items: center; padding: 0 .8rem; border: 1px solid var(--line); border-radius: 999px; }
.notice { padding: .7rem clamp(1rem, 3vw, 3rem); border-bottom: 1px solid; }
.notice.amber { color: #2a1a00; background: var(--amber); border-color: #ffd892; }
.page, .repo-page { width: min(1180px, calc(100% - 2rem)); margin: 0 auto; padding: clamp(2rem, 5vw, 4.5rem) 0; flex: 1; }
.page.narrow { width: min(760px, calc(100% - 2rem)); }
.hero, .repo-heading, .page-title, .section-head, .surface-head, .repo-card-head { display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.hero { min-height: 260px; padding: clamp(1.5rem, 4vw, 3.5rem); border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(135deg, color-mix(in srgb, var(--panel), var(--violet) 12%), var(--panel)); }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: .75rem; font-size: clamp(2rem, 5vw, 3.6rem); line-height: 1; letter-spacing: -.045em; }
h2 { margin-bottom: 1rem; }
h3 { margin-bottom: .35rem; }
p { color: var(--muted); line-height: 1.55; }
.eyebrow { margin-bottom: .7rem; color: var(--mint); font: 750 .75rem/1.2 ui-monospace, monospace; letter-spacing: .16em; text-transform: uppercase; }
.section-head { margin: 2.5rem 0 1rem; }
.card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 1rem; }
.repo-card, .form-card, .profile-card, .auth-card, .surface, .empty-state { padding: 1.25rem; border: 1px solid var(--line); border-radius: var(--radius); background: color-mix(in srgb, var(--panel), transparent 3%); }
.repo-card { min-height: 170px; }
.surface > .form-card { margin-bottom: 1rem; }
.settings-list { display: grid; grid-template-columns: minmax(8rem, auto) 1fr; gap: .65rem 1rem; margin: 1rem 0; }
.settings-list dt { color: var(--muted); }
.settings-list dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.repo-name { color: var(--violet); font-weight: 750; }
.repo-meta { display: flex; gap: 1rem; color: var(--muted); font-size: .82rem; }
.status { display: inline-flex; align-items: center; width: max-content; padding: .3rem .55rem; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font: 700 .7rem/1 ui-monospace, monospace; text-transform: uppercase; }
.status.mint { color: var(--mint); border-color: color-mix(in srgb, var(--mint), transparent 50%); }
.status.violet { color: var(--violet); border-color: color-mix(in srgb, var(--violet), transparent 50%); }
.repo-heading { padding-bottom: 1.5rem; }
.repo-heading h1 { font-size: clamp(1.8rem, 4vw, 2.8rem); }
.repo-tabs { overflow-x: auto; border-bottom: 1px solid var(--line); }
.repo-tabs a { flex: 0 0 auto; border-radius: 9px 9px 0 0; }
.surface { margin-top: 1.25rem; }
.surface-row, .file-row, .clone-bar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem; border-bottom: 1px solid var(--line); }
.surface-row:last-child, .file-row:last-child { border-bottom: 0; }
.surface-row p { margin-bottom: 0; }
.settings-stack { display: grid; gap: 1.5rem; }
.member-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .5rem; }
.member-actions select { min-height: 42px; padding: .55rem; color: var(--text); border: 1px solid var(--line); border-radius: 9px; background: var(--bg); }
.inline-feedback { max-width: 16rem; color: var(--danger); font-size: .8rem; }
.button.danger { color: var(--danger); }
.form-feedback code { display: block; margin: .75rem 0; padding: .75rem; overflow-wrap: anywhere; border: 1px solid var(--line); border-radius: 9px; background: var(--bg); }
.file-list, .surface-list, .clone-bar { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.clone-bar { margin-bottom: 1rem; background: var(--panel-2); }
.clone-bar code { overflow: hidden; text-overflow: ellipsis; }
.empty-state { display: grid; justify-items: center; padding: 3.5rem 1rem; text-align: center; }
.empty-mark { margin-bottom: 1rem; color: var(--violet); font-size: 2.7rem; }
.field { display: grid; gap: .45rem; margin-bottom: 1rem; color: var(--muted); font-size: .86rem; }
.field input, .field textarea, .field select { width: 100%; padding: .8rem .9rem; color: var(--text); border: 1px solid var(--line); border-radius: 9px; background: var(--bg); }
/* Focus indicators composite to >= 3:1 against --bg (WCAG 1.4.11); wcag-contrast-tokens.test.mjs verifies the math. */
.field input:focus, .field textarea:focus, .field select:focus { outline: 3px solid color-mix(in srgb, var(--violet), transparent 25%); border-color: var(--violet); }
.form-feedback { min-height: 1.5rem; margin: .75rem 0 0; }
.auth-page { flex: 1; display: grid; place-items: center; padding: 2rem 1rem; }
.auth-card { width: min(480px, 100%); display: grid; gap: .75rem; padding: 2rem; }
.auth-card .button { width: 100%; }
.profile-card { display: grid; justify-items: center; text-align: center; }
.profile-avatar { display: grid; place-items: center; width: 92px; height: 92px; margin-bottom: 1rem; border-radius: 28px; color: #09100e; background: var(--mint); font-size: 2.5rem; font-weight: 850; }
footer { display: flex; justify-content: space-between; gap: 1rem; padding: 1.2rem clamp(1rem, 3vw, 3rem); color: var(--muted); border-top: 1px solid var(--line); font-size: .78rem; }
.boot-card { min-height: 100vh; display: grid; place-content: center; text-align: center; }

/* Code, history, and review surfaces */
.breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; padding: .5rem 0; font: 600 .85rem/1.4 ui-monospace, monospace; }
.breadcrumbs a { color: var(--violet); padding: .3rem .5rem; border-radius: 6px; justify-content: center; }
.breadcrumbs a:hover, .breadcrumbs a:focus { background: var(--panel-2); }
.code-block { margin: 0 0 1rem; padding: 1rem; overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-2); font: .85rem/1.6 ui-monospace, monospace; white-space: pre; }
.code-block:focus { outline: 3px solid color-mix(in srgb, var(--violet), transparent 25%); }
.code-editor { width: 100%; padding: 1rem; color: var(--text); border: 1px solid var(--line); border-radius: 10px; background: var(--bg); font: .85rem/1.6 ui-monospace, monospace; }
.file-list { list-style: none; margin: 0; padding: 0; }
.file-row a { color: var(--text); font-weight: 650; overflow-wrap: anywhere; }
.file-row a:hover, .file-row a:focus { color: var(--violet); }
.file-view-head, .editor-panel { margin-bottom: 1rem; }
.file-meta { display: flex; flex-wrap: wrap; gap: .4rem; }
.plain-list { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .5rem; }
.diff-list { display: grid; gap: 1rem; }
.diff-entry h4 { display: flex; align-items: center; gap: .5rem; margin-bottom: .5rem; overflow-wrap: anywhere; }
.diff-position { font-size: .78rem; }
.diff-block { padding: .5rem 1rem; }
/* Diff semantics are carried by the +/- text prefixes and aria labels; color is reinforcement only. */
.diff-line.added { color: var(--mint); }
.diff-line.removed { color: var(--danger); }
.history-detail { flex-basis: 100%; }
.history-row { flex-wrap: wrap; }
.collision-panel:not(:empty) { margin-bottom: 1.25rem; padding: 1rem; border: 1px solid color-mix(in srgb, var(--amber), transparent 45%); border-radius: var(--radius); }
.status.amber { color: var(--amber); border-color: color-mix(in srgb, var(--amber), transparent 50%); }
/* Boards, wiki, search, governance */
.board-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 1rem; margin-bottom: 1rem; }
.board-column { padding: .75rem; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-2); }
.board-card { padding: .65rem; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.board-card h5, .surface-row h4, .surface-row h5 { margin: 0 0 .3rem; }
.search-form { margin-bottom: 1rem; }
.search-summary { font-size: .85rem; }
.evidence-actions { margin-top: .5rem; }
.member-actions input, .form-actions input { min-height: 42px; padding: .55rem .7rem; color: var(--text); border: 1px solid var(--line); border-radius: 9px; background: var(--bg); }
.governance-surface h3, .value-surface h3 { margin-top: 1.75rem; }
.release-composers { display: grid; gap: 1rem; margin-bottom: 1.25rem; }

@media (max-width: 760px) {
  .topbar { grid-template-columns: 1fr auto; gap: .5rem; }
  .topbar nav { grid-column: 1 / -1; order: 3; overflow-x: auto; }
  .top-actions .button.quiet { display: none; }
  .hero, .repo-heading, .page-title { align-items: flex-start; flex-direction: column; }
  .repo-signals { flex-wrap: wrap; }
  footer { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; } }
@media (forced-colors: active) { .status, .button, .repo-card, .surface { border: 1px solid CanvasText; } }