/* Product chrome: shell, rail, mast, dialogs, portal pages, Files, the project dock and panel.
   The document layer (report.css) styles what AIUS generates; this file never styles it. */
:root {
  --gutter: 32px;
  --topbar: 0px;
}
html {
  scroll-padding-top: calc(var(--topbar) + 64px);
}
button,
a,
input,
select,
textarea {
  -webkit-tap-highlight-color: transparent;
}
/* aius.co's links are ink; a hairline underline keeps a link in running text distinguishable. */
a {
  color: inherit;
  text-decoration-line: underline;
  text-decoration-color: var(--line-strong);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
a:hover {
  text-decoration-color: currentColor;
}
button {
  color: inherit;
}
button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
/* Fields are aius.co's .field-input: a 44px pill with a strong hairline and a violet focus ring. */
input,
select,
textarea {
  border: 1px solid var(--line-strong);
  border-radius: 22px;
  background: var(--bg);
  transition:
    border-color 120ms ease,
    box-shadow 120ms ease;
}
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: none;
  border-color: var(--focus);
  box-shadow: 0 0 0 3px rgb(46 0 156 / 0.12);
}
/* Buttons are aius.co's .btn.btn-ghost.btn-sm: a 32px white pill with a hairline. */
button {
  min-height: 32px;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--bg);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.02em;
  transition:
    transform 120ms ease,
    box-shadow 120ms ease,
    border-color 120ms ease;
}
button:hover:not(:disabled) {
  border-color: var(--line-strong);
}
/* The primary action is aius.co's .btn-primary: the cyan-to-violet gradient pill. */
button.primary {
  color: #ffffff;
  background: var(--gradient-brand-compact);
  background-origin: border-box;
  border-color: transparent;
}
button.primary:hover:not(:disabled) {
  border-color: transparent;
  box-shadow: var(--shadow-brand);
}
button.danger {
  color: var(--danger);
}
svg.icon {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
}
.icon-button {
  width: 32px;
  height: 32px;
  padding: 6px;
  border: 0;
  border-radius: 16px;
  background: transparent;
  color: var(--fg-muted);
  flex: 0 0 32px;
}
.icon-button:hover {
  background: var(--line);
  color: var(--fg);
}
h1,
h2,
h3,
h4,
p {
  margin-top: 0;
}
/* aius.co's scale: .cell-title pages, 18px section heads, then 16 and 14. */
h1 {
  font-size: 24px;
  line-height: 1.1;
  font-weight: 500;
  letter-spacing: var(--ls-title);
  overflow-wrap: anywhere;
}
h2 {
  font-size: 18px;
  line-height: 1.55;
  font-weight: 600;
}
h3 {
  font-size: 16px;
  line-height: 1.5;
  font-weight: 600;
}
h4 {
  font-size: 14px;
  font-weight: 600;
}
.muted,
.annotation {
  color: var(--fg-muted);
}
.annotation {
  font-size: 13px;
}
.eyebrow {
  color: var(--caps-ink);
  font-family: var(--caps-font);
  font-size: var(--caps-size);
  font-weight: var(--caps-weight);
  letter-spacing: var(--ls-caps);
  line-height: var(--caps-line);
  text-transform: uppercase;
}
.skip-link {
  position: fixed;
  left: 16px;
  top: -100px;
  z-index: 100;
  background: var(--bg);
  padding: 8px;
}
.skip-link:focus {
  top: 8px;
}
/* Loading placeholders: soft shimmering lines in the shape of what is coming, never bare loading text. */
.aius-skeleton {
  display: grid;
  gap: 10px;
  padding-block: 4px;
}
.aius-skeleton-line {
  display: block;
  height: 12px;
  border-radius: 6px;
  background: linear-gradient(90deg, #ededeb 25%, #f7f7f5 50%, #ededeb 75%);
  background-size: 200% 100%;
  animation: aius-shimmer 1.4s ease-in-out infinite;
}
.aius-skeleton .aius-skeleton-line:nth-child(3n + 2) {
  width: 86%;
}
.aius-skeleton .aius-skeleton-line:nth-child(3n) {
  width: 62%;
}
.aius-skeleton-short {
  display: inline-block;
  width: 160px;
  max-width: 100%;
  vertical-align: middle;
}
@keyframes aius-shimmer {
  from {
    background-position: 150% 0;
  }
  to {
    background-position: -50% 0;
  }
}
/* The first paint mirrors the app shell, fading in only if loading takes a moment. */
.app-loading {
  display: grid;
  grid-template-columns: var(--rail-width) minmax(0, 1fr);
  min-height: 100vh;
  background: var(--page-ground);
  animation: app-loading-in 0.4s ease 0.15s both;
}
@keyframes app-loading-in {
  from {
    opacity: 0;
  }
}
.app-loading-rail {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px 20px;
  background: var(--rail-surface);
  border-right: 1px solid var(--rail-line);
}
.app-loading-rail .aius-wordmark {
  width: 98px;
  height: 20px;
  margin-bottom: 10px;
}
.app-loading-select {
  height: 36px;
  border-radius: 18px;
}
.app-loading-rail .aius-skeleton-line:not(.app-loading-select) {
  width: 72%;
}
.app-loading-mast {
  display: flex;
  align-items: center;
  height: 49px;
  padding-inline: 16px;
  border-bottom: 1px solid var(--line);
  background: var(--bg);
}
.app-loading-brand {
  display: none;
  width: 86px;
  height: 18px;
  margin-inline: auto;
}
.app-loading-page {
  display: grid;
  gap: 16px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px var(--gutter);
}
.app-loading-title {
  width: min(420px, 60%);
  height: 28px;
  border-radius: 8px;
}
.app-loading-lede {
  width: min(640px, 85%);
}
.app-loading-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 16px;
}
.app-loading-card {
  display: grid;
  align-content: start;
  gap: 12px;
  min-height: 150px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--bg);
}
.app-loading-card .aius-skeleton-line:nth-child(2) {
  width: 80%;
}
.app-loading-card .aius-skeleton-line:nth-child(3) {
  width: 56%;
}
.app-loading-wide {
  grid-column: 1 / -1;
  min-height: 220px;
}
@media (max-width: 959px) {
  .app-loading {
    grid-template-columns: minmax(0, 1fr);
  }
  .app-loading-rail {
    display: none;
  }
  .app-loading-brand {
    display: block;
  }
  .app-loading-page {
    padding: 24px 16px;
  }
  .app-loading-cards {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (prefers-reduced-motion: reduce) {
  .aius-skeleton-line,
  .app-loading {
    animation: none;
  }
}
/* Route loads: a delayed top bar and dimmed content; the mast stays readable to show the destination. */
.route-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 1000;
  height: 3px;
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s;
}
.route-progress.is-active {
  opacity: 1;
}
.route-progress::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 40%;
  background: var(--gradient-chip);
}
.route-progress.is-active::before {
  animation: aius-progress 1.1s ease-in-out infinite;
}
@keyframes aius-progress {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(250%);
  }
}
body:has(#app[aria-busy="true"]) {
  cursor: progress;
}
#app[aria-busy="true"] .main > :not(.mast) {
  opacity: 0.5;
  transition: opacity 0.15s ease 0.15s;
}
@media print {
  .route-progress {
    display: none;
  }
}
.print-brand {
  display: none;
}
.loading p {
  margin-top: 20px;
}
.rail,
.mobile-top {
  --bg: var(--rail-bg);
  --surface: var(--rail-bg);
  --surface-raised: var(--rail-surface);
  --fg: var(--rail-fg);
  --fg-muted: var(--rail-fg-muted);
  --fg-subtle: var(--rail-fg-subtle);
  --line: var(--rail-line);
  --line-strong: var(--rail-line-strong);
  --brand: var(--rail-accent);
  --brand-subtle: var(--rail-wash);
  --focus: var(--rail-accent);
  color: var(--fg);
}
.rail {
  position: fixed;
  inset: 0 auto 0 0;
  width: var(--rail-width);
  display: flex;
  flex-direction: column;
  padding: 16px 8px 8px;
  background: var(--surface-raised);
  border-right: 1px solid var(--line);
  z-index: 60;
}
.rail-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 8px 20px 12px;
}
.rail .aius-wordmark {
  width: 98px;
  height: 20px;
}
/* The organisation switcher reads as a quiet control at the head of the rail, not a form field. */
.rail-org {
  margin: 0 8px 16px;
  width: calc(100% - 16px);
  min-height: 40px;
  padding: 0 12px;
  border-color: var(--line);
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
}
.rail-org:hover {
  border-color: var(--line-strong);
}
.rail-projects-home {
  margin-bottom: 8px;
  flex-shrink: 0;
}
.rail-project-count {
  margin-left: auto;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
}
.rail-projects {
  overflow-y: auto;
  flex: 1;
  min-height: 0;
}
.rail-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}
@media (max-height: 480px) {
  body:not(.rail-slim) .rail {
    overflow-y: auto;
  }
  .rail-top,
  .rail-bottom {
    flex-shrink: 0;
  }
  .rail-body {
    flex: 1 0 auto;
  }
  .rail-body > .rail-projects {
    flex: 1 0 auto;
    overflow: visible;
  }
}
@media (max-height: 480px) and (max-width: 959px) {
  body.rail-slim .rail {
    overflow-y: auto;
  }
}
.rail-slim-controls {
  display: none;
}
.rail-flyout,
.rail-popup {
  position: absolute;
  left: calc(var(--rail-slim) + 8px);
  z-index: 60;
  background: var(--rail-bg);
  border: 1px solid var(--rail-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: 8px;
}
.rail-flyout {
  top: 56px;
  width: 248px;
  max-height: calc(100dvh - 72px);
  display: flex;
  flex-direction: column;
}
.rail-flyout-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  padding: 4px 8px 8px;
}
.rail-flyout-heading p {
  margin: 0;
  font-size: 13px;
  color: var(--fg-subtle);
}
.rail-flyout .rail-org {
  flex-shrink: 0;
}
.rail-flyout .rail-link {
  min-height: 32px;
  padding: 4px 8px;
}
.rail-no-projects {
  padding: 0 8px;
}
.rail-popup {
  bottom: 64px;
  width: 200px;
  max-height: calc(100dvh - 80px);
  overflow-y: auto;
}
.rail-popup button {
  width: 100%;
  justify-content: flex-start;
  border: 0;
  background: none;
  text-align: left;
}
.rail-popup button:hover {
  background: var(--line);
}
/* Rail rows are aius.co's navigation pills: a hairline on hover, the violet wash when current. */
.rail-link {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--fg);
  padding: 8px 12px;
  min-height: 40px;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: -0.02em;
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: 8px;
}
.rail-link svg.icon {
  opacity: 0.64;
}
.rail-link span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* A quiet row: hover and the current page are a soft fill, not an outlined pill. */
.rail-link:hover {
  background: var(--rail-line);
}
.rail-link[aria-current="page"] {
  color: var(--brand);
  background: var(--brand-subtle);
  font-weight: 600;
}
/* A row that is a button (New organisation, Report a problem) is the same full-width row as a link: none of the
   generic button's pill, margin or hover edge. */
button.rail-link {
  width: 100%;
  margin: 0;
  justify-content: flex-start;
  background: transparent;
  text-align: left;
}
button.rail-link:hover:not(:disabled) {
  border-color: transparent;
  background: var(--rail-line);
}
.rail-link[aria-current="page"] svg.icon {
  opacity: 1;
}
.rail-bottom {
  border-top: 1px solid var(--line);
  padding-top: 8px;
  margin-top: 12px;
}
.rail-account {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
}
.rail-res {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  gap: 2px 6px;
  font-size: 13px;
  padding: 8px 8px 4px;
}
.rail-res a {
  color: var(--fg-muted);
  text-decoration: none;
  white-space: nowrap;
}
.rail-res a:hover {
  text-decoration: underline;
}
.rail-res-sep {
  color: var(--line);
}
.rail-account .identity {
  min-width: 0;
  flex: 1;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
}
.rail-account .identity .annotation {
  font-size: 12px;
  font-weight: 400;
}
.rail-account .identity > span {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.account-link {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}
.account-link .avatar {
  flex-shrink: 0;
}
.avatar {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  background: var(--line);
  border-radius: 50%;
  font-size: 12px;
  font-weight: 500;
  flex: 0 0 28px;
}
.main {
  margin-left: var(--rail-width);
  min-width: 0;
}
.mobile-top {
  display: none;
}
.mast {
  position: sticky;
  top: var(--topbar);
  z-index: 40;
  min-height: 49px;
  padding: 0 var(--gutter);
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
/* Project and activity tabs are aius.co's .dv-tab pills; the current tab is the ink pill. */
.tabs {
  display: flex;
  align-items: center;
  align-self: stretch;
  gap: 6px;
  overflow-x: auto;
  min-width: 0;
  font-family: var(--font-doc);
}
.tabs a {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  height: 32px;
  padding: 0 14px;
  color: var(--ink-2);
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.45;
  text-decoration: none;
  white-space: nowrap;
}
.tabs a:hover {
  background: var(--surface);
}
.tabs a[aria-current="page"] {
  color: #ffffff;
  background: var(--gradient-ink);
  border-color: rgb(0 0 0 / 0.4);
}
@media screen {
  :root[data-theme="dark"] .tabs a[aria-current="page"] {
    color: #0a0a0a;
    background: #eeeeee;
    border-color: #eeeeee;
  }
}
.mast-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.mast-actions > .icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.mast-actions > button:not(.icon-button) {
  height: 32px;
  min-height: 32px;
  padding-block: 0;
  font-size: 13px;
  line-height: 1.2;
}
.content {
  padding: 32px var(--gutter) 72px;
  min-width: 0;
}
.mast:empty {
  display: none;
}
.portal-content {
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
}
.portal-content > .content,
.content.portal-content {
  padding-inline: 16px;
}
.report-exports {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 24px;
  margin-bottom: 16px;
  font-size: 13px;
}
.report-export-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
}
.report-export-actions a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.report-export-actions [aria-disabled="true"] {
  opacity: 0.6;
}
.report-exports [role="status"] {
  flex-basis: 100%;
  overflow-wrap: anywhere;
  margin: 0;
}
.report-editor {
  --editor-offset: calc(var(--topbar) + 49px);
}
.report-editor-heading h1 {
  font-size: 24px;
  margin: 0;
}
.report-editor-heading p {
  margin: 8px 0 24px;
  color: var(--fg-muted);
  overflow-wrap: anywhere;
}
.report-editor-bar {
  position: sticky;
  top: var(--editor-offset);
  z-index: 30;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 12px 0;
  border-block: 1px solid var(--line);
  background: var(--bg);
  margin-bottom: 24px;
}
.report-editor-bar button,
.report-edit-actions button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.report-editor-modes {
  display: flex;
  gap: 2px;
  margin-right: auto;
}
.report-editor-modes [aria-pressed="true"] {
  color: #ffffff;
  background: var(--gradient-ink);
  border-color: rgb(0 0 0 / 0.4);
}
#report-editor-status {
  font-size: 13px;
  color: var(--fg-muted);
}
#report-editor-error,
#report-editor-warnings,
#report-editor-exit {
  flex-basis: 100%;
  overflow-wrap: anywhere;
}
#report-editor-error {
  color: var(--danger);
}
#report-editor-warnings {
  font-size: 13px;
}
#report-editor-warnings ul {
  margin: 8px 0 0;
  padding-left: 20px;
}
#report-editor-exit:not([hidden]) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.report-editor-grid {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}
.report-editor-grid[hidden] {
  display: none;
}
.report-editor-grid nav {
  position: sticky;
  top: calc(var(--editor-offset) + var(--editor-bar-height, 56px) + 24px);
  min-width: 0;
  max-height: calc(100dvh - var(--editor-offset) - var(--editor-bar-height, 56px) - 48px);
  overflow: auto;
}
.report-editor-grid nav a {
  display: block;
  padding: 6px 0;
  color: var(--fg-muted);
  text-decoration: none;
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.report-editor-grid nav a:hover {
  color: var(--fg);
}
.report-editor form {
  min-width: 0;
  max-width: 800px;
}
.report-editor fieldset {
  min-width: 0;
  border: 0;
  padding: 0;
  margin: 0;
}
.report-edit-section {
  border-bottom: 1px solid var(--line);
  padding-bottom: 32px;
  margin-bottom: 32px;
  scroll-margin-top: calc(var(--editor-offset) + var(--editor-bar-height, 56px) + 24px);
}
.report-edit-section h2 {
  font-size: 20px;
  margin: 0 0 20px;
  overflow-wrap: anywhere;
}
.report-edit-section label {
  display: block;
  margin-bottom: 16px;
  font-size: 13px;
}
.report-edit-section input,
.report-edit-section textarea,
.report-edit-section select {
  display: block;
  margin-top: 6px;
  width: 100%;
  box-sizing: border-box;
  min-width: 0;
}
.report-edit-section textarea {
  resize: vertical;
  min-height: 100px;
}
.report-edit-section [data-editor-widget] {
  margin-top: 24px;
}
.report-edit-section legend {
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 12px;
  text-transform: capitalize;
}
.report-edit-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
#report-editor-preview .content {
  padding-inline: 0;
}
#report-editor-preview :is([id^="section-"], #summary, #sources) {
  scroll-margin-top: calc(var(--editor-offset) + var(--editor-bar-height, 56px) + 24px);
}
@media (max-width: 959px) {
  .report-editor-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .report-editor-grid nav {
    position: static;
    max-height: 140px;
  }
}
@media print {
  .report-exports,
  .report-editor-bar,
  .report-editor-grid,
  .report-editor-heading {
    display: none !important;
  }
}
@media (max-height: 560px) {
  .report-editor-bar,
  .report-editor-grid nav {
    position: static;
  }
}
.report,
[data-document-outline] {
  min-width: 0;
}
/* Tables are aius.co's .tbl: 12.5px cells, small uppercase heads, hairline rows. */
table {
  border-collapse: collapse;
  width: 100%;
  font-size: 12.5px;
  text-align: left;
}
th,
td {
  padding: 9px 12px;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
  overflow-wrap: anywhere;
}
th {
  font-weight: 500;
  color: var(--fg-muted);
}
thead th {
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
td.number {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
@media print {
  .foundation-tile > :is(.section-kicker, h2, .foundation-deck, .annotation) {
    break-after: avoid;
  }
}
details {
  border-top: 1px solid var(--line);
  padding: 12px 0;
}
summary {
  cursor: pointer;
  font-weight: 500;
}
details > :not(summary) {
  margin-top: 16px;
}
.evidence-download {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  max-width: 100%;
}
.evidence-download .icon {
  flex-shrink: 0;
  align-self: center;
}
.evidence-download span,
.evidence-unavailable,
.notebook-source,
.method-key-numbers,
.check-list div {
  overflow-wrap: anywhere;
  min-width: 0;
}
@media print {
  :focus-visible {
    outline: none !important;
  }
}
.toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 24px;
}
.toolbar h1,
.toolbar h2,
.toolbar h3 {
  margin: 0;
}
.empty {
  padding: 40px 0;
  max-width: 65ch;
}
.empty h1 {
  font-size: 24px;
}
.rows {
  border-top: 1px solid var(--line);
}
.item-row {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}
/* A list followed by a section closes with that section's rule instead of drawing a second line above it. */
.rows:has(+ .settings-section) > .item-row:last-child,
.settings-section:has(+ .settings-section) > .rows:last-child > .item-row:last-child {
  border-bottom: 0;
}
.item-main {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}
.item-main a {
  font-weight: 500;
}
.row-actions {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
}
.project-list-row {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
}
.project-list-icon {
  align-self: start;
  padding-top: 3px;
  opacity: 0.64;
}
/* The projects list keeps aius.co's rows: each project a 12px-rounded hairline card, 8px apart. */
.projects-view .rows {
  display: grid;
  gap: 8px;
  border-top: 0;
}
.projects-view .rows > .item-row.project-list-row {
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--bg);
}
/* aius.co's project row: a 14px medium name over 12px dates and links. */
.projects-view .project-list-row .item-main > a {
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}
.projects-view .project-list-row .item-main .annotation,
.projects-view .project-list-measures {
  font-size: 12px;
}
.projects-view > .toolbar h1 {
  padding-top: 3px;
  font-size: clamp(28px, 2.6vw, 36px);
  font-weight: 500;
  letter-spacing: -0.045em;
  line-height: 1;
}
.project-name-form {
  display: grid;
  grid-template-columns: minmax(120px, 240px) auto auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
}
.project-name-form input {
  width: 100%;
  min-width: 0;
}
.project-name-form [role="alert"] {
  grid-column: 1 / -1;
  margin: 0;
  overflow-wrap: anywhere;
}
.projects-view > .toolbar,
.projects-view > .toolbar > .row-actions {
  flex-wrap: wrap;
  max-width: 100%;
}
@media (max-width: 599px) {
  .project-create {
    flex-basis: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .project-create input {
    grid-column: 1 / -1;
  }
}
@media (max-width: 899px) {
  .project-rename {
    grid-column: 2 / -1;
    grid-template-columns: minmax(0, 1fr) auto auto;
  }
}
@media (max-width: 399px) {
  .project-rename {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .project-rename input {
    grid-column: 1 / -1;
  }
}
.project-list-measures {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  margin-top: 4px;
}
.project-list-measures a {
  color: var(--fg-muted);
  font-weight: 400;
}
.project-download-error {
  grid-column: 2 / -1;
  margin: 0;
}
.project-delete-action {
  border-left: 1px solid var(--line);
  padding-left: 8px;
  margin-left: 4px;
}
@media (max-width: 599px) {
  .projects-view .project-list-row > .row-actions {
    grid-column: 2 / -1;
    max-width: none;
  }
  .projects-view > .toolbar > .row-actions {
    max-width: none;
  }
}
.shared .main {
  margin-left: 0;
}
/* Every page reads at one measure (user review, 2026-09-28). A shared report is centred at 1200px. Project views
   put their text on the same lines as the projects list and settings: the box is centred on the whole main area,
   not just the column left of the dock, and widened by the extra gutter they inset their text with. */
.shared .content.report-layout {
  max-width: 1200px;
  margin-inline: auto;
}
.project-content > .content {
  --measure: calc(1200px + 2 * (var(--gutter) - 16px));
  max-width: var(--measure);
  margin-left: max(0px, (100% + var(--dock-width) - var(--measure)) / 2);
}
.shared .mast {
  justify-content: space-between;
}
.shared-identity {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}
.shared-identity > a {
  display: flex;
  flex-shrink: 0;
}
.shared .mast .aius-wordmark {
  width: 98px;
  height: 20px;
}
.shared-status {
  font-size: 13px;
  color: var(--fg-muted);
  white-space: nowrap;
}
.setup-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 24px;
}
.setup-head h2 {
  margin: 0;
}
.setup-head .icon-button {
  margin-left: auto;
}
/* Each authorization reads as a small status chip: a dot, the scope, and its state. */
.terminal-access-status {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
}
.terminal-access-status > div {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 13px;
}
.terminal-access-status dt {
  color: var(--fg-muted);
}
.terminal-access-status dd {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  font-weight: 500;
}
.terminal-access-status dd::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--line-bold);
}
.terminal-access-status dd[data-state="on"]::before {
  background: #1a9e5c;
}
.terminal-access-status dd[data-state="off"]::before {
  background: #d98a00;
}
.terminal-access-status dd:has(.aius-skeleton-line)::before {
  display: none;
}
.project-setup [data-setup-status] {
  margin: 12px 0 0;
}
.project-setup details {
  margin-top: 16px;
  border-top: 1px solid var(--line);
  padding-top: 16px;
}
.project-setup summary {
  font-weight: 500;
  cursor: pointer;
}
.setup-steps {
  display: grid;
  gap: 20px;
  margin: 20px 0 4px;
  padding: 0;
  list-style: none;
  counter-reset: setup-step;
}
.setup-steps > li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  column-gap: 12px;
  row-gap: 10px;
  counter-increment: setup-step;
}
.setup-steps > li::before {
  content: counter(setup-step);
  display: inline-flex;
  width: 24px;
  height: 24px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  color: var(--fg-muted);
  font: 500 12px/1 var(--font-mono);
}
.setup-steps > li > * {
  grid-column: 2;
  margin: 0;
  max-width: 720px;
}
.setup-steps > li > h3 {
  grid-row: 1;
  align-self: center;
  font-size: 15px;
  font-weight: 600;
}
.setup-steps p {
  color: var(--fg-muted);
  font-size: 14px;
  line-height: 1.5;
}
.setup-steps code {
  font-family: var(--font-mono);
  font-size: 0.92em;
}
/* A terminal line: dark in both themes, so a command always reads as something to paste into a shell. */
.command-line {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 44px;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 2px 2px 2px 14px;
  border-radius: 10px;
  background: #1b171e;
  color: #f5f1f6;
}
.command-line > span[aria-hidden] {
  color: #75d7e5;
  font: 500 12px var(--font-mono);
}
.setup-steps .command-line code {
  overflow-x: auto;
  font: 13px/1.4 var(--font-mono);
  white-space: nowrap;
  scrollbar-width: thin;
}
.command-line .icon-button {
  color: #e7e1ea;
}
.command-line .icon-button:hover {
  background: rgb(255 255 255 / 0.1);
  color: #fff;
}
.command-line .copy-status {
  position: absolute;
  right: 48px;
  padding: 2px 8px;
  border-radius: 6px;
  background: #1b171e;
  color: #c7f0d8;
  font-size: 12px;
}
.command-line .copy-status:empty {
  display: none;
}
/* The v1 example card: a tinted ground, pill tabs, the prompt as a quotation and what comes back. */
.analysis-examples {
  margin-top: 24px;
  padding: 16px 24px 24px;
  border-radius: 20px;
  background: color-mix(in srgb, var(--brand) 4%, var(--bg));
}
.examples-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
}
.examples-kicker {
  margin: 0;
  color: var(--fg-muted);
  font: 500 12px/1.35 var(--font-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.examples-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.examples-controls button {
  min-height: 40px;
  padding: 0 14px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--fg-muted);
  font-size: 14px;
  font-weight: 500;
}
.examples-controls button:hover {
  background: color-mix(in srgb, var(--bg) 60%, transparent);
  color: var(--fg);
}
.examples-controls button[aria-pressed="true"] {
  box-shadow: inset 0 0 0 1.5px var(--brand);
  color: var(--brand);
}
.example-body {
  padding: 20px 0 0;
}
.example-title {
  max-width: 680px;
  margin: 0 0 16px;
  font-size: 20px;
  font-weight: 650;
  letter-spacing: -0.02em;
  line-height: 1.3;
}
.example-meta {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--fg-muted);
  font: 500 13px var(--font-mono);
}
.example-meta .copy-status {
  margin-left: 4px;
  font-family: var(--font-sans);
}
.example-prompt {
  max-width: 680px;
  margin: 4px 0 0;
  padding: 0;
  border: 0;
  font-size: 18px;
  line-height: 1.5;
  letter-spacing: -0.015em;
}
.example-prompt::before {
  content: "\201c";
}
.example-prompt::after {
  content: "\201d";
}
.example-output {
  margin: 20px 0 0;
}
.example-output dt {
  color: var(--fg-muted);
  font: 500 13px var(--font-mono);
}
.example-output dd {
  max-width: 680px;
  margin: 4px 0 0;
  font-size: 16px;
  line-height: 1.5;
}
/* Each settings section is an aius.co .frame: one hairline box, 24px inset, 24px apart. */
.settings-section {
  margin-top: 24px;
  padding: 24px;
  border: 1px solid var(--line);
}
.account-view .settings-section:first-of-type {
  margin-top: 24px;
}
.account-deletion {
  border-color: var(--danger-line);
}
.account-deletion > h2 {
  color: var(--danger);
}
.account-details {
  display: grid;
  gap: 16px;
  margin: 20px 0 0;
}
/* aius.co's account fields: a 14px medium label over its value in muted ink. */
.account-details dt {
  font-size: 14px;
  font-weight: 500;
}
.account-details dd {
  margin: 4px 0 0;
  color: var(--fg-muted);
  font-size: 14px;
  overflow-wrap: anywhere;
}
.account-email {
  overflow-wrap: anywhere;
}
.account-view form {
  max-width: 480px;
}
#profile-form {
  display: grid;
  gap: 12px;
}
#profile-form[hidden] {
  display: none;
}
#profile-form > input {
  width: 100%;
  min-width: 0;
}
#profile-form > .dialog-error {
  margin: 0;
}
.account-view .toolbar {
  flex-wrap: wrap;
}
.account-view button {
  white-space: normal;
}
.account-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.deletion-organisations {
  overflow-wrap: anywhere;
  padding-left: 20px;
}
.activity-events {
  list-style: none;
  padding: 0;
  margin: 16px 0 0;
}
.section-link {
  font-size: 14px;
  white-space: nowrap;
}
.project-recent-activity .toolbar {
  flex-wrap: nowrap;
  align-items: center;
}
.project-recent-activity h2 {
  margin: 0;
}
.project-recent-activity .row-actions {
  flex-wrap: nowrap;
  align-items: center;
}
.activity-events li {
  border-bottom: 1px solid var(--line);
  padding: 12px 0;
  overflow-wrap: anywhere;
}
.activity-event-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 16px;
}
.activity-event-heading strong {
  font-weight: 500;
}
.activity-event-heading time {
  color: var(--fg-muted);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.activity-events p {
  margin: 4px 0 0;
}
.files-empty-preview {
  display: grid;
  justify-items: center;
  gap: 12px;
  margin: 72px auto;
  max-width: 260px;
  text-align: center;
}
.files-empty-preview svg {
  width: 28px;
  height: 28px;
  opacity: 0.6;
}
.activity-view > .tabs {
  flex-wrap: wrap;
  margin-bottom: 12px;
}
/* A back link is aius.co's "← Projects": 13px, muted, no rule. */
.activity-view > a[data-nav]:first-child {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 12px;
  color: var(--fg-muted);
  font-size: 13px;
  text-decoration: none;
}
.activity-view > a[data-nav]:first-child:hover {
  color: var(--fg);
}
.activity-view > a[data-nav]:first-child svg.icon {
  width: 14px;
  height: 14px;
  flex-basis: 14px;
}
.two-factor {
  border-top: 1px solid var(--line);
  padding-top: 24px;
  margin-top: 24px;
}
.mfa-qr {
  display: block;
  width: 256px;
  max-width: 100%;
  aspect-ratio: 1;
  background: white;
}
.mfa-secret,
.mfa-recovery {
  font-family: var(--font-mono);
  font-size: 13px;
}
.mfa-recovery {
  list-style: none;
  padding: 0;
  display: grid;
  gap: 8px;
  overflow-wrap: anywhere;
}
.budget-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr));
  gap: 24px;
  margin: 24px 0 0;
}
.budget-summary dt {
  color: var(--fg-muted);
  font-size: 13px;
}
.budget-summary dd {
  margin: 4px 0 0;
  font-size: 20px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.org-table {
  width: 100%;
  min-width: 620px;
  font-size: 13px;
}
.org-table th,
.org-table td {
  text-align: left;
  padding: 12px 8px;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.org-table th {
  color: var(--fg-muted);
  font-weight: 500;
}
.org-table td {
  max-width: 240px;
  overflow-wrap: anywhere;
}
.org-table td:nth-last-child(-n + 2) {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.request-id {
  display: block;
  font-family: var(--font-mono);
}
.usage-pager {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 16px;
}
.activity-pager {
  margin: 0 0 16px;
}
.ownership-action {
  margin-top: 16px;
}
/* Ownership, leaving and deleting sit in one row that wraps evenly on a phone. */
.ownership-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.ownership-actions:empty {
  display: none;
}
.ownership-actions .ownership-action,
.ownership-actions .ownership-action.danger {
  margin: 0;
}
/* A text action inside running text, drawn like a link. */
.org-standing .link-button {
  min-height: 0;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  color: var(--fg);
  cursor: pointer;
  text-decoration-line: underline;
  text-decoration-color: var(--line-strong);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.org-standing .link-button:hover {
  text-decoration-color: currentColor;
}
.check-field {
  display: flex;
  align-items: start;
  gap: 10px;
  margin: 16px 0;
  font-size: 13px;
}
.check-field input {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin: 2px 0 0;
  accent-color: var(--brand);
}
.form-field {
  display: grid;
  gap: 6px;
  margin: 16px 0;
  font-size: 13px;
}
/* A choice among a few options, such as a credit amount: the options sit in one row without a box. */
fieldset.form-field {
  border: 0;
  padding: 0;
  min-width: 0;
  grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
}
fieldset.form-field legend {
  grid-column: 1 / -1;
  padding: 0;
  margin-bottom: 6px;
}
fieldset.form-field .check-field {
  margin: 0;
  align-items: center;
}
input,
select,
textarea {
  width: 100%;
  padding: 0 16px;
  color: var(--fg);
  font-size: 14px;
}
input:not([type="checkbox"], [type="radio"]),
select {
  min-height: 44px;
}
/* Where the browser lets a select be restyled, it is ours: an inset chevron that follows the theme, and a small card
   of rows for the open list instead of the system menu. Elsewhere the browser's own select stays. The chevron is a
   mask on the picker icon, not a background image, so contrast checks can still read the value behind it. */
@supports (appearance: base-select) {
  select,
  ::picker(select) {
    appearance: base-select;
  }
  select {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
  }
  select.rail-org {
    display: flex;
  }
  select::picker-icon {
    content: "";
    flex: none;
    width: 16px;
    height: 16px;
    margin-left: auto;
    background: var(--fg-muted);
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")
      center / 16px 16px no-repeat;
    transition: rotate 120ms ease;
  }
  select:open::picker-icon {
    rotate: 180deg;
  }
  ::picker(select) {
    margin-block: 6px;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--bg);
    color: var(--fg);
    box-shadow: var(--shadow-lg);
  }
  option {
    min-height: 36px;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 14px;
  }
  option:hover,
  option:focus-visible {
    background: var(--surface-raised);
    outline: none;
  }
  option:checked {
    font-weight: 600;
  }
  option::checkmark {
    order: 1;
    margin-left: auto;
    color: var(--brand);
  }
}
textarea {
  min-height: 110px;
  padding: 12px 16px;
  border-radius: var(--radius-lg);
  resize: vertical;
}
/* Dialogs are aius.co's modal: a hairline, 16px corners and a deep soft shadow over a frosted page. */
dialog {
  width: min(520px, calc(100vw - 32px));
  max-height: calc(100dvh - 48px);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 24px;
  background: var(--bg);
  color: var(--fg);
  box-shadow: var(--shadow-modal);
}
dialog::backdrop {
  background: rgb(255 255 255 / 0.55);
  backdrop-filter: blur(18px) saturate(140%);
}
@media screen {
  :root[data-theme="dark"] dialog::backdrop {
    background: rgb(0 0 0 / 0.55);
  }
}
dialog > form > p {
  overflow-wrap: anywhere;
}
.dialog-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.dialog-heading h2 {
  font-size: 18px;
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}
.dialog-heading + p {
  margin-top: 8px;
}
.dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 24px;
}
.dialog-error {
  color: var(--danger);
  font-size: 13px;
  overflow-wrap: anywhere;
}
.share-subject {
  margin: 4px 0 0;
  overflow: hidden;
  color: var(--fg-muted);
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.share-scope {
  margin: 16px 0 0;
  color: var(--fg-muted);
  font-size: 13px;
  line-height: 1.5;
}
/* Expiry and the create button sit on one line; they stack only on a narrow phone. */
.share-create {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  margin-top: 16px;
}
.share-create .form-field {
  flex: 1;
  margin: 0;
}
.share-create button {
  flex: none;
  min-height: 44px;
}
@media (max-width: 420px) {
  .share-create {
    flex-direction: column;
    align-items: stretch;
  }
}
.share-list-heading {
  margin: 24px 0 4px;
}
.share-list-heading h3 {
  font-size: 14px;
}
.share-list .item-row {
  align-items: start;
}
.share-result {
  display: flex;
  gap: 8px;
  margin-top: 16px;
}
#notice {
  position: fixed;
  bottom: 24px;
  right: 24px;
  max-width: min(440px, calc(100vw - 48px));
  padding: 12px 16px;
  background: var(--tip-bg);
  color: var(--tip-fg);
  border: 1px solid var(--tip-line);
  border-radius: var(--radius);
  z-index: 100;
}
body.rail-slim .rail {
  width: var(--rail-slim);
}
body.rail-slim .main {
  margin-left: var(--rail-slim);
}
body.rail-slim .rail-top {
  padding: 0 4px 20px;
  flex-direction: column;
  gap: 16px;
}
body.rail-slim .rail-org,
body.rail-slim .rail-link span,
body.rail-slim .rail-account .identity {
  display: none;
}
body.rail-slim .rail-top .aius-wordmark {
  width: 24px;
  mask-size: 98px 20px;
  mask-position: left center;
}
body.rail-slim .rail-account {
  padding: 4px;
  flex-direction: column;
}
body.rail-slim .rail-link {
  justify-content: center;
}
body.rail-slim .rail-flyout .rail-link,
body.rail-slim .rail-popup .rail-link {
  justify-content: start;
}
body.rail-slim .rail-flyout .rail-link span,
body.rail-slim .rail-flyout .rail-org {
  display: block;
}
@media (min-width: 960px) {
  body.rail-slim .rail-expanded {
    display: none;
  }
  body.rail-slim .rail-slim-controls {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  body.rail-slim .rail > .rail-slim-controls {
    flex: 1;
    align-items: start;
  }
  body.rail-slim .rail-bottom {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
  }
}
.drawer-cover {
  display: none;
}
@media (max-width: 1279px) {
  :root {
    --gutter: 24px;
  }
}
@media (max-width: 959px) {
  .mast-actions > button:not(.icon-button) {
    height: 44px;
    min-height: 44px;
  }
  :root {
    --gutter: 16px;
    --topbar: 56px;
  }
  .mobile-top {
    display: flex;
    height: 56px;
    position: sticky;
    top: 0;
    z-index: 50;
    justify-content: space-between;
    align-items: center;
    padding: 0 16px;
    background: var(--bg);
    border-bottom: 1px solid var(--line);
  }
  .mobile-top .aius-wordmark {
    width: 98px;
    height: 20px;
  }
  .rail {
    transform: translateX(-100%);
    width: 264px !important;
  }
  body.drawer-open .rail {
    transform: none;
  }
  body.drawer-open {
    overflow: hidden;
  }
  body.drawer-open .drawer-cover {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 55;
    background: rgb(14 12 16 / 0.28);
    border: 0;
    border-radius: 0;
    width: 100%;
    height: 100%;
  }
  .main,
  body.rail-slim .main {
    margin-left: 0;
  }
  .shared {
    --topbar: 0px;
  }
  body.rail-slim .rail-top > a,
  body.rail-slim .rail-org,
  body.rail-slim .rail-link span,
  body.rail-slim .rail-account .identity {
    display: block;
  }
  body.rail-slim .rail-link {
    justify-content: start;
  }
  body.rail-slim .rail-top {
    flex-direction: row;
  }
  body.rail-slim .rail-account {
    flex-direction: row;
  }
  body.rail-slim .rail-top .aius-wordmark {
    width: 98px;
    mask-size: contain;
  }
}
@media (max-width: 599px) {
  .mast {
    gap: 4px;
    padding: 0 8px;
  }
  .tabs a {
    padding: 0 8px;
  }
  .mast-actions .share-text {
    display: none;
  }
  .shared-identity {
    gap: 12px;
  }
  .shared-prefix {
    display: none;
  }
  .item-row {
    gap: 8px;
  }
  /* aius.co's inset steps down to 20px on phones. */
  .settings-section {
    padding: 20px;
  }
  .analysis-examples {
    padding: 12px 16px 20px;
  }
  /* On a phone the status chips take their own row under the heading and its refresh button. */
  .setup-head .terminal-access-status {
    order: 3;
    flex-basis: 100%;
  }
  /* A phone shows the whole command rather than a sliver that has to be scrolled sideways. */
  .setup-steps .command-line code {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font-size: 12px;
  }
  .setup-steps > li {
    grid-template-columns: minmax(0, 1fr);
  }
  .setup-steps > li::before {
    display: none;
  }
  .setup-steps > li > * {
    grid-column: 1;
    grid-row: auto;
  }
  .example-title {
    font-size: 18px;
  }
  .example-prompt {
    font-size: 16px;
  }
  /* The 32-character authenticator secret stays on one line inside the phone frame. */
  .mfa-secret {
    padding: 0 12px;
    font-size: 11px;
  }
  .row-actions {
    flex-wrap: wrap;
    max-width: 96px;
  }
  .toolbar {
    flex-wrap: wrap;
  }
}
@media print {
  .print-brand {
    display: block;
    margin-bottom: 24px;
    print-color-adjust: exact;
  }
  .rail,
  .mobile-top,
  .mast,
  .outline,
  .mobile-contents,
  .toolbar button,
  .skip-link,
  #notice,
  dialog {
    display: none !important;
  }
  .main,
  body.rail-slim .main {
    margin: 0;
  }
  .content,
  .portal-content > .content,
  .content.portal-content {
    padding: 0;
  }
}
.file-search {
  width: min(100%, 400px);
  margin-bottom: 16px;
}
.files-browser {
  display: grid;
  grid-template-columns: minmax(260px, 400px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.files-browser > section {
  min-width: 0;
}
.files-view > .toolbar .row-actions {
  max-width: none;
  align-items: center;
}
.files-view > .toolbar button {
  white-space: nowrap;
}
[data-project-archive][aria-busy="true"] {
  opacity: 0.5;
  cursor: wait;
}
.files-pane-head {
  position: sticky;
  top: calc(var(--topbar) + 49px);
  z-index: 2;
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  padding-bottom: 10px;
  min-width: 0;
}
.files-pane-head h2 {
  font-size: 15px;
  line-height: 1.55;
  font-weight: 500;
  overflow-wrap: anywhere;
  margin: 0;
}
.files-pane-head p {
  margin: 4px 0 0;
  overflow-wrap: anywhere;
}
.files-pane-head .file-search {
  width: 100%;
  max-width: none;
  margin: 12px 0 0;
}
.files-preview .row-actions {
  max-width: none;
}
.files-tree-scroll,
.files-content-scroll {
  max-height: max(180px, calc(100dvh - var(--mast-height) - var(--topbar) - 200px));
  /* At either end the page takes over the scroll, as in any document. */
  overscroll-behavior-x: contain;
  overscroll-behavior-y: auto;
  margin-top: 12px;
}
.files-tree-scroll {
  overflow-y: auto;
  overflow-x: hidden;
}
.files-content-scroll {
  overflow: auto;
  min-width: 0;
  padding: 0 4px 4px;
}
.files-tree-scroll .files-directory {
  border: 0;
  border-radius: 0;
  padding: 0;
  margin: 0;
  min-width: 0;
}
.files-directory > summary,
.files-tree-scroll [data-file-select] {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 6px 8px;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.5;
  white-space: nowrap;
  color: var(--fg);
  text-decoration: none;
  margin: 2px 0;
  min-width: 0;
}
.files-directory > summary {
  font-weight: 500;
  list-style: none;
}
.files-directory > summary::-webkit-details-marker,
.files-directory > summary::after {
  display: none;
}
.files-directory > summary .icon:first-child {
  width: 12px;
  flex-basis: 12px;
}
.files-directory[open] > summary .icon:first-child {
  transform: rotate(90deg);
}
.files-directory > summary:hover,
.files-tree-scroll [data-file-select]:hover,
.files-tree-scroll [aria-current="true"] {
  background: var(--surface-raised);
}
.files-tree-scroll [aria-current="true"] {
  font-weight: 500;
}
.files-tree-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.files-tree-size {
  flex-shrink: 0;
  color: var(--fg-muted);
  margin-left: auto;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.files-tree-children {
  margin-top: 0;
  margin-left: 16px;
  padding-left: 8px;
  border-left: 1px solid var(--line);
  min-width: 0;
}
.files-tree-children .files-tree-children .files-tree-children {
  margin-left: 4px;
  padding-left: 4px;
}
.files-view .files-tree-children.files-tree-flat {
  margin-left: 0;
  padding-left: 0;
  border-left: 0;
}
.artifact-pre,
.notebook-code,
.notebook-output {
  margin: 0;
  padding: 12px 14px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font: 12.5px/1.5 var(--font-code);
  background: var(--surface);
}
.artifact-image,
.notebook-image {
  display: block;
  max-width: 100%;
  height: auto;
}
.file-preview-table {
  border-collapse: collapse;
  width: 100%;
  font-size: 12.5px;
}
.file-preview-table th,
.file-preview-table td {
  border: 1px solid var(--line);
  padding: 6px 10px;
  text-align: left;
  white-space: pre-wrap;
  min-width: 80px;
  max-width: 360px;
  overflow-wrap: anywhere;
}
.file-preview-table th {
  background: var(--surface);
  font-weight: 600;
}
.file-notebook {
  display: grid;
  gap: 16px;
}
.file-notebook-cell {
  border-bottom: 1px solid var(--line);
  min-width: 0;
}
.file-notebook-cell > h3 {
  color: var(--fg-muted);
  font-size: 13px;
  font-weight: 500;
  margin: 0 0 8px;
}
.notebook-output {
  border-top: 1px solid var(--line);
  background: var(--bg);
}
.notebook-error {
  color: var(--danger);
  background: var(--flag-bg);
}
.files-content-scroll .prose {
  font-size: 14px;
  line-height: 1.55;
}
.files-content-scroll .prose :is(h1, h2, h3, h4, h5, h6) {
  font-weight: 600;
  line-height: 1.2;
  margin: 0.8em 0 0.4em;
}
.files-content-scroll .prose h1 {
  font-size: 22px;
}
.files-content-scroll .prose h2 {
  font-size: 19px;
}
.files-content-scroll .prose h3 {
  font-size: 16px;
}
.files-content-scroll .prose h4 {
  font-size: 14px;
}
.files-content-scroll .prose :is(h5, h6) {
  font-size: 13px;
}
.files-content-scroll .prose p {
  margin: 0.5em 0;
}
.files-content-scroll .prose :is(ul, ol) {
  padding-left: 1.4em;
  margin: 0.5em 0;
}
.files-content-scroll .prose li {
  margin: 0.2em 0;
}
@media (max-width: 1023px) {
  .files-browser {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }
  .files-tree-scroll {
    max-height: 60dvh;
  }
  .files-content-scroll {
    max-height: 85dvh;
  }
}
@media print {
  .files-browser {
    display: block;
  }
  .files-navigation,
  .files-preview .row-actions {
    display: none;
  }
  .files-content-scroll {
    overflow: visible;
    max-height: none;
  }
  .files-pane-head {
    position: static;
  }
}
@media (max-height: 480px) {
  .files-pane-head {
    position: static;
  }
}
.outputs-view {
  min-width: 0;
  overflow-wrap: anywhere;
}
.outputs-header h1 {
  margin: 0;
  font-size: 24px;
  font-weight: 500;
  line-height: 1.1;
}
.outputs-view .output-section {
  margin-top: 32px;
}
.outputs-view #handoff {
  margin-top: 40px;
}
.outputs-view h2 {
  margin: 0;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: var(--ls-title);
}
.outputs-view h3 {
  font-weight: 500;
}
.handoff-brief {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(216px, 0.8fr) auto;
  align-items: center;
  gap: 24px;
  border-block: 1px solid var(--line);
  margin-top: 24px;
  padding: 24px 0;
}
.handoff-brief__lead h3 {
  font-size: 16px;
  line-height: 1.4;
  margin: 12px 0 0;
}
.handoff-brief__lead p {
  margin: 8px 0 0;
  color: var(--fg-muted);
  font-size: 14.5px;
  line-height: 1.55;
}
.handoff-brief dl,
.handoff-brief dt,
.handoff-brief dd {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.4;
}
.handoff-brief dl {
  display: grid;
  gap: 12px;
}
.handoff-brief dt {
  color: var(--fg-muted);
  margin-bottom: 4px;
}
.handoff-brief button {
  white-space: nowrap;
}
.output-state {
  color: var(--fg-muted);
  font-size: 12px;
  line-height: 1.4;
}
.output-list {
  display: grid;
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
}
.output-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(172.8px, auto);
  align-items: center;
  gap: 16px;
  min-height: 72px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  border-radius: 8px;
}
.output-row:first-child {
  border-top: 1px solid var(--line);
}
.output-row h3 {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.45;
}
.output-row p {
  margin: 4px 0 0;
  color: var(--fg-muted);
  font-size: 13px;
  line-height: 1.55;
}
.output-kind {
  color: var(--fg-subtle);
  font-size: 12px;
  line-height: 1.4;
  font-weight: 600;
}
.output-row .output-scope {
  font-size: 12px;
  line-height: 1.4;
}
.output-meta {
  color: var(--fg-muted);
  font-size: 12px;
  line-height: 1.4;
  font-variant-numeric: tabular-nums;
}
.output-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  gap: 12px;
}
.manifest-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-block: 1px solid var(--line);
  margin-top: 24px;
}
.manifest-summary > div {
  display: grid;
  gap: 6px;
  padding: 20px;
}
.manifest-summary > div + div {
  border-left: 1px solid var(--line);
}
.manifest-summary strong {
  font-size: 24px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: var(--ls-title);
  font-variant-numeric: tabular-nums;
}
.manifest-summary span,
.manifest-note {
  font-size: 12px;
  line-height: 1.4;
  color: var(--fg-muted);
}
.manifest-note {
  margin: 0;
  padding: 0 16px 16px;
}
.manifest-exceptions {
  display: grid;
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
}
.manifest-exceptions li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 16px;
  border-top: 1px solid var(--line);
  padding: 12px 0;
}
.manifest-exceptions p {
  margin: 0;
  color: var(--fg-muted);
  font-size: 13px;
  line-height: 1.55;
}
.manifest-table {
  overflow-x: auto;
  padding: 0 16px 16px;
}
.manifest-table table {
  border-collapse: collapse;
  min-width: 504px;
  width: 100%;
  font-size: 12.5px;
  line-height: 1.45;
}
.manifest-table th,
.manifest-table td {
  border-bottom: 1px solid var(--line);
  padding: 9px 12px;
  text-align: left;
}
.manifest-table thead {
  background: var(--surface);
  border-bottom: 1px solid var(--line);
}
.manifest-table thead th {
  color: var(--fg-muted);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.4;
}
.manifest-table tbody th {
  font-weight: 500;
}
.manifest-table td {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.manifest-table [data-unknown] {
  color: var(--fg-muted);
}
.output-branch summary,
.output-branch li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 12px;
  font-size: 12.5px;
  line-height: 1.4;
}
/* Tier B rows inside the evidence card: a leading mark and one rule, no ground. */
.output-branch + .output-branch {
  border-top: 1px solid var(--line);
}
.output-branch summary {
  align-items: center;
  cursor: pointer;
  justify-content: flex-start;
  list-style: none;
  user-select: none;
}
.output-branch summary::-webkit-details-marker {
  display: none;
}
.output-branch summary > span:not(.disclosure-mark) {
  color: var(--fg-muted);
  white-space: nowrap;
  margin-left: auto;
}
.output-branch summary > span.output-branch-path {
  flex: 1;
  color: var(--fg);
  font-weight: 500;
  margin-left: 0;
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: normal;
}
/* A section's list or note starts a little below its title rather than touching it. */
.outputs-view .output-section > .rows,
.outputs-view .output-section > .annotation {
  margin-top: 12px;
}
/* The package's downloads read as a small labelled row of buttons under the heading, not a line of text under it. */
.output-section .report-exports {
  display: grid;
  justify-items: start;
  gap: 8px;
  margin: 12px 0 20px;
}
.output-section .report-export-actions {
  gap: 8px;
}
.output-section .report-export-actions a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--line-strong);
  border-radius: 18px;
  background: var(--bg);
  color: var(--fg);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
}
.output-section .report-export-actions a:hover {
  border-color: var(--line-bold);
}
.output-branch ul {
  list-style: none;
  margin: 0;
  padding: 0 0 0 12px;
}
.output-branch li .annotation {
  flex-shrink: 0;
}
.output-deck {
  margin-top: 24px;
}
.output-deck h3 {
  font-size: 16px;
  line-height: 1.4;
  margin: 0 0 12px;
}
.deck-preview {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(180px, 0.7fr);
  gap: 24px;
  margin-top: 24px;
}
.deck-preview figure {
  margin: 0;
  min-width: 0;
}
.output-slide {
  aspect-ratio: 16 / 9;
  border: 1px solid var(--line);
  display: grid;
  place-items: center;
  background: var(--surface);
  overflow: hidden;
}
.output-slide img {
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: contain;
}
.output-slide p,
.deck-preview figcaption {
  font-size: 13px;
  color: var(--fg-muted);
}
.deck-preview figcaption {
  margin-top: 8px;
}
.deck-outline {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 360px;
  overflow-y: auto;
}
.deck-outline button {
  flex: 0 0 auto;
  min-height: 46px;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 12px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--fg-muted);
  text-align: left;
  background: transparent;
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  padding: 12px 0;
  width: 100%;
}
.deck-outline button:hover {
  color: var(--fg);
  background: transparent;
}
.deck-outline button[aria-pressed="true"] {
  color: var(--fg);
  box-shadow: inset 2px 0 0 var(--brand);
  padding-left: 12px;
}
.deck-outline button span {
  color: var(--fg-muted);
  font-variant-numeric: tabular-nums;
  min-width: 24px;
}
@media (max-width: 719px) {
  .handoff-brief,
  .output-row,
  .deck-preview {
    grid-template-columns: minmax(0, 1fr);
  }
  .handoff-brief button {
    justify-self: start;
  }
  .output-actions {
    justify-content: start;
  }
  .manifest-summary {
    grid-template-columns: minmax(0, 1fr);
  }
  .manifest-summary > div + div {
    border-left: 0;
    border-top: 1px solid var(--line);
  }
}
@media (max-width: 600px) {
  .manifest-exceptions li {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media print {
  .output-actions,
  .handoff-brief button,
  .deck-outline {
    display: none;
  }
  .deck-preview,
  .handoff-brief {
    grid-template-columns: minmax(0, 1fr);
  }
  .manifest-table {
    overflow: visible;
    padding: 0;
  }
  .manifest-table table {
    min-width: 0;
  }
}
.model-list {
  margin: 32px 0;
}
.model-view .toolbar {
  margin-top: 16px;
}
.model-view .toolbar h1 {
  font-size: 24px;
  font-weight: 500;
  margin: 0;
}
.model-files {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin: 16px 0;
  font-size: 12.5px;
}
dialog.slide-dialog {
  width: min(960px, calc(100vw - 32px));
  max-width: none;
}
dialog.presentation-dialog {
  width: min(1280px, calc(100vw - 32px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  padding: 24px;
}
@media (max-width: 760px) {
  dialog.presentation-dialog {
    padding: 16px;
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
  }
}
.publication-revision {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px 24px;
  padding-top: 16px;
  padding-bottom: 0;
  font-size: 12px;
  overflow-wrap: anywhere;
}
.report-switcher {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 10px var(--gutter);
  border-bottom: 1px solid var(--line);
  background: var(--bg);
}
.report-switcher label {
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 600;
}
.report-switcher select {
  width: min(100%, 640px);
  min-width: 0;
  min-height: 36px;
  padding: 0 14px;
  font-size: 13px;
}
@media (max-width: 559px) {
  .report-switcher {
    flex-wrap: wrap;
    gap: 6px;
  }
  .report-switcher select {
    width: 100%;
  }
}
.publication-revision + .content {
  padding-top: 24px;
}
/* Menus in a dialog: one full-width row per action, icon then label, grouped under a small label. */
.action-menu {
  display: grid;
  gap: 2px;
  margin-top: 16px;
}
.action-menu-label,
dialog .report-exports-label {
  margin: 0 0 4px;
  padding-inline: 12px;
  color: var(--fg-muted);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
}
.action-menu > button,
dialog .report-export-actions a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--fg);
  font-size: 15px;
  font-weight: 450;
  text-align: left;
  text-decoration: none;
}
.action-menu > button:hover:not(:disabled),
dialog .report-export-actions a:hover {
  background: var(--surface-raised);
}
.action-menu > button .icon,
dialog .report-export-actions a .icon {
  width: 18px;
  height: 18px;
  flex: none;
  color: var(--fg-muted);
}
.action-menu-danger {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}
.action-menu > button.danger,
.action-menu > button.danger .icon {
  color: var(--danger);
}
dialog .report-exports {
  display: grid;
  gap: 2px;
  margin: 16px 0 0;
}
dialog .report-export-actions {
  display: grid;
  gap: 2px;
}
.dialog-notice {
  margin: 12px 0 0;
  color: var(--fg);
  font-size: 13px;
}
.dialog-notice:empty,
p.annotation:empty {
  display: none;
}
@media (max-width: 359px) {
  /* Beside four 44px tools only the current tab keeps its pill; the others are its label alone. */
  .tabs {
    gap: 0;
  }
  .tabs a {
    padding: 0 4px;
    font-size: 12px;
    letter-spacing: -0.03em;
    border-color: transparent;
    background: none;
  }
  .mast-actions {
    gap: 0;
  }
}

/* Product chrome: the surfaces a reader operates beside the document (Dmytro, 2026-09-20).
   The register is the dev-tool inspector: 13px floor, tight leading, the rail's ground.
   Nothing here styles generated report content, and report styles never reach in here. */

/* Four tracks: document · outline · panel · dock. The outline is the minimap's
   reserved track inside the report layout; the panel track is 0 while closed. */
/* The page ground sinks and objects rise (Dmytro, 2026-09-17): every project view and the shared
   reader sit on --page-ground; the mast band and the rails stay their own grounds. */
body:has(.project-layout),
body.shared {
  background: var(--page-ground);
}
@media print {
  body:has(.project-layout),
  body.shared {
    background: var(--bg);
  }
}
.project-layout {
  --panel-track: 0px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--panel-track) var(--dock-width);
  min-width: 0;
}
.project-layout[data-panel-state="side"] {
  --panel-track: var(--panel-width);
}
.project-content {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
}
/* The map belongs to the document: 16px toward the prose, 32px toward the edge. */
.project-layout .report-layout {
  grid-template-columns: minmax(0, 1fr) 104px;
}
/* In side the panel covers the outline and the document keeps its own right gutter. */
.project-layout[data-panel-state="side"] .report-layout {
  grid-template-columns: minmax(0, 1fr) 0;
  padding-right: var(--gutter);
}
.project-layout[data-panel-state="side"] .outline {
  display: none;
}
/* On a wide window the project tabs and actions line up with the page's text rather than the window's edges;
   narrower, the mast keeps its own padding. */
@media (min-width: 960px) {
  body:has(.project-layout) .mast {
    padding-inline: max(var(--gutter), (100% - 1200px) / 2 + 16px);
  }
}
.project-layout[data-panel-state="full"] .project-content {
  display: none;
}

.project-panel {
  align-self: start;
  background: var(--bg);
  border-left: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  grid-column: 2;
  grid-row: 1;
  height: calc(100dvh - var(--topbar) - var(--mast-height) - 1px);
  min-width: 0;
  position: sticky;
  top: calc(var(--topbar) + var(--mast-height) + 1px);
  z-index: 20;
}
.project-layout[data-panel-state="full"] .project-panel {
  border-left: 0;
  box-shadow: none;
  grid-column: 1 / 3;
}
.project-panel-head {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
  height: 40px;
  justify-content: space-between;
  padding: 0 8px 0 16px;
}
.project-panel-head:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: -2px;
}
.project-panel-title {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  margin: 0;
}
.project-panel-controls {
  display: flex;
  gap: 2px;
}
.project-panel-control {
  background: none;
  border: 0;
  border-radius: 16px;
  color: var(--fg-muted);
  height: 32px;
  min-height: 32px;
  padding: 0;
  width: 32px;
}
.project-panel-control:hover:not(:disabled) {
  background: var(--surface-raised);
  color: var(--fg);
}
.project-panel-control:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: -2px;
}
.project-panel-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 16px;
}
/* Full buys room, not measure: rows keep a 648px column. */
.project-layout[data-panel-state="full"] .project-panel-body > * {
  max-width: 648px;
}

/* The file tree: 6 from a group's name to its first row, 12 between rows, 24 between groups. */
.panel-group + .panel-group {
  margin-top: 24px;
}
.panel-group-name {
  color: var(--fg-muted);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  margin: 0 0 6px;
}
.panel-group-name code {
  font-family: var(--font-code);
  overflow-wrap: anywhere;
}
.panel-tree {
  list-style: none;
  margin: 0;
  padding: 0;
}
.panel-file {
  border-radius: 10px;
  color: var(--fg);
  display: flex;
  font-size: 13px;
  gap: 8px;
  justify-content: space-between;
  line-height: 1.4;
  padding: 6px 8px;
  text-decoration: none;
}
a.panel-file:hover {
  background: var(--surface-raised);
}
a.panel-file:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: -2px;
}
.panel-file-name {
  min-width: 0;
  overflow-wrap: anywhere;
}
.panel-file-kind {
  color: var(--fg-muted);
  flex: 0 0 auto;
  font-family: var(--font-code);
}
.panel-blank-lead {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  margin: 0;
}
.panel-blank-body {
  color: var(--fg-muted);
  font-size: 13px;
  line-height: 1.4;
  margin: 8px 0 0;
}
.panel-retry {
  font-size: 13px;
  margin-top: 12px;
}

/* The dock mirrors the shipped rail: its slim width, its ground, flush under the mast. */
.project-dock {
  align-items: center;
  align-self: start;
  background: var(--bg);
  border-left: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: 4px;
  grid-column: 3;
  grid-row: 1;
  height: calc(100dvh - var(--topbar) - var(--mast-height) - 1px);
  padding: 0 0 8px;
  position: sticky;
  top: calc(var(--topbar) + var(--mast-height) + 1px);
  z-index: 25;
}
.project-dock-tool {
  background: none;
  border: 0;
  border-radius: 20px;
  color: var(--fg-muted);
  height: 40px;
  min-height: 40px;
  padding: 0;
  width: 40px;
}
.project-dock-tool:hover:not(:disabled) {
  background: var(--line);
  color: var(--fg);
}
.project-dock-tool[aria-pressed="true"] {
  background: var(--brand-wash-2);
  box-shadow: inset 0 0 0 1px var(--brand-line);
  color: var(--brand);
}
.project-dock-tool:focus-visible,
.project-mast-tool:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: -2px;
}

/* Below 1280 the dock yields and the mast summons the panel, one handover at one breakpoint. */
.project-mast-tool {
  display: none;
}
@media (max-width: 1279px) {
  .project-layout {
    grid-template-columns: minmax(0, 1fr);
  }
  .project-dock {
    display: none;
  }
  .project-layout .report-layout {
    grid-template-columns: minmax(0, 1fr);
  }
  .project-panel,
  .project-layout[data-panel-state="full"] .project-panel {
    border-left: 0;
    box-shadow: none;
    grid-column: 1;
  }
  .mast-actions > .project-mast-tool {
    align-items: center;
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--fg);
    display: inline-flex;
    font-size: 13px;
    font-weight: 500;
    gap: 6px;
    height: 32px;
    min-height: 32px;
    padding: 0 12px;
  }
  .mast-actions > .project-mast-tool:hover:not(:disabled) {
    border-color: var(--line-strong);
    color: var(--fg);
  }
  .mast-actions > .project-mast-tool[aria-pressed="true"] {
    background: var(--brand-wash-2);
    border-color: var(--brand-line);
    color: var(--brand);
    font-weight: 600;
  }
}
@media (max-width: 959px) {
  .mast-actions > .project-mast-tool {
    height: 44px;
    min-height: 44px;
  }
}
/* Labels drop just before the tabs would be cut; the accessible name stays. */
@media (max-width: 479px) {
  .project-tool-label {
    display: none;
  }
}
@media print {
  .project-layout {
    display: block;
  }
  .project-panel,
  .project-dock,
  .project-mast-tool {
    display: none !important;
  }
  .project-layout[data-panel-state="full"] .project-content {
    display: block;
  }
}
/* Organisation access: invitations waiting for the person, and the Google accounts panel. */
.settings-subheading {
  margin: 20px 0 8px;
  font-size: 14px;
  font-weight: 600;
}
.toolbar > .settings-subheading {
  margin: 0;
}
.ownership-action.danger {
  margin-left: 8px;
}
.invitation-list {
  display: grid;
  gap: 8px;
  margin: 0 0 16px;
}
.invitation {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px 16px;
  padding: 14px 16px;
  border: 1px solid var(--brand-line);
  border-radius: 14px;
  background: var(--brand-subtle);
}
.invitation > svg {
  color: var(--brand);
}
.invitation > p {
  margin: 0;
  font-size: 14px;
}
.invitation-actions {
  display: flex;
  gap: 8px;
}
.invitation-actions button {
  margin: 0;
}
.invitation .dialog-error {
  grid-column: 1 / -1;
}
.google-panel > .toolbar {
  margin-top: 8px;
}
.google-panel > .annotation {
  max-width: 720px;
}
.connection-row {
  align-items: center;
}
.connection-mark {
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--bg);
  color: var(--fg-muted);
  font-weight: 600;
  font-size: 14px;
}
.connection-row .row-actions button {
  margin: 0;
}
.connection-problem {
  margin: 6px 0 0;
  color: var(--danger);
  font-size: 13px;
}
.connection-empty {
  margin: 12px 0;
}
.google-connect,
.google-wait {
  margin-top: 16px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--bg);
}
.google-wait p {
  margin: 0 0 12px;
  font-size: 14px;
}
.google-wait p:last-child {
  margin-bottom: 0;
}
fieldset.google-services {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap: 10px;
  margin: 0;
}
.google-services .check-field {
  margin: 0;
  font-size: 14px;
  align-items: flex-start;
}
.google-services .check-field .annotation {
  display: block;
  font-weight: 400;
}
.google-connect-actions {
  display: flex;
  gap: 8px;
  margin-top: 16px;
}
.google-connect-actions button {
  margin: 0;
}
.google-not-ready {
  margin: 12px 0 0;
  padding: 12px 16px;
  border: 1px solid var(--brand-line);
  border-radius: 12px;
  background: var(--brand-subtle);
  font-size: 13px;
  max-width: 720px;
}
.google-testing {
  margin-top: 16px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  font-size: 13px;
}
.google-testing[data-emphasis] {
  border-color: var(--brand-line);
  background: var(--brand-subtle);
}
.google-testing > p {
  margin: 0;
  max-width: 720px;
  line-height: 1.5;
}
.google-access-request {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.google-access-request .form-field {
  flex: 1 1 240px;
  margin: 0;
}
.google-access-request button {
  min-height: 44px;
  margin: 0;
}
.provisioned-connectors {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
@media (max-width: 599px) {
  /* On a phone an account's buttons sit on their own line under it rather than squeezing its name. */
  .connection-row {
    flex-wrap: wrap;
  }
  .connection-row .row-actions {
    box-sizing: border-box;
    max-width: none;
    flex-basis: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding-left: 40px;
  }
  .invitation {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .invitation-actions {
    grid-column: 1 / -1;
  }
}