@font-face {
  font-family: Aeonik;
  src: url('/assets/fonts/AeonikPro-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: Aeonik;
  src: url('/assets/fonts/AeonikPro-Medium.woff2') format('woff2');
  font-weight: 500;
  font-display: swap;
}

:root {
  --landing-zoom: 1.25;
  --ink: #0c0c0c;
  --cream: #faf9f5;
  --white: #ffffff;
  --mist: #f4f4f1;
  --stone: #e0e0dd;
  --line: rgba(12, 12, 12, 0.11);
  --line-strong: rgba(12, 12, 12, 0.28);
  --muted: rgba(12, 12, 12, 0.62);
  --inverse-muted: rgba(250, 249, 245, 0.64);
  --green: #4d7235;
  --green-soft: #e9efe5;
  --teal: #185771;
  --teal-soft: #e8f0f3;
  --amber: #855400;
  --amber-soft: #fff3d2;
  --orange: #b4512b;
  --orange-soft: #f7e9df;
  --red: #9b2c2c;
  --red-soft: #f7e9e7;
  --radius-card: 20px;
  --radius-control: 12px;
  --sans: Aeonik, "Helvetica Neue", Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: clip;
  background: var(--cream);
  color: var(--ink);
  font: 400 16px/1.45 var(--sans);
  -webkit-font-smoothing: antialiased;
}
body.drawer-open { overflow: hidden; }
button, input, select { font: inherit; color: inherit; }
button, a { touch-action: manipulation; }
a { color: inherit; }
strong { font-weight: 500; }
p { overflow-wrap: anywhere; }
[hidden] { display: none !important; }
.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;
}
.mono { font: 400 12px/1.45 var(--mono); font-variant-numeric: tabular-nums; }
.muted { color: var(--muted); }
.link-inline { border: 0; padding: 0; background: none; color: var(--teal); font: inherit; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.link-inline:hover { color: var(--ink); }
.small { font-size: 13px; }
.skip-link {
  position: fixed;
  left: 16px;
  top: -80px;
  z-index: 200;
  padding: 11px 16px;
  border-radius: 999px;
  background: var(--ink);
  color: var(--cream);
}
.skip-link:focus { top: 16px; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.sidebar :focus-visible, .access-panel :focus-visible { outline-color: var(--cream); }

/* Shell and navigation */
.topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  min-height: 72px;
  padding: 0 24px;
  border-bottom: 1px solid var(--line);
  background: var(--cream);
}
.brand, .workspace-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  text-decoration: none;
}
.brand-mark-primary, .brand-mark { display: block; width: 48px; height: 48px; object-fit: contain; }
.product-name { display: inline-flex; align-items: flex-start; gap: 5px; white-space: nowrap; font-size: 16px; line-height: 1.2; }
.product-beta { position: relative; top: -0.1em; font: 500 8px/1 var(--mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.product-beta.inverse { color: var(--inverse-muted); }
.shell { display: grid; grid-template-columns: 264px minmax(0, 1fr); min-height: 100dvh; }
.mobile-nav-backdrop { display: none; }
.sidebar {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  flex-direction: column;
  height: 100dvh;
  min-width: 0;
  padding: 20px 14px 14px;
  border-right: 1px solid rgba(250, 249, 245, 0.14);
  background: var(--ink);
  color: var(--cream);
}
.sidebar-head { display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; gap: 12px; padding: 0 4px 24px; }
.workspace-brand, .workspace-brand .product-name { min-width: 0; }
.sidebar-toggle {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(250, 249, 245, 0.2);
  border-radius: 999px;
  background: transparent;
  color: var(--cream);
  cursor: pointer;
}
.sidebar-toggle svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.primary-nav { display: grid; gap: 6px; }
.primary-nav a {
  position: relative;
  display: flex;
  align-items: center;
  gap: 13px;
  min-height: 48px;
  padding: 11px 14px;
  border-radius: 12px;
  color: var(--inverse-muted);
  text-decoration: none;
}
.primary-nav a:hover { color: var(--cream); }
.primary-nav a.active { background: rgba(250, 249, 245, 0.1); color: var(--cream); }
.primary-nav a.active::after { content: ""; position: absolute; right: 14px; width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.primary-nav svg { width: 18px; height: 18px; fill: currentColor; flex: 0 0 auto; }
.sidebar-account { position: relative; margin-top: auto; padding-top: 14px; border-top: 1px solid rgba(250, 249, 245, 0.14); }
.profile-button {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 56px;
  padding: 6px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: var(--cream);
  text-align: left;
  cursor: pointer;
}
.profile-button:hover { background: rgba(250, 249, 245, 0.08); }
.profile-avatar, .profile-avatar img, .profile-avatar > span { width: 42px; height: 42px; border-radius: 50%; }
.profile-avatar { display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(250, 249, 245, 0.22); }
.profile-avatar img { object-fit: cover; }
.profile-avatar > span { display: grid; place-items: center; font: 500 11px var(--mono); }
.profile-copy { display: grid; gap: 2px; min-width: 0; }
.profile-copy strong, .profile-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-copy small { color: var(--inverse-muted); font-size: 11px; }
.profile-chevron { color: var(--inverse-muted); letter-spacing: 2px; }
.account-menu {
  position: absolute;
  right: 0;
  bottom: 68px;
  z-index: 80;
  width: 224px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--white);
  color: var(--ink);
}
.account-menu-head { display: grid; gap: 2px; padding: 10px 10px 12px; border-bottom: 1px solid var(--line); }
.account-menu-head span { color: var(--muted); font-size: 12px; }
.account-menu button { width: 100%; min-height: 44px; padding: 10px; border: 0; border-radius: 8px; background: transparent; text-align: left; cursor: pointer; }
.account-menu button:hover { background: var(--mist); }
body.sidebar-collapsed .shell { grid-template-columns: 84px minmax(0, 1fr); }
body.sidebar-collapsed .sidebar-head { grid-template-columns: 1fr; }
body.sidebar-collapsed .workspace-brand { justify-content: center; }
body.sidebar-collapsed .workspace-brand .product-name,
body.sidebar-collapsed .primary-nav span,
body.sidebar-collapsed .profile-copy,
body.sidebar-collapsed .profile-chevron { display: none; }
body.sidebar-collapsed .sidebar-toggle { margin: 4px auto 0; transform: rotate(180deg); }
body.sidebar-collapsed .primary-nav a { justify-content: center; padding-inline: 0; }
body.sidebar-collapsed .primary-nav a.active::after { right: 8px; }
body.sidebar-collapsed .profile-button { grid-template-columns: 1fr; justify-items: center; }
body.sidebar-collapsed .account-menu { left: calc(100% + 12px); right: auto; bottom: 0; }

/* Shared layout and primitives */
main#main { min-width: 0; padding: 40px clamp(28px, 4vw, 56px) 72px; }
.view { width: min(100%, 1240px); margin: 0 auto; }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; margin-bottom: 32px; }
.page-heading h1 { margin: 6px 0 10px; font-size: clamp(48px, 4.6vw, 64px); line-height: 1; letter-spacing: -0.035em; font-weight: 500; }
.page-heading > div > p:last-child { max-width: 660px; margin: 0; color: var(--muted); font-size: 17px; }
.eyebrow, th, .run-label { margin: 0; font: 400 11px/1.4 var(--mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
h2 { margin: 6px 0 10px; font-size: 24px; line-height: 1.2; font-weight: 500; }
h3 { margin: 4px 0 8px; font-size: 19px; line-height: 1.25; font-weight: 500; }
.primary, .secondary, .button, .scan-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 9px 18px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}
.primary, .scan-action { border-color: var(--green); background: var(--green); color: var(--cream); }
.secondary { background: var(--white); color: var(--ink); }
.primary:hover, .secondary:hover, .scan-action:hover { opacity: 0.84; }
button:disabled, [aria-disabled="true"] { opacity: 0.46; cursor: not-allowed; }
.heading-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.panel { padding: 24px; border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--white); }
.panel.flush { padding: 0; overflow: hidden; }
.panel-heading, .section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 18px; }
.panel-heading h2, .section-heading h2 { margin-bottom: 0; }
.panel-heading a { min-height: 44px; padding: 10px 2px; color: var(--teal); }
.summary-glyph { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 10px; background: var(--white); }
.summary-glyph svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.tone-active .summary-glyph, .tone-measured .summary-glyph { color: var(--teal); border-color: rgba(24, 87, 113, 0.3); background: var(--teal-soft); }
.tone-success .summary-glyph { color: var(--green); border-color: rgba(77, 114, 53, 0.34); background: var(--green-soft); }
.tone-attention .summary-glyph { color: var(--orange); border-color: rgba(180, 81, 43, 0.34); background: var(--orange-soft); }
.tone-critical .summary-glyph { color: var(--red); border-color: rgba(155, 44, 44, 0.34); background: var(--red-soft); }

/* Overview */
.workspace-ledger { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 24px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); }
.workspace-ledger article { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 14px; min-height: 112px; padding: 20px 24px; border-right: 1px solid var(--line); }
.workspace-ledger article:first-child { padding-left: 0; }
.workspace-ledger article:last-child { border-right: 0; }
.workspace-ledger p { margin: 0; color: var(--muted); font: 400 10px/1.35 var(--mono); letter-spacing: 0.05em; text-transform: uppercase; }
.workspace-ledger strong { display: block; margin-top: 12px; font-size: 38px; line-height: 1; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.trust-strip { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 28px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--white); }
.trust-strip > * { display: grid; gap: 4px; min-width: 0; padding: 13px 16px; border-right: 1px solid var(--line); text-decoration: none; }
.trust-strip > *:last-child { border-right: 0; }
.trust-strip small { color: var(--muted); font: 400 9px var(--mono); letter-spacing: 0.06em; text-transform: uppercase; }
.trust-strip strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.trust-link { color: var(--green); }
.cost-panel { margin-bottom: 28px; }
.economics-heading { align-items: center; }
.economics-controls { display: flex; align-items: center; gap: 14px; }
.economics-toggle { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 999px; background: var(--mist); }
.economics-toggle button { min-height: 40px; padding: 7px 16px; border: 0; border-radius: 999px; background: transparent; font: 500 10px var(--mono); text-transform: uppercase; cursor: pointer; }
.economics-toggle button.active { background: var(--ink); color: var(--cream); }
.cost-chart { height: 220px; }
.cost-chart-svg { display: block; width: 100%; height: 100%; }
.chart-bar { fill: var(--green); }
.cost-chart-svg g:hover .chart-bar { fill: color-mix(in srgb, var(--green) 80%, var(--ink)); }
.chart-bar-zero { fill: color-mix(in srgb, var(--ink) 22%, transparent); }
.chart-baseline { stroke: var(--line-strong); stroke-width: 1; }
.chart-value { font: 400 11px var(--mono); fill: var(--ink); font-variant-numeric: tabular-nums; }
.chart-day { font: 400 9px var(--mono); fill: var(--muted); letter-spacing: 0.08em; }
.cost-empty { display: grid; place-items: center; height: 100%; margin: 0; text-align: center; color: var(--muted); }

/* Repository access */
.access-section { margin-bottom: 28px; padding: 22px 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); }
.section-heading > p { max-width: 520px; margin: 0; color: var(--muted); text-align: right; font-size: 14px; }
.installation-list { display: grid; }
.installation-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 72px; padding: 12px 0; border-top: 1px solid var(--line); }
.installation-identity, .installation-actions { display: flex; align-items: center; gap: 12px; min-width: 0; }
.installation-identity img, .installation-mark { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 50%; object-fit: cover; font: 500 10px var(--mono); }
.installation-identity h3 { margin: 0; }
.installation-identity p, .installation-actions > span { margin: 2px 0 0; color: var(--muted); font-size: 13px; }
.installation-actions { text-align: right; }
.repository-filters { display: grid; grid-template-columns: minmax(220px, 1fr) repeat(3, minmax(150px, 190px)); gap: 12px; align-items: end; margin-bottom: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.repository-filters label, .run-toolbar label { display: grid; gap: 5px; }
.repository-filters label > span, .run-toolbar label > span { color: var(--muted); font: 400 9px var(--mono); letter-spacing: 0.06em; text-transform: uppercase; }
select, input[type="search"], input[type="text"], input[type="number"], .api-token-form input { min-height: 44px; border: 1px solid var(--line); border-radius: 999px; background: var(--white); padding: 9px 14px; line-height: 1.2; }
select { appearance: none; padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%230c0c0c' stroke-width='1.5'%3E%3Cpath d='m6 8 4 4 4-4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 13px center; background-size: 16px 16px; }
.card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 16px; }
.repo-card { display: flex; flex-direction: column; min-width: 0; min-height: 196px; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--white); }
.repo-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.repo-badge { display: inline-flex; align-items: center; gap: 6px; min-height: 24px; padding: 4px 8px; border: 1px solid var(--line); border-radius: 999px; font: 400 9px/1 var(--mono); letter-spacing: 0.04em; text-transform: uppercase; }
.repo-badge i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.visibility-public { color: var(--teal); border-color: rgba(24, 87, 113, 0.32); background: var(--teal-soft); }
.visibility-internal { color: var(--green); border-color: rgba(77, 114, 53, 0.32); background: var(--green-soft); }
.visibility-private { color: var(--ink); background: var(--mist); }
.language-python, .language-javascript, .language-typescript { color: var(--teal); border-color: rgba(24, 87, 113, 0.25); }
.repo-account { margin: 14px 0 0; color: var(--muted); font: 400 10px var(--mono); text-transform: uppercase; }
.repo-card h2 { margin: 6px 0 10px; font-size: 20px; overflow-wrap: anywhere; }
.repo-card > p:not(.repo-account) { margin: 0 0 18px; color: var(--muted); font-size: 14px; }
.repo-card .scan-action { align-self: flex-start; margin-top: auto; }
.scan-action svg { width: 16px; height: 16px; margin-right: 6px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.empty-state { max-width: 720px; padding: 40px; border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--white); }
.empty-state p { color: var(--muted); }

/* Runs */
.run-summary { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 28px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); }
.run-summary > button { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 14px; min-height: 84px; padding: 16px 20px; border: 0; border-right: 1px solid var(--line); background: transparent; text-align: left; cursor: pointer; }
.run-summary > button:last-child { border-right: 0; }
.run-summary > button[aria-pressed="true"] { background: var(--white); }
.run-summary > button > span:last-child { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.run-summary strong { font-size: 34px; line-height: 1; font-variant-numeric: tabular-nums; }
.run-summary > button > span:last-child > span { color: var(--muted); font: 400 10px var(--mono); letter-spacing: 0.04em; text-transform: uppercase; }
.run-toolbar { display: grid; grid-template-columns: minmax(260px, 1fr) 180px 180px; gap: 12px; align-items: end; margin-bottom: 16px; }
.run-search { position: relative; }
.run-search-icon { position: absolute; left: 14px; bottom: 14px; width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 1.7; pointer-events: none; }
.run-search input { width: 100%; padding-left: 38px; }
.table-wrap { min-width: 0; overflow-x: auto; }
.run-table { width: 100%; min-width: 860px; border-collapse: collapse; table-layout: fixed; }
.run-table th, .run-table td { height: 76px; padding: 12px 16px; border-bottom: 1px solid var(--line); vertical-align: middle; text-align: left; }
.run-table th { height: 48px; color: var(--muted); }
.run-table tbody tr:last-child td { border-bottom: 0; }
.run-table tbody tr { cursor: pointer; }
.run-table tbody tr:hover { background: var(--mist); }
.run-table th:nth-child(1), .run-table td:nth-child(1) { width: 22%; }
.run-table th:nth-child(2), .run-table td:nth-child(2) { width: 20%; }
.run-table th:nth-child(3), .run-table td:nth-child(3) { width: 18%; }
.run-table th:nth-child(4), .run-table td:nth-child(4) { width: 13%; text-align: right; }
.run-table th:nth-child(5), .run-table td:nth-child(5) { width: 7%; text-align: right; }
.run-table th:nth-child(6), .run-table td:nth-child(6) { width: 17%; }
.run-table th:nth-child(7), .run-table td:nth-child(7) { width: 3%; text-align: center; }
.run-row-button { display: grid; align-content: center; gap: 7px; width: 100%; min-height: 44px; padding: 0; border: 0; background: transparent; text-align: left; cursor: pointer; }
#overview-runs .run-table { min-width: 0; }
.run-row-button strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.run-receipt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 10px; }
.run-status { display: inline-flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; font-size: 14px; white-space: nowrap; }
.run-status strong { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.run-table td.run-state { padding-right: 20px; }
.run-status i { width: 9px; height: 9px; border: 1px solid currentColor; border-radius: 50%; background: currentColor; flex: 0 0 auto; }
.run-status.tone-active { color: var(--teal); }
.run-status.tone-success { color: var(--green); }
.run-status.tone-attention { color: var(--orange); }
.run-status.tone-danger { color: var(--red); }
.run-status.tone-neutral i { background: transparent; }
.run-status.tone-success i { position: relative; display: grid; place-items: center; width: 13px; height: 13px; border-color: var(--green); background: var(--green); color: var(--white); }
.run-status.tone-success i::after { content: "✓"; font: 500 9px/1 var(--sans); }
.run-status.tone-attention i, .run-status.tone-danger i { width: 12px; height: 12px; border-radius: 2px; transform: rotate(45deg); }
.profile-badge, .model-cell { display: inline-flex; align-items: center; gap: 9px; min-width: 0; }
.profile-badge strong, .model-cell > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.model-mark { display: grid; place-items: center; width: 30px; height: 30px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 8px; background: var(--white); font: 500 9px var(--mono); }
.model-mark img { width: 18px; height: 18px; object-fit: contain; }
.model-mark-kimi { border-color: var(--ink); background: var(--ink); }
.model-mark-kimi img { filter: brightness(0) invert(1); }
.run-tokens strong, .run-cost strong, .run-started strong { font-variant-numeric: tabular-nums; white-space: nowrap; }
.run-started { font-size: 13px; }
.run-started span { display: block; margin-top: 3px; font-size: 11px; }
.run-open { color: var(--muted); }
.run-pagination { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 14px; }
.run-pagination > div { display: flex; gap: 8px; }

/* Findings: preserve the approved production palette and structure. */
.finding-summary { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 20px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); }
.finding-summary .summary-card { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 14px; min-height: 84px; padding: 14px 20px; border-right: 1px solid var(--line); }
.finding-summary .summary-card:last-child { border-right: 0; }
.finding-summary strong { display: block; font-size: 32px; }
.finding-summary small { color: var(--muted); }
.finding-workflow { display: none; }
.finding-toolbar { display: grid; gap: 12px; margin-bottom: 18px; }
.finding-search input { width: 100%; }
.filter-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.filter { min-height: 44px; padding: 8px 14px; border: 1px solid var(--line); border-radius: 999px; background: transparent; font: 400 10px var(--mono); text-transform: uppercase; cursor: pointer; }
.filter.active { border-color: var(--ink); background: var(--ink); color: var(--cream); }
.finding-list { display: grid; gap: 14px; }
.finding { display: grid; grid-template-columns: 150px minmax(0, 1fr) 160px; gap: 22px; padding: 22px; border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--white); }
.finding-register, .finding-body, .finding-decision { min-width: 0; }
.finding-index { margin: 0 0 14px; color: var(--muted); font: 400 11px var(--mono); }
.finding-signals { display: grid; gap: 7px; justify-items: start; }
.severity, .confidence, .decision-state { display: inline-flex; align-items: center; gap: 6px; min-height: 26px; padding: 5px 8px; border: 1px solid var(--line); border-radius: 999px; font: 400 9px/1 var(--mono); text-transform: uppercase; }
.severity i, .confidence i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.severity-critical, .severity-high { color: var(--red); border-color: rgba(155, 44, 44, 0.34); background: var(--red-soft); }
.severity-medium { color: #8e421b; border-color: rgba(142, 66, 27, 0.32); background: var(--orange-soft); }
.severity-low, .severity-info { color: var(--amber); border-color: rgba(133, 84, 0, 0.3); background: var(--amber-soft); }
.confidence-high { color: var(--teal); border-color: rgba(24, 87, 113, 0.3); background: var(--teal-soft); }
.confidence-medium { color: #575d6b; background: #edeef1; }
.confidence-low, .confidence-unrated { color: var(--amber); background: var(--amber-soft); }
.finding-location { display: flex; align-items: flex-start; gap: 6px; margin-top: 14px; }
.finding-path { min-width: 0; margin: 7px 0 0; color: var(--muted); overflow-wrap: anywhere; }
.finding-location .finding-icon { width: 40px; height: 40px; flex: 0 0 auto; }
.finding-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.finding-title h2 { margin-top: 4px; }
.finding-summary-copy { margin: 0 0 12px; color: var(--muted); }
.decision-state svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.decision-state.status-open, .finding-decision select.status-open { color: var(--amber); border-color: rgba(133, 84, 0, 0.34); background: var(--amber-soft); }
.decision-state.status-accepted, .finding-decision select.status-accepted { color: var(--red); border-color: rgba(155, 44, 44, 0.34); background: var(--red-soft); }
.decision-state.status-fixed, .finding-decision select.status-fixed { color: var(--green); border-color: rgba(77, 114, 53, 0.34); background: var(--green-soft); }
.decision-state.status-false-positive, .finding-decision select.status-false-positive { color: var(--teal); border-color: rgba(24, 87, 113, 0.34); background: var(--teal-soft); }
.finding-evidence-details { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--cream); }
.finding-evidence-details > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; padding: 8px 12px; cursor: pointer; list-style: none; color: var(--teal); font-weight: 500; }
.finding-evidence-details > summary::-webkit-details-marker { display: none; }
.finding-evidence-details > summary i::after { content: "+"; font: 400 18px/1 var(--mono); font-style: normal; }
.finding-evidence-details[open] > summary { border-bottom: 1px solid var(--line); }
.finding-evidence-details[open] > summary i::after { content: "−"; }
.finding-evidence { display: grid; gap: 14px; padding-top: 10px; }
.finding-evidence section { padding: 2px 12px 12px; border-bottom: 1px solid var(--line); }
.finding-evidence section:last-child { border-bottom: 0; }
.finding-evidence p { margin: 6px 0 0; }
.finding-section-label { color: var(--muted); font: 400 10px var(--mono); text-transform: uppercase; }
.finding-decision label { display: grid; gap: 6px; }
.finding-decision label > span { color: var(--muted); font: 400 10px var(--mono); text-transform: uppercase; }
.finding-decision select { width: 100%; border-radius: 10px; }
.finding-actions { display: flex; gap: 8px; margin-top: 12px; }
.finding-icon, .action-icon, .icon-button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--white); cursor: pointer; }
.finding-icon svg, .action-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.finding-more { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 16px; }

/* Account, developer and credits routes */
.account-trust-band { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 20px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); }
.account-trust-band > div { display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: center; gap: 14px; min-height: 92px; padding: 16px 24px; border-right: 1px solid var(--line); }
.account-trust-band > div:first-child { padding-left: 0; }
.account-trust-band > div:last-child { border-right: 0; }
.trust-icon { display: grid; place-items: center; width: 48px; height: 48px; overflow: hidden; border: 1px solid var(--line); border-radius: 50%; font: 500 10px var(--mono); }
.trust-icon img { width: 100%; height: 100%; object-fit: cover; }
.trust-icon-source { color: var(--green); border-color: rgba(77, 114, 53, 0.32); background: var(--green-soft); }
.trust-icon-source svg { width: 26px; height: 26px; fill: none; stroke: var(--green); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.account-trust-band p { display: grid; gap: 2px; margin: 0; }
.account-trust-band small { color: var(--muted); font: 400 9px var(--mono); text-transform: uppercase; }
.account-trust-band span:not(.trust-icon) { color: var(--muted); font-size: 13px; }
.boundary-flow { display: grid; grid-template-columns: repeat(7, auto); align-items: center; justify-content: center; gap: 10px; margin-bottom: 16px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: var(--white); }
.boundary-flow span { display: inline-flex; align-items: center; justify-content: center; min-height: 32px; padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px; font: 400 10px var(--mono); text-align: center; text-transform: uppercase; }
.boundary-flow b { color: var(--muted); }
.trust-fact-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); }
.trust-fact { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 14px; padding: 24px 24px 24px 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.trust-fact:nth-child(even) { padding-left: 24px; border-right: 0; }
.trust-fact-index { color: var(--muted); font: 400 11px var(--mono); }
.trust-fact h2 { font-size: 21px; }
.trust-fact p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: 14px; }
.trust-detail { margin-top: 14px; }
.trust-detail summary { min-height: 44px; cursor: pointer; font-size: 13px; font-weight: 500; }
.model-route-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; padding: 0; list-style: none; }
.model-route-list li { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 5px 10px 5px 5px; border: 1px solid var(--line); border-radius: 999px; background: var(--white); }
.model-route-list li span { display: grid; }
.model-route-list small { color: var(--muted); font-size: 10px; }
.trust-badges { display: flex; gap: 8px; margin: 12px 0; }
.trust-badges span, .security-note, .billing-checkout-badge { display: inline-flex; align-items: center; min-height: 26px; padding: 5px 8px; border: 1px solid var(--line); border-radius: 999px; color: var(--teal); font: 400 9px var(--mono); text-transform: uppercase; }
.api-endpoint-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; padding: 14px 18px; border: 1px solid rgba(24, 87, 113, 0.28); border-radius: 14px; background: var(--teal-soft); }
.api-endpoint-card span { display: grid; gap: 4px; min-width: 0; }
.api-endpoint-card small { color: var(--muted); font: 400 9px var(--mono); text-transform: uppercase; }
.api-endpoint-card code { overflow-wrap: anywhere; font: 400 13px var(--mono); }
.developer-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.developer-token-panel, .developer-mcp-panel { min-width: 0; }
.api-token-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 10px; margin-top: 18px; }
.api-token-form label { display: grid; gap: 5px; }
.api-token-form label span { color: var(--muted); font: 400 9px var(--mono); text-transform: uppercase; }
.api-token-created { margin-top: 16px; padding: 14px; border: 1px solid rgba(24, 87, 113, 0.3); border-radius: 12px; background: var(--teal-soft); }
.api-token-created p { margin: 4px 0 10px; color: var(--muted); font-size: 13px; }
.api-token-created > div { display: flex; align-items: center; gap: 8px; }
.api-token-created code { min-width: 0; flex: 1; padding: 10px; overflow-wrap: anywhere; border-radius: 8px; background: var(--white); font: 400 11px var(--mono); }
.api-token-list { display: grid; margin-top: 14px; }
.api-token-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; border-top: 1px solid var(--line); }
.api-token-row span { display: grid; gap: 2px; }
.api-token-row small { color: var(--muted); }
.mcp-steps { display: grid; gap: 0; margin: 8px 0 16px; padding: 0; list-style: none; counter-reset: step; }
.mcp-steps li { display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: start; gap: 12px; min-height: 64px; padding: 10px 0; border-top: 1px solid var(--line); }
.mcp-steps li > span { display: grid; place-items: center; align-self: center; width: 26px; height: 26px; border-radius: 50%; background: var(--ink); color: var(--cream); font: 400 10px var(--mono); }
.mcp-steps li > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; min-width: 0; min-height: 44px; }
.mcp-steps li > div > small { max-width: 240px; justify-self: end; }
.mcp-steps li:last-child > div { grid-template-columns: 1fr; align-content: center; }
.mcp-steps li:last-child > div > small { max-width: none; justify-self: start; }
.mcp-steps small { color: var(--muted); font-size: 12px; }
.mcp-config-preview { max-height: 260px; margin: 0; padding: 14px; overflow: auto; border-radius: 12px; background: var(--ink); color: var(--cream); white-space: pre-wrap; overflow-wrap: anywhere; font: 400 11px/1.55 var(--mono); }
.credits-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.85fr); gap: 16px; align-items: start; }
.credits-primary { display: grid; gap: 18px; }
.credits-secondary { display: grid; gap: 16px; }
.billing-balance { display: grid; grid-template-columns: 1.5fr 1fr; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); }
.billing-balance > div { display: grid; gap: 5px; padding: 16px 0; }
.billing-balance > div + div { padding-left: 18px; border-left: 1px solid var(--line); }
.billing-balance span { color: var(--muted); font: 400 9px var(--mono); text-transform: uppercase; }
.billing-balance strong { font-size: 24px; font-variant-numeric: tabular-nums; }
.billing-balance-primary strong { color: var(--green); font-size: 38px; }
.billing-payment-status, .billing-transition-note { margin: 0; padding: 11px 13px; border-left: 2px solid var(--green); background: var(--mist); font-size: 13px; }
.billing-pending-payment { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; }
.billing-pending-payment span { display: grid; gap: 2px; }
.billing-pending-payment small { color: var(--muted); }
.billing-topups { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.credit-option { display: grid; gap: 4px; min-height: 68px; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--white); text-align: left; cursor: pointer; }
.credit-option:hover, .credit-option[aria-pressed="true"] { border-color: var(--teal); background: var(--teal-soft); }
.credit-option span { color: var(--muted); font: 400 8px var(--mono); text-transform: uppercase; }
.credit-option strong { font-size: 18px; }
.billing-custom-form { display: grid; gap: 6px; margin-top: 12px; }
.billing-custom-form > label { color: var(--muted); font: 400 9px var(--mono); text-transform: uppercase; }
.billing-custom-control { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; overflow: hidden; border: 1px solid var(--line); border-radius: 999px; background: var(--white); }
.billing-custom-control > span { padding-left: 16px; color: var(--muted); }
.billing-custom-control input { min-width: 0; border: 0; outline: 0; background: transparent; font-size: 18px; }
.billing-custom-control .primary { margin: 3px; min-height: 40px; }
.billing-rates { padding: 0; overflow: hidden; }
.billing-rates > summary { display: flex; align-items: center; justify-content: space-between; min-height: 54px; padding: 13px 16px; cursor: pointer; list-style: none; }
.billing-rates > summary::-webkit-details-marker { display: none; }
.billing-rates > summary span { display: grid; gap: 2px; }
.billing-rates > summary small { color: var(--muted); font-size: 11px; }
.billing-rates > summary::after { content: "+"; font: 400 18px var(--mono); }
.billing-rates[open] > summary::after { content: "−"; }
.billing-plans { border-top: 1px solid var(--line); }
.billing-plan { display: grid; gap: 10px; padding: 13px 16px; border-bottom: 1px solid var(--line); }
.billing-plan:last-child { border-bottom: 0; }
.billing-plan > div { display: grid; gap: 3px; }
.billing-plan > div > small { color: var(--muted); }
.billing-plan dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 0; }
.billing-plan dt { color: var(--muted); font: 400 8px var(--mono); text-transform: uppercase; }
.billing-plan dd { margin: 2px 0 0; font-size: 12px; }
.billing-ledger-section h2 { font-size: 20px; }
.billing-ledger-section { min-height: 0; }
.billing-ledger { display: grid; align-content: start; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.billing-ledger > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; border-top: 1px solid var(--line); }
.billing-ledger span { display: grid; gap: 2px; }
.billing-ledger small { color: var(--muted); font-size: 11px; }
.billing-ledger b { font-weight: 500; font-variant-numeric: tabular-nums; }

/* Public landing */
.sign-in { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(380px, 0.85fr); min-height: calc(100dvh - 72px); background: var(--cream); }
.sign-in-copy { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: space-between; min-width: 0; overflow: hidden; padding: clamp(48px, 6vw, 88px) clamp(32px, 7vw, 104px) 40px; }
.sign-in-intro { position: relative; z-index: 2; max-width: 780px; }
.sign-in h1 { max-width: 760px; margin: 14px 0 20px; font-size: clamp(48px, 4.8vw, 76px); line-height: 0.98; letter-spacing: -0.04em; font-weight: 500; }
.sign-in-lede { max-width: 640px; margin: 0; color: var(--muted); font-size: 19px; line-height: 1.45; }
.sign-in-cta { display: none; }
.method-list { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(3, 1fr); max-width: 820px; margin: auto 0 0; padding: 56px 0 0; border-top: 1px solid var(--ink); list-style: none; }
.method-list li { display: grid; gap: 3px; padding: 16px 20px 0 0; }
.method-list li + li { padding-left: 20px; border-left: 1px solid var(--line); }
.method-list span { color: var(--muted); font: 400 10px var(--mono); }
.method-list strong { font-size: 18px; }
.method-list small { color: var(--muted); font-size: 13px; }
.terrain { position: absolute; inset: 0; z-index: 0; background: url('/assets/alpine-highkey.jpg') center bottom/cover no-repeat; filter: grayscale(1) contrast(0.9); opacity: 0.2; pointer-events: none; }
.access-panel { display: flex; flex-direction: column; min-width: 0; padding: 40px; background: var(--ink); color: var(--cream); }
.access-panel .eyebrow { color: var(--inverse-muted); }
.access-panel-head { display: flex; align-items: center; justify-content: flex-end; gap: 20px; padding-bottom: 20px; border-bottom: 1px solid rgba(250, 249, 245, 0.14); }
.access-panel-body { max-width: 500px; margin: auto 0; padding: 48px 0; }
.human-moment { margin: 0 0 16px; color: var(--inverse-muted); font-size: 16px; }
.access-panel h2 { margin: 0 0 18px; font-size: clamp(34px, 3vw, 48px); line-height: 1.02; letter-spacing: -0.035em; }
.access-panel-body > p:not(.human-moment):not(.access-note) { max-width: 420px; margin: 0 0 26px; color: var(--inverse-muted); font-size: 17px; }
.access-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 52px; border-color: var(--cream); background: var(--cream); color: var(--ink); }
.gh-mark { width: 18px; height: 18px; fill: currentColor; }
.ledger-glyph { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ledger-glyph-fill { fill: currentColor; stroke: none; }
.access-ledger dt { display: inline-flex; align-items: center; gap: 8px; }
.access-secondary { width: 100%; margin-top: 8px; border-color: rgba(250, 249, 245, 0.25); background: transparent; color: var(--cream); }
.access-note { margin: 14px 0 0; color: var(--inverse-muted); }
.access-ledger { margin: 0; border-top: 1px solid rgba(250, 249, 245, 0.14); font: 400 10px var(--mono); letter-spacing: 0.04em; text-transform: uppercase; }
.access-ledger div { display: flex; justify-content: space-between; gap: 20px; padding: 11px 0; border-bottom: 1px solid rgba(250, 249, 245, 0.14); }
.access-ledger dt { color: var(--inverse-muted); }
.access-ledger dd { margin: 0; color: var(--cream); text-align: right; }

/* New review dialog */
dialog { width: min(700px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: var(--cream); color: var(--ink); }
dialog::backdrop { background: rgba(12, 12, 12, 0.58); }
#scan-form { display: grid; gap: 16px; max-height: inherit; padding: 24px; overflow: auto; }
.dialog-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.dialog-heading h2 { margin-top: 4px; font-size: 28px; }
.repository-source-group { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--mist); }
.repository-source-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.repository-source-heading small { color: var(--muted); }
.repository-source-group > label { display: grid; gap: 5px; }
.repository-source-group > label > select { width: 100%; }
.source-selector { overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
.source-selector-summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 64px; padding: 12px 16px; cursor: pointer; list-style: none; }
.source-selector-summary::-webkit-details-marker { display: none; }
.source-selector-summary-copy { display: grid; gap: 3px; min-width: 0; }
.source-selector-summary-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.source-expand-label { display: inline-flex; align-items: center; gap: 8px; color: var(--teal); }
.source-expand-open { display: none; }
.source-selector[open] .source-expand-open { display: inline; }
.source-selector[open] .source-expand-closed { display: none; }
.source-expand-chevron::after { content: "→"; }
.source-selector-body { display: grid; gap: 14px; padding: 16px; border-top: 1px solid var(--line); }
.source-selector-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.source-selector-heading p { margin: 0; color: var(--muted); font-size: 13px; }
.source-mode-toggle { min-height: 40px; padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px; background: var(--white); cursor: pointer; }
.source-browser, .source-manual { display: grid; gap: 12px; }
.source-browser label, .source-manual label { display: grid; gap: 5px; }
.commit-picker > span { color: var(--muted); font: 400 9px var(--mono); text-transform: uppercase; }
.commit-options { display: grid; gap: 6px; margin-top: 7px; }
.commit-options label { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 8px; padding: 10px; border: 1px solid var(--line); border-radius: 10px; }
.source-locked { display: grid; gap: 3px; }
.source-selector-help { margin: 0; color: var(--muted); font-size: 12px; }
.profile-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; min-width: 0; padding: 0; border: 0; }
.profile-options legend { grid-column: 1/-1; margin-bottom: 3px; }
.profile-option { min-width: 0; }
.profile-option input { position: absolute; opacity: 0; pointer-events: none; }
.profile-option > span { display: flex; align-items: center; gap: 10px; min-height: 64px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); cursor: pointer; }
.profile-option input:checked + span { border-color: var(--teal); background: var(--teal-soft); }
.profile-option input:focus-visible + span { outline: 2px solid var(--ink); outline-offset: 2px; }
.profile-option b { display: grid; min-width: 0; }
.profile-option strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-option small { color: var(--muted); }
.analysis-policy { display: flex; align-items: baseline; gap: 10px; padding: 0 2px; }
.analysis-policy .eyebrow { display: none; }
.analysis-policy strong { font-size: 13px; }
.analysis-policy small { color: var(--muted); font-size: 13px; }
.job-summary { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 7px 14px; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.job-summary > span { color: var(--muted); font: 400 10px var(--mono); text-transform: uppercase; }
.job-summary > strong { display: inline-flex; align-items: center; gap: 6px; justify-self: start; font-size: 13px; }
.scan-credit-note { margin: 0; padding: 10px 12px; border-left: 2px solid var(--teal); background: var(--mist); color: var(--muted); font-size: 12px; }
.form-error { min-height: 0; margin: 0; color: var(--red); font-size: 13px; }
.dialog-actions { position: sticky; bottom: -24px; display: flex; justify-content: flex-end; gap: 8px; margin: 0 -24px -24px; padding: 14px 24px; border-top: 1px solid var(--line); background: var(--cream); }

/* Run detail */
.run-backdrop { position: fixed; inset: 0; z-index: 90; background: rgba(12, 12, 12, 0.56); }
.run-drawer { position: fixed; inset: 0 0 0 auto; z-index: 100; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; width: min(620px, 100vw); height: 100dvh; border-left: 1px solid var(--line); background: var(--cream); }
.run-drawer-head { display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: flex-start; gap: 20px; padding: 22px 28px 18px; border-bottom: 1px solid var(--line); background: var(--white); }
.run-drawer-head > div { min-width: 0; }
.run-drawer-head h2 { margin: 4px 0 5px; font-size: 26px; overflow-wrap: anywhere; }
.run-drawer-head p:last-child { max-width: 100%; margin: 0; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.run-drawer-body { display: block; min-height: 0; padding: 20px 28px 28px; overflow: auto; }
.run-drawer-body > * + * { margin-top: 16px; }
.run-outcome { display: grid; gap: 6px; padding: 12px 14px; border: 1px solid var(--line); border-left: 3px solid var(--ink); border-radius: 12px; background: var(--white); }
.run-outcome.tone-active { border-left-color: var(--teal); }
.run-outcome.tone-success { border-left-color: var(--green); }
.run-outcome.tone-attention { border-left-color: var(--orange); }
.run-outcome.tone-danger { border-left-color: var(--red); }
.run-outcome-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.run-outcome-heading small { color: var(--muted); font: 400 10px var(--mono); white-space: nowrap; }
.run-outcome .run-status { font-size: 17px; }
.run-outcome > p { margin: 0; color: var(--muted); font-size: 13px; }
.run-context { display: grid; grid-template-columns: 1fr 1fr; margin: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.run-context > div { min-width: 0; padding: 13px 0; }
.run-context > div + div { padding-left: 16px; border-left: 1px solid var(--line); }
.run-context dt, .run-usage-facts dt { color: var(--muted); font: 400 9px var(--mono); text-transform: uppercase; }
.run-context dd, .run-usage-facts dd { margin: 5px 0 0; font-size: 13px; overflow-wrap: anywhere; }
.model-response-jump { min-height: 30px; padding: 5px 8px; border: 1px solid currentColor; border-radius: 999px; background: transparent; font: 500 8px var(--mono); text-transform: uppercase; cursor: pointer; }
.response-complete { color: var(--green); }
.response-incomplete { color: var(--orange); }
.response-unknown { color: var(--muted); }
.run-evidence-summary { display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
.evidence-item { display: grid; gap: 8px; min-height: 76px; padding: 12px 14px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.evidence-item:nth-child(2n) { border-right: 0; }
.evidence-item:nth-last-child(-n + 2) { border-bottom: 0; }
.evidence-item span { display: grid; gap: 4px; }
.evidence-item small { color: var(--muted); font: 400 9px var(--mono); text-transform: uppercase; }
.evidence-item strong { font-size: 13px; }
.evidence-item progress { width: 100%; height: 7px; overflow: hidden; border: 0; border-radius: 999px; background: var(--stone); }
.evidence-item progress::-webkit-progress-bar { background: var(--stone); }
.evidence-item progress::-webkit-progress-value { background: var(--teal); }
.evidence-item.tone-success progress::-webkit-progress-value { background: var(--green); }
.evidence-item progress::-moz-progress-bar { background: var(--teal); }
.evidence-item.tone-success progress::-moz-progress-bar { background: var(--green); }
.run-evidence-gap { margin: 0; padding: 12px 14px; border-left: 2px solid var(--orange); background: var(--orange-soft); color: #714125; font-size: 13px; }
.run-usage-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); margin: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
.run-usage-facts > div { padding: 11px 13px; border-right: 1px solid var(--line); }
.run-usage-facts > div:last-child { border-right: 0; }
.run-progress, .run-activity, .run-model-responses, .run-limitations { overflow: hidden; padding: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
.run-progress > summary, .run-activity > summary, .run-model-responses > summary, .run-limitations > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 11px 14px; cursor: pointer; list-style: none; font-weight: 500; }
.run-progress > summary::-webkit-details-marker, .run-activity > summary::-webkit-details-marker, .run-model-responses > summary::-webkit-details-marker, .run-limitations > summary::-webkit-details-marker { display: none; }
.disclosure-meta { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; margin-left: auto; color: var(--muted); }
.disclosure-meta b { padding: 4px 7px; border: 1px solid var(--line); border-radius: 999px; font: 400 9px var(--mono); white-space: nowrap; }
.disclosure-meta i::after { content: "+"; font: 400 17px/1 var(--mono); font-style: normal; }
details[open] > summary .disclosure-meta i::after { content: "−"; }
.product-stages { margin: 0; padding: 2px 14px 14px; list-style: none; }
.product-stages li { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 48px; border-top: 1px solid var(--line); color: var(--muted); }
.product-stages li > span { display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid var(--line); border-radius: 50%; font: 400 9px var(--mono); }
.product-stages li.done { color: var(--ink); }
.product-stages li.done > span { border-color: var(--green); background: var(--green); color: var(--cream); }
.product-stages li.current { color: var(--ink); }
.product-stages li.current > span { border-color: var(--ink); background: var(--ink); color: var(--cream); }
.product-stages em { color: var(--orange); font: 400 9px var(--mono); text-transform: uppercase; }
.run-model-responses > ol { max-height: 300px; margin: 0; padding: 0; overflow: auto; border-top: 1px solid var(--line); list-style: none; }
.run-model-responses li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: 12px; min-height: 54px; padding: 10px 14px; border-bottom: 1px solid var(--line); }
.run-model-responses li:last-child { border-bottom: 0; }
.run-model-responses li > span { display: grid; gap: 2px; min-width: 0; }
.run-model-responses li > span:last-child { text-align: right; }
.run-model-responses small { color: var(--muted); font: 400 9px/1.4 var(--mono); overflow-wrap: anywhere; }
.run-model-empty { margin: 0; padding: 14px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }
.run-activity > ol { max-height: min(300px, 38dvh); margin: 0; padding: 0 14px; overflow: auto; overscroll-behavior: contain; border-top: 1px solid var(--line); list-style: none; scrollbar-gutter: stable; }
.run-activity > ol li { display: grid; grid-template-columns: 110px minmax(0, 1fr); align-items: center; gap: 12px; min-height: 48px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.run-activity > ol li:last-child { border-bottom: 0; }
.run-activity time { color: var(--muted); font: 400 9px/1.35 var(--mono); }
.run-activity li div { display: flex; align-items: baseline; gap: 7px; min-width: 0; flex-wrap: wrap; }
.run-activity li strong { font-size: 12px; }
.run-activity li small { color: var(--muted); font-size: 10px; white-space: nowrap; }
.run-activity-empty { display: block !important; color: var(--muted); font-size: 13px; }
.run-report { display: grid; gap: 14px; padding-top: 16px; border-top: 1px solid var(--ink); }
.run-report-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.run-report-heading h3 { margin: 4px 0 0; font-size: 21px; }
.run-report-heading > span { color: var(--muted); font: 400 10px var(--mono); }
.report-search { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; }
.report-search input { width: 100%; }
.report-search small { color: var(--muted); }
.run-report-finding { border-bottom: 1px solid var(--line); }
.run-report-finding > summary { display: grid; gap: 3px; min-height: 52px; padding: 8px 0; cursor: pointer; }
.run-report-finding small { color: var(--muted); font: 400 9px var(--mono); }
.run-report-finding > div { padding: 0 0 14px; }
.run-report-finding p, .run-report-finding dd { color: var(--muted); font-size: 12px; }
.run-report-finding dl { display: grid; gap: 10px; margin: 0; }
.run-report-finding dt { color: var(--muted); font: 400 9px var(--mono); text-transform: uppercase; }
.run-report-finding dd { margin: 3px 0 0; }
.run-report-empty { margin: 0; padding: 14px; background: var(--white); color: var(--muted); }
.run-limitations ul { display: grid; gap: 7px; margin: 0; padding: 0 32px 14px; color: var(--muted); font-size: 12px; }
.run-lineage { margin: 0; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); font-size: 12px; }
.run-lineage button { padding: 0; border: 0; background: transparent; color: var(--teal); text-decoration: underline; cursor: pointer; }
.run-drawer-actions { position: sticky; bottom: 0; z-index: 2; display: grid; gap: 7px; padding: 9px 28px calc(9px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: var(--white); }
.run-action-tools { display: flex; align-items: stretch; gap: 7px; min-width: 0; }
.report-download { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-width: 0; min-height: 38px; flex: 1 1 0; padding: 5px 9px; border: 1px solid var(--line); border-radius: 10px; background: var(--white); cursor: pointer; }
.report-download svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; flex: 0 0 auto; }
.report-download span { display: flex; align-items: baseline; gap: 4px; min-width: 0; text-align: left; }
.report-download strong { font-size: 12px; }
.report-download small { font-size: 9px; opacity: 0.76; }
.report-pdf { color: var(--red); border-color: rgba(155, 44, 44, 0.28); background: var(--red-soft); }
.report-markdown { color: var(--teal); border-color: rgba(24, 87, 113, 0.28); background: var(--teal-soft); }
.report-evidence { color: var(--green); border-color: rgba(77, 114, 53, 0.28); background: var(--green-soft); }

@media (min-width: 861px) and (min-height: 620px) {
  body[data-route="credits"] { overflow: hidden; }
  body[data-route="credits"] .shell, body[data-route="credits"] main#main { height: 100dvh; min-height: 0; }
  body[data-route="credits"] main#main { overflow: hidden; }
  #view-credits { display: grid; grid-template-rows: auto minmax(0, 1fr); height: 100%; }
  #view-credits .page-heading { margin-bottom: 24px; }
  #view-credits .credits-layout, #view-credits .credits-secondary { min-height: 0; }
  #view-credits .credits-layout { align-items: stretch; }
  #view-credits .credits-primary { align-self: start; min-height: 0; max-height: 100%; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
  #view-credits .credits-secondary { grid-template-rows: auto minmax(0, 1fr); }
  #view-credits .billing-rates[open] .billing-plans { max-height: clamp(80px, calc(100dvh - 540px), 280px); overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
  #view-credits .billing-ledger-section { display: grid; grid-template-rows: auto minmax(0, 1fr); min-height: 120px; overflow: hidden; }
}
.run-context-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.run-context-actions small { color: var(--muted); font-size: 11px; }
.danger-control { color: var(--red); border-color: rgba(155, 44, 44, 0.36); }
.toast { position: fixed; right: 20px; bottom: 20px; z-index: 200; max-width: min(360px, calc(100vw - 32px)); padding: 12px 16px; border-radius: 10px; background: var(--ink); color: var(--cream); pointer-events: none; }
body.drawer-open .toast { bottom: calc(108px + env(safe-area-inset-bottom)); }
.startup-state { display: grid; place-items: start; max-width: 680px; margin: 12vh auto; padding: 32px; }
.startup-state img { width: 120px; margin-bottom: 32px; }

/* Laptop */
@media (max-width: 1280px) {
  .shell { grid-template-columns: 240px minmax(0, 1fr); }
  main#main { padding-inline: 28px; }
  .workspace-ledger article { padding-inline: 16px; }
  .run-table { min-width: 0; }
  .run-table th:nth-child(1), .run-table td:nth-child(1) { width: 30%; }
  .run-table th:nth-child(2), .run-table td:nth-child(2) { width: 25%; }
  .run-table th:nth-child(3), .run-table td:nth-child(3) { width: 22%; }
  .run-table th:nth-child(4), .run-table td:nth-child(4) { width: 14%; }
  .run-table th:nth-child(5), .run-table td:nth-child(5) { width: 9%; }
  .run-table th:nth-child(6), .run-table td:nth-child(6), .run-table th:nth-child(7), .run-table td:nth-child(7) { display: none; }
  .run-model .model-cell { width: 100%; }
  .finding { grid-template-columns: 132px minmax(0, 1fr) 146px; gap: 18px; padding: 20px; }
}

@media (min-width: 861px) and (max-width: 1100px) {
  .run-table th, .run-table td { padding-inline: 12px; }
  .run-table .run-tokens strong, .run-table .run-cost strong { font-size: 14px; }
}

/* Compact navigation and one-column content */
@media (max-width: 860px) {
  .shell { display: block; padding-top: 64px; }
  .sidebar { position: fixed; inset: 0 0 auto; height: 64px; padding: 8px 12px; border-right: 0; border-bottom: 1px solid rgba(250, 249, 245, 0.14); }
  .sidebar-head { display: grid; grid-template-columns: minmax(0, 1fr) 44px; width: 100%; padding: 0; }
  .workspace-brand .brand-mark { width: 48px; height: 48px; }
  .sidebar-toggle { margin: 0; transform: rotate(-90deg); }
  .primary-nav { position: fixed; inset: 64px 0 0 auto; z-index: 70; width: min(320px, 88vw); padding: 20px 16px 150px; background: var(--ink); transform: translateX(100%); transition: transform 160ms ease; }
  .sidebar-account { position: fixed; right: 0; bottom: 0; z-index: 71; width: min(320px, 88vw); padding: 14px 16px; background: var(--ink); transform: translateX(100%); transition: transform 160ms ease; }
  .account-menu, body.sidebar-collapsed .account-menu { left: auto; right: 0; bottom: 68px; }
  body.mobile-nav-open .primary-nav, body.mobile-nav-open .sidebar-account { transform: translateX(0); }
  .mobile-nav-backdrop { position: fixed; inset: 64px 0 0; z-index: 35; display: block; width: 100%; height: calc(100dvh - 64px); padding: 0; border: 0; background: rgba(12, 12, 12, 0.52); }
  body.mobile-nav-open .sidebar-toggle { transform: rotate(90deg); }
  body.sidebar-collapsed .shell { display: block; }
  body.sidebar-collapsed .sidebar-head { grid-template-columns: minmax(0, 1fr) 44px; }
  body.sidebar-collapsed .workspace-brand { justify-content: flex-start; }
  body.sidebar-collapsed .workspace-brand .product-name, body.sidebar-collapsed .primary-nav span, body.sidebar-collapsed .profile-copy, body.sidebar-collapsed .profile-chevron { display: inline-flex; }
  body.sidebar-collapsed .sidebar-toggle { margin: 0; transform: rotate(-90deg); }
  body.sidebar-collapsed .primary-nav a { justify-content: flex-start; padding-inline: 14px; }
  main#main { padding: 28px 20px 56px; }
  .page-heading { align-items: flex-start; }
  .page-heading h1 { font-size: 46px; }
  .workspace-ledger { grid-template-columns: repeat(2, 1fr); }
  .workspace-ledger article:nth-child(2) { border-right: 0; }
  .workspace-ledger article:nth-child(-n + 2) { border-bottom: 1px solid var(--line); }
  .trust-strip { grid-template-columns: repeat(2, 1fr); }
  .trust-strip > *:nth-child(2) { border-right: 0; }
  .trust-strip > *:nth-child(-n + 2) { border-bottom: 1px solid var(--line); }
  .trust-link b { display: none; }
  .repository-filters { grid-template-columns: repeat(3, 1fr); }
  .repository-filters > div { grid-column: 1/-1; }
  .run-toolbar { grid-template-columns: 1fr 1fr; }
  .run-search { grid-column: 1/-1; }
  .run-table { min-width: 0; table-layout: auto; }
  .run-table thead { display: none; }
  .run-table tbody { display: grid; gap: 8px; padding: 8px; }
  .run-table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; min-height: 0; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
  .run-table td { display: block !important; width: auto !important; height: auto; padding: 0; border: 0; text-align: left !important; }
  .run-table .run-repository { grid-column: 1; grid-row: 1; }
  .run-table .run-state { grid-column: 2; grid-row: 1; justify-self: end; }
  .run-table .run-state .run-status { max-width: 150px; justify-content: flex-end; white-space: normal; text-align: right; }
  .run-table .run-model { grid-column: 1/-1; grid-row: 2; }
  .run-table .run-tokens, .run-table .run-cost, .run-table .run-started { display: grid !important; grid-template-columns: auto 1fr; align-items: baseline; gap: 8px; }
  .run-table .run-tokens { grid-column: 1; grid-row: 3; }
  .run-table .run-cost { grid-column: 2; grid-row: 3; justify-self: end; }
  .run-table .run-started { grid-column: 1/-1; grid-row: 4; }
  .run-table .run-open { display: none !important; }
  .run-table .run-tokens::before, .run-table .run-cost::before, .run-table .run-started::before { content: attr(data-label); color: var(--muted); font: 400 9px var(--mono); text-transform: uppercase; }
  .finding { grid-template-columns: 100px minmax(0, 1fr); }
  .finding-decision { grid-column: 2; }
  .account-trust-band, .trust-fact-grid, .developer-layout, .credits-layout { grid-template-columns: 1fr; }
  .account-trust-band > div { padding-left: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .trust-fact, .trust-fact:nth-child(even) { padding: 20px 0; border-right: 0; }
  .sign-in { grid-template-columns: 1fr; }
  .sign-in-copy { min-height: auto; padding: 48px 24px 32px; }
  .access-panel { padding: 32px 24px; }
  .access-panel-body { padding: 42px 0; }
}

/* Mobile */
@media (max-width: 700px) {
  main#main { padding: 24px 16px 48px; }
  .page-heading { display: grid; gap: 18px; margin-bottom: 24px; }
  .page-heading h1 { font-size: 40px; }
  .page-heading > div > p:last-child { font-size: 15px; }
  .heading-actions { justify-content: flex-start; }
  .workspace-ledger article { min-height: 96px; padding: 14px 10px; }
  .workspace-ledger article:first-child { padding-left: 0; }
  .workspace-ledger strong { font-size: 30px; }
  .economics-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 12px; }
  .economics-controls { display: contents; }
  .economics-toggle { grid-column: 2; grid-row: 1; }
  #cost-coverage { grid-column: 1/-1; grid-row: 2; justify-self: end; max-width: 100%; text-align: right; font-size: 12px; line-height: 1.35; }
  .cost-chart, .cost-chart-svg { height: 180px; }
  .section-heading { display: grid; gap: 8px; }
  .section-heading > p { text-align: left; }
  .installation-row { display: grid; grid-template-columns: minmax(0, 1fr); align-items: flex-start; gap: 8px; }
  .installation-actions { display: flex; justify-content: space-between; justify-items: unset; width: 100%; text-align: left; }
  .repository-filters { grid-template-columns: 1fr; }
  .repository-filters > div { grid-column: auto; }
  .card-grid { grid-template-columns: 1fr; }
  .run-summary { grid-template-columns: repeat(2, 1fr); }
  .run-summary > button { border-bottom: 1px solid var(--line); }
  .run-summary > button:nth-child(2n) { border-right: 0; }
  .run-summary > button:nth-last-child(-n + 2) { border-bottom: 0; }
  .run-summary > button > span:last-child { display: grid; gap: 3px; }
  .run-toolbar { grid-template-columns: 1fr; }
  .run-search { grid-column: auto; }
  .finding-summary { grid-template-columns: 1fr; }
  .finding-summary .summary-card { border-right: 0; border-bottom: 1px solid var(--line); }
  .finding-summary .summary-card:last-child { border-bottom: 0; }
  .finding { grid-template-columns: 1fr; padding: 18px; }
  .finding-register { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 10px; }
  .finding-index { margin: 4px 0 0; }
  .finding-location { grid-column: 1/-1; margin-top: 0; }
  .finding-path { margin: 7px 0 0; }
  .finding-icon { grid-column: 3; grid-row: 1; }
  .finding-decision { grid-column: 1; }
  .finding-title { display: grid; }
  .account-trust-band > div { grid-template-columns: 44px minmax(0, 1fr); }
  .boundary-flow { display: grid; grid-template-columns: 1fr; justify-items: start; }
  .boundary-flow b { margin-left: 18px; transform: rotate(90deg); }
  .api-endpoint-card { align-items: flex-start; }
  .api-token-form { grid-template-columns: 1fr; }
  .api-token-form button { width: 100%; }
  .mcp-steps li > div { display: grid; grid-template-columns: 1fr; }
  .mcp-steps li > div > small { max-width: none; justify-self: start; }
  .billing-topups { grid-template-columns: 1fr 1fr; }
  .billing-custom-control { grid-template-columns: auto minmax(0, 1fr); border-radius: 12px; }
  .billing-custom-control .primary { grid-column: 1/-1; margin: 0 -1px -1px; border-radius: 0; }
  .method-list { grid-template-columns: 1fr; margin-top: 36px; padding-top: 0; }
  .method-list li, .method-list li + li { padding: 12px 0; border-left: 0; border-bottom: 1px solid var(--line); }
  .sign-in h1 { font-size: clamp(48px, 14vw, 60px); }
  .sign-in-lede { font-size: 17px; }
  .access-panel { min-height: 0; }
  .access-panel-body { margin: 0; padding: 56px 0 40px; }
  dialog { width: 100vw; max-width: none; height: 100dvh; max-height: 100dvh; margin: 0; border: 0; border-radius: 0; }
  #scan-form { padding: 20px 16px calc(20px + env(safe-area-inset-bottom)); }
  .profile-options { grid-template-columns: 1fr; }
  .profile-option > span { min-height: 58px; }
  .analysis-policy { display: grid; gap: 2px; }
  .job-summary { grid-template-columns: 82px minmax(0, 1fr); }
  .dialog-actions { bottom: calc(-20px - env(safe-area-inset-bottom)); margin: 0 -16px calc(-20px - env(safe-area-inset-bottom)); padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); }
  .run-drawer { width: 100vw; }
  .run-drawer-head { padding: 18px 16px 14px; }
  .run-drawer-head h2 { font-size: 23px; }
  .run-drawer-body { padding: 16px 16px 24px; }
  .run-drawer-body > * + * { margin-top: 14px; }
  .run-context { grid-template-columns: 1fr; }
  .run-context > div + div { padding-left: 0; border-top: 1px solid var(--line); border-left: 0; }
  .run-usage-facts { grid-template-columns: repeat(2, 1fr); }
  .run-usage-facts > div { border-bottom: 1px solid var(--line); }
  .run-activity > ol li { grid-template-columns: 88px minmax(0, 1fr); }
  .run-drawer-actions { padding-inline: 16px; }
  .run-context-actions { grid-template-columns: 1fr; text-align: center; }
  .run-context-actions .primary, .run-context-actions .secondary { width: 100%; }
}

@media (max-width: 390px) {
  .product-name { font-size: 15px; }
  .workspace-ledger article { grid-template-columns: 30px minmax(0, 1fr); gap: 8px; }
  .summary-glyph { width: 30px; height: 30px; }
  .workspace-ledger strong { font-size: 27px; }
  .run-summary > button { grid-template-columns: 30px minmax(0, 1fr); gap: 8px; padding: 12px 8px; }
  .run-summary strong { font-size: 28px; }
  .run-table tbody { padding: 8px; }
  .run-table tr { gap: 5px 10px; padding: 10px; }
  .api-endpoint-card { display: grid; }
  .api-endpoint-card button { width: 100%; }
  .billing-balance { grid-template-columns: 1fr; }
  .billing-balance > div + div { padding-left: 0; border-top: 1px solid var(--line); border-left: 0; }
  .run-action-tools { display: grid; grid-template-columns: 44px repeat(3, minmax(0, 1fr)); }
  .report-download { gap: 4px; padding: 6px 4px; }
  .report-download strong { font-size: 11px; }
  .report-download small { display: none; }
  .toast { right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); left: 12px; max-width: none; }
  body.drawer-open .toast { bottom: calc(118px + env(safe-area-inset-bottom)); }
}

@media (max-width: 340px) {
  .economics-heading { display: grid; }
  .run-table .run-repository { grid-column: 1/-1; grid-row: 1; }
  .run-table .run-state { grid-column: 1/-1; grid-row: 2; justify-self: start; }
  .run-table .run-state .run-status { max-width: none; justify-content: flex-start; text-align: left; }
  .run-table .run-model { grid-row: 3; }
  .run-table .run-tokens { grid-row: 4; }
  .run-table .run-cost { grid-row: 4; }
  .run-table .run-started { grid-row: 5; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
}

/* ---- Landing rebuild (2026-08-19): hero + lenses + outcomes + trust ---- */
main.sign-in { display: block; }
.landing { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(380px, 0.85fr); min-height: calc(100dvh - 72px); background: var(--cream); }
.landing .sign-in-copy { grid-column: 1; }
.landing .access-panel { grid-column: 2; grid-row: 1; }
.landing-pipeline { grid-column: 1 / -1; padding: clamp(44px, 5vw, 76px) clamp(32px, 7vw, 104px) clamp(40px, 4.5vw, 64px); border-top: 1px solid var(--ink); }
.landing-section-heading { max-width: 760px; margin-bottom: 34px; }
.landing-section-heading h2 { margin: 10px 0 12px; font-size: clamp(28px, 2.8vw, 40px); line-height: 1.02; letter-spacing: -0.03em; font-weight: 500; }
.landing-section-heading p:last-child { margin: 0; max-width: 640px; color: var(--muted); font-size: 16px; line-height: 1.5; }
.landing-trust { grid-column: 1 / -1; padding: 26px clamp(32px, 7vw, 104px) 40px; border-top: 1px solid var(--ink); background: var(--ink); }
.landing-trust-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 16px 32px; max-width: 1552px; margin: 0 auto; }
@media (min-width: 1760px) {
  .landing-pipeline, .landing-route, .landing-trust { padding-inline: calc((100% - 1552px) / 2); }
}
.landing-trust-list > div { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 4px 10px; }
.landing-trust-list dt { grid-column: 2; color: color-mix(in srgb, var(--cream) 60%, transparent); font: 400 10px var(--mono); text-transform: uppercase; letter-spacing: 0.14em; }
.landing-trust-list dd { grid-column: 2; margin: 0; color: var(--cream); font-size: 14px; }
.trust-glyph { grid-row: 1 / span 2; align-self: start; width: 19px; height: 19px; margin-top: 2px; fill: none; stroke: var(--cream); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; opacity: 0.9; }
.trust-glyph-eu { fill: var(--cream); stroke: none; }
@media (max-width: 960px) {
  .landing { grid-template-columns: 1fr; }
  .landing .access-panel { grid-column: 1; grid-row: auto; }
}

/* Hero method glyphs */
.method-list li { grid-template-columns: minmax(0, 1fr) 26px; }
.method-list li span, .method-list li strong { grid-column: 1; }
.method-list li small { grid-column: 1 / -1; }
.method-glyph { grid-column: 2; grid-row: 1 / span 2; justify-self: end; align-self: start; width: 22px; height: 22px; fill: none; stroke: var(--ink); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; opacity: 0.85; }

/* "Commit in. Evidence out." — the run, drawn */
.pipeline-svg { display: block; width: 100%; height: auto; color: var(--ink); }
.pipeline-svg-wide { max-width: 1240px; margin-inline: auto; }
.pipeline-svg-tall { display: none; max-width: 440px; margin-inline: auto; }
.pipe-mono { font: 500 14px var(--mono); fill: currentColor; }
.pipe-mono-sm { font: 400 12px var(--mono); fill: currentColor; }
.pipe-label { font: 400 11px var(--mono); letter-spacing: 0.12em; fill: color-mix(in srgb, var(--ink) 55%, transparent); }
.pipe-box { fill: var(--white); stroke: currentColor; stroke-width: 1.5; }
.pipe-box-dashed { fill: color-mix(in srgb, var(--ink) 3%, var(--cream)); stroke-dasharray: 5 6; }
.pipe-files rect { fill: color-mix(in srgb, var(--ink) 18%, transparent); }
.pipe-beam { opacity: 0; }
.pipe-connector { fill: none; stroke: color-mix(in srgb, var(--ink) 45%, transparent); stroke-width: 1.5; stroke-dasharray: 6 7; }
.pipe-chevron { fill: none; stroke: color-mix(in srgb, var(--ink) 45%, transparent); stroke-width: 1.5; }
.pipe-chip { fill: var(--white); stroke: var(--line-strong); stroke-width: 1.2; }
.pipe-dot { fill: var(--green); }
.pipe-sep { stroke: var(--line); stroke-width: 1; }
.pipe-drop { stroke: color-mix(in srgb, var(--ink) 30%, transparent); stroke-width: 1.2; stroke-dasharray: 3 5; }
.pipe-rail { stroke: color-mix(in srgb, var(--ink) 30%, transparent); stroke-width: 1.5; }
.pipe-tick { stroke: var(--green); stroke-width: 2.4; }
.pipe-stamp { fill: none; stroke: var(--green); stroke-width: 1.8; }
.pipe-i0 { --i: 0; }
.pipe-i1 { --i: 1; }
.pipe-i2 { --i: 2; }
.pipe-i3 { --i: 3; }
.pipe-i4 { --i: 4; }
.pipeline-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(18px, 2.5vw, 32px); max-width: 1240px; margin: clamp(30px, 3.4vw, 48px) auto 0; }
.pipeline-facts > div { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 0 10px; padding-top: 14px; border-top: 1px solid var(--ink); }
.pipeline-facts dt { grid-column: 2; align-self: center; color: var(--muted); font: 400 10px var(--mono); text-transform: uppercase; letter-spacing: 0.14em; }
.pipeline-facts dd { grid-column: 2; margin: 8px 0 0; color: var(--muted); font-size: 14.5px; line-height: 1.55; }
.fact-glyph { grid-row: 1 / span 2; align-self: start; width: 20px; height: 20px; margin-top: 1px; fill: none; stroke: var(--ink); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.landing-route { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: clamp(20px, 4vw, 52px); padding: 20px clamp(32px, 7vw, 104px); border-top: 1px solid var(--line); }
.route-label { color: var(--muted); font: 400 10px var(--mono); text-transform: uppercase; letter-spacing: 0.14em; }
.route-item { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; letter-spacing: -0.01em; }
.route-item img { width: 22px; height: 22px; }
.eu-mark { width: 28px; height: 28px; fill: var(--ink); }
@media (prefers-reduced-motion: no-preference) {
  .pipe-anim-flow { animation: pipe-flow 1.2s linear infinite; }
  .pipe-beam-w { animation: pipe-beam-w 4.2s ease-in-out infinite; }
  .pipe-beam-t { animation: pipe-beam-t 4.2s ease-in-out infinite; }
  .pipe-lens { animation: pipe-lens 4.2s ease-in-out calc(var(--i) * 0.5s - 4.2s) infinite; }
  .pipe-dot { animation: pipe-dot 4.2s ease-in-out calc(var(--i) * 0.5s - 4.2s) infinite; }
  .pipe-tick { animation: pipe-tick 4.2s linear calc(var(--i) * 0.55s - 4.2s) infinite; }
}
@keyframes pipe-flow { to { stroke-dashoffset: -26; } }
@keyframes pipe-beam-w { 0% { transform: translateX(0); opacity: 0; } 10% { opacity: 1; } 88% { opacity: 1; } 100% { transform: translateX(252px); opacity: 0; } }
@keyframes pipe-beam-t { 0% { transform: translateY(0); opacity: 0; } 10% { opacity: 1; } 88% { opacity: 1; } 100% { transform: translateY(136px); opacity: 0; } }
@keyframes pipe-lens { 0%, 40%, 100% { opacity: 0.72; } 10%, 22% { opacity: 1; } }
@keyframes pipe-dot { 0%, 40%, 100% { opacity: 0.25; } 10%, 22% { opacity: 1; } }
@keyframes pipe-tick { 0%, 8% { opacity: 0.15; } 16%, 82% { opacity: 1; } 92%, 100% { opacity: 0.15; } }
@media (max-width: 960px) {
  .pipeline-svg-wide { display: none; }
  .pipeline-svg-tall { display: block; }
  .pipeline-facts { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .pipeline-facts { grid-template-columns: 1fr; }
  .landing-route { gap: 16px 28px; }
}

/* API & MCP page: lifecycle-grouped operations */
.docs-ops { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1px; margin: 18px 0 20px; border: 1px solid var(--line); background: var(--line); }
.docs-ops > div { padding: 18px 18px 20px; background: var(--cream); }
.docs-ops h3 { margin: 0 0 10px; font-size: 15px; letter-spacing: -0.01em; }
.docs-ops code { display: inline-block; margin: 0 6px 6px 0; }
.docs-ops p { margin: 6px 0 0; color: var(--muted); font-size: 13px; line-height: 1.5; }

/* Credits: one compact add-credits group */
.billing-fund-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.billing-fund-heading h2 { margin: 0; font-size: 20px; letter-spacing: -0.015em; }
.billing-custom-form { display: grid; gap: 12px; }



.icon-button-edit { color: var(--ink); }
.icon-button-edit svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.icon-button-edit:hover { background: var(--cream); }
.commit-options label { grid-template-columns: 20px minmax(0, 1fr) auto; align-items: start; row-gap: 0; column-gap: 10px; padding: 12px; cursor: pointer; }
.commit-options label:has(input:checked) { border-color: var(--teal); background: var(--teal-soft); }
.commit-option-copy { display: grid; gap: 3px; min-width: 0; }
.commit-option-copy strong { font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
.commit-option-copy small { color: var(--muted); font: 400 11px var(--mono); }
.commit-options time { align-self: start; color: var(--muted); font: 400 11px var(--mono); white-space: nowrap; }

.billing-coupon { margin-top: 14px; }
.billing-coupon > summary { cursor: pointer; font-size: 12px; color: var(--muted); }
.billing-coupon > summary:hover { color: var(--ink); }
.billing-coupon-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; margin-top: 8px; }
.billing-coupon-form input { min-width: 0; height: 40px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--white); outline: 0; font-size: 13px; }
.billing-coupon-form input:focus { border-color: var(--teal); }
.billing-coupon-form .secondary { min-height: 40px; }

@media (max-width: 520px) {
  .run-action-tools { flex-wrap: wrap; }
  .report-download { flex: 1 1 calc(50% - 24px); }
  .report-download small { display: none; }
  .run-drawer-actions { padding-inline: 12px; }
}

/* ---- Landing renders one zoom step larger than the workspace ----
   The signed-in shell stays at 1:1; only the marketing landing scales, so
   nothing in the product's dense layouts shifts. Both viewport-height rules
   inside the zoomed subtree are divided by the same factor, otherwise
   100dvh would resolve against the unzoomed viewport and overflow. */
/* The public topbar is shown only on the landing (hidden once the
   workspace opens), so it scales with it — otherwise the brand would sit
   visibly smaller than the hero it belongs to. */
#sign-in, #public-topbar:not([hidden]) { zoom: var(--landing-zoom); }
#sign-in.sign-in, #sign-in .landing { min-height: calc((100dvh - 72px) / var(--landing-zoom)); }

/* ---- Repository filters: no overlap, and room for search ----
   Grid items default to min-width:auto, so a select whose option text is
   wider than its track pushed into the next column. min-width:0 lets every
   control shrink inside its own track, and the row reflows instead of
   colliding as the controls get narrower. */
.repository-filters { grid-template-columns: minmax(150px, 0.9fr) minmax(190px, 1.3fr) repeat(3, minmax(130px, 175px)); }
.repository-filters > * { min-width: 0; }
.repository-filters select, .repository-filters input[type="search"] { width: 100%; min-width: 0; }
.repository-search { position: relative; }
.repository-search input[type="search"] { padding-left: 38px; }
.repository-search .run-search-icon { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 1.7; pointer-events: none; }
@media (max-width: 1180px) {
  .repository-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .repository-filters { grid-template-columns: minmax(0, 1fr); }
}

/* ---- Hero typography at the landing's 1.25 zoom ----
   The zoom scales the whole first pane, which made the headline and lede
   read larger than intended. Dividing the type back down keeps the generous
   zoomed layout while returning the text to a comfortable size; the mobile
   step is scaled by the same factor so small screens stay in proportion. */
.sign-in-copy h1 { font-size: clamp(38px, 3.8vw, 60px); }
.sign-in-copy .sign-in-lede { font-size: 16px; }
/* The access panel is the other half of the same first pane, so it steps
   down by the same factor — otherwise its heading reads larger than the
   hero it sits beside. */
.sign-in .access-panel h2 { font-size: clamp(28px, 2.4vw, 38px); }
.sign-in .access-panel-body > p { font-size: 15px; }
@media (max-width: 700px) {
  .sign-in-copy h1 { font-size: clamp(38px, 11vw, 48px); }
  .sign-in-copy .sign-in-lede { font-size: 15px; }
}