/* Scientific pop art: screen-only presentation, loaded after the existing CSS.
   Clinical tokens, dynamic colours, form hooks and stacking contexts stay owned
   by app.css, app-light.css and requests.css. */
@font-face {
  font-family: "VP UI Display";
  src: url("/static/fonts/NimbusSansNarrow-Bold.otf") format("opentype");
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
}

body.app-ui {
  --vp-ui-ink: #17121d;
  --vp-ui-paper: #fff4df;
  --vp-ui-white: #ffffff;
  --vp-ui-yellow: #ffe244;
  --vp-ui-pink: #ff4a99;
  --vp-ui-cyan: #00d8e4;
  --vp-ui-violet: #7045ff;
  --vp-ui-orange: #ff6a32;
  --vp-ui-pale: #ffc9de;
  --vp-ui-muted: #5c5363;
  --vp-ui-line: #867b90;
  --vp-ui-display: "VP UI Display", "Nimbus Sans Narrow", "Arial Narrow", Impact, sans-serif;
  background: var(--vp-ui-paper);
  color: var(--vp-ui-ink);
}

/* Editorial chrome, deliberately separate from clinical values and subtitles. */
body.app-ui .page-heading {
  padding: 20px 24px;
  border: 2px solid var(--vp-ui-ink);
  border-left: 8px solid var(--vp-ui-ink);
  border-radius: 12px;
  background: linear-gradient(100deg, var(--vp-ui-paper), #fffdf8);
  box-shadow: 3px 3px 0 var(--vp-ui-yellow);
}
body.app-ui .page-heading h1,
body.app-ui.auth-page .container > h1,
body.app-ui.requests-page .requests-toolbar h1 {
  font-family: var(--vp-ui-display);
  font-size: clamp(28px, 2.6vw, 36px);
  font-weight: 700;
  letter-spacing: .005em;
  line-height: 1.12;
  color: var(--vp-ui-ink);
}
body.app-ui .page-heading p {
  color: var(--vp-ui-muted);
  overflow-wrap: anywhere;
}
body.app-ui .breadcrumbs a {
  color: #5431c7;
  text-decoration: underline;
  text-decoration-thickness: 1px;
}
body.app-ui .breadcrumbs li:not(:last-child)::after { color: var(--vp-ui-muted); }
body.app-ui .context-actions .btn { min-height: 44px; }
body.app-ui .quick-nav,
body.app-ui .section-nav {
  border: 1.5px solid var(--vp-ui-ink);
  border-radius: 10px;
  background: var(--vp-ui-paper);
  box-shadow: 0 2px 0 var(--vp-ui-ink);
}
body.app-ui .section-nav a {
  min-height: 44px;
  color: var(--vp-ui-ink);
}
body.app-ui .section-nav a:hover {
  color: var(--vp-ui-ink);
  background: var(--vp-ui-yellow);
  text-decoration: underline;
}

/* Major panels have ink outlines. Nested metrics and clinical badges retain
   their existing colours, spacing and system/monospace reading fonts. */
body.app-ui .container > .card,
body.app-ui .container > .panel,
body.app-ui .account-grid > .card,
body.app-ui .atlas-layout > .card {
  border: 1.5px solid var(--vp-ui-ink);
  border-radius: 12px;
  background: var(--vp-ui-white);
  box-shadow: 0 2px 0 #17121d12;
}
body.app-ui .container > .card > h2,
body.app-ui .account-grid > .card > h2 {
  font-family: var(--vp-ui-display);
  font-size: 22px;
  font-weight: 700;
  color: var(--vp-ui-ink);
}
body.app-ui .case-hero {
  border: 1.5px solid var(--vp-ui-ink);
  border-radius: 12px;
  background: var(--vp-ui-white);
}
body.app-ui .case-hero::before { background: var(--vp-ui-cyan); }
body.app-ui .gene-overview-card {
  border: 1.5px solid var(--vp-ui-ink);
  border-radius: 12px;
  box-shadow: 3px 3px 0 var(--vp-ui-pale);
}
body.app-ui .gene-overview-card:hover {
  border-color: var(--vp-ui-ink);
  box-shadow: 3px 3px 0 var(--vp-ui-pink);
}
body.app-ui .table-wrap,
body.app-ui .table-container {
  border-color: var(--vp-ui-line);
  box-shadow: none;
}
body.app-ui .audit-metric { border-color: var(--vp-ui-line); }
body.app-ui td { font-variant-numeric: tabular-nums; }

/* Ordinary actions only: red destructive actions have a separate contract.
   No global button rule can recolour status toggles or scientific controls. */
body.app-ui .btn:where(:not(.btn-secondary, .btn-ghost, .btn-danger, .danger, [onclick*="confirm"], form[action*="delete"] button)) {
  border: 1.5px solid var(--vp-ui-ink);
  background: var(--vp-ui-violet);
  color: var(--vp-ui-white);
  box-shadow: 2px 2px 0 var(--vp-ui-ink);
}
body.app-ui .btn {
  border-radius: 10px;
  transition: background-color 150ms, border-color 150ms, box-shadow 150ms;
}
body.app-ui .btn:hover { transform: none; }
body.app-ui .btn:where(:not(.btn-secondary, .btn-ghost, .btn-danger, .danger, [onclick*="confirm"], form[action*="delete"] button)):hover {
  background: #5930dc;
  color: var(--vp-ui-white);
  box-shadow: 1px 1px 0 var(--vp-ui-ink);
}
body.app-ui .btn-secondary,
body.app-ui .btn-ghost {
  border: 1.5px solid var(--vp-ui-line);
  background: var(--vp-ui-paper);
  color: var(--vp-ui-ink);
}
body.app-ui .btn-secondary:hover,
body.app-ui .btn-ghost:hover {
  border-color: var(--vp-ui-ink);
  background: var(--vp-ui-yellow);
  color: var(--vp-ui-ink);
}
body.app-ui .actions > .btn,
body.app-ui.auth-page form > .btn { min-height: 44px; }
body.app-ui .btn-danger,
body.app-ui .danger,
body.app-ui button[onclick*="confirm"],
body.app-ui form[action*="delete"] button {
  background: #fff0ef;
  border-color: #b42318;
  color: #8b2018;
  box-shadow: none;
}
body.app-ui .btn-danger:hover,
body.app-ui .danger:hover,
body.app-ui button[onclick*="confirm"]:hover,
body.app-ui form[action*="delete"] button:hover {
  background: #ffe1df;
  border-color: #8b2018;
  color: #8b2018;
}
/* The administration delete buttons already carry an inline dark red fill. */
body.app-ui form[action^="/admin/"][action$="/delete"] button,
body.app-ui form[action^="/admin/"][action$="/delete"] button:hover { color: var(--vp-ui-white); }
body.app-ui .btn:disabled {
  box-shadow: none;
  opacity: 1;
  background: #ede8f0;
  color: #655b6d;
  border-color: var(--vp-ui-line);
  cursor: not-allowed;
}

/* Requests: decorate the shell, leave column/technique/urgency/workflow colours
   and the drawer's display, z-index, sticky internals and focus trap untouched. */
body.app-ui.requests-page { background: var(--vp-ui-paper); }
body.app-ui.requests-page .requests-main { background: var(--vp-ui-paper); }
body.app-ui.requests-page .requests-toolbar {
  padding: 4px 0 12px;
  min-height: 64px;
}
body.app-ui.requests-page .requests-toolbar .eyebrow { color: var(--vp-ui-muted); }
body.app-ui.requests-page .requests-toolbar > button { min-height: 44px; }
body.app-ui.requests-page .requests-filters {
  border: 1.5px solid var(--vp-ui-ink);
  border-radius: 12px;
  box-shadow: 0 2px 0 var(--vp-ui-yellow);
}
body.app-ui.requests-page button.btn {
  background: var(--vp-ui-violet);
  border: 1.5px solid var(--vp-ui-ink);
  color: var(--vp-ui-white);
  box-shadow: 2px 2px 0 var(--vp-ui-ink);
}
body.app-ui.requests-page button.btn:hover {
  background: #5930dc;
  color: var(--vp-ui-white);
  border-color: var(--vp-ui-ink);
  box-shadow: 1px 1px 0 var(--vp-ui-ink);
}
body.app-ui.requests-page .request-drawer,
body.app-ui.requests-page dialog {
  border: 2px solid var(--vp-ui-ink);
  border-radius: 12px;
}
body.app-ui.requests-page .editor-header {
  background: var(--vp-ui-paper);
  border-bottom-color: var(--vp-ui-ink);
}
body.app-ui.requests-page .editor-footer { border-top-color: var(--vp-ui-line); }
body.app-ui.requests-page .editor-footer #save-request { min-height: 40px; }
body.app-ui.requests-page .request-card:hover {
  transform: none;
  border-left-color: var(--card-accent, #64748b);
}
body.app-ui.requests-page button.danger-subtle:hover,
body.app-ui.requests-page button.danger-subtle:focus-visible {
  background: #fff0ef;
  color: #8b2018;
  border-color: #b42318;
}
body.app-ui.requests-page button.btn:disabled {
  background: #ede8f0;
  color: #655b6d;
  border-color: var(--vp-ui-line);
  box-shadow: none;
}

/* The original 76px board subtraction predates the two-row 118px header.
   Below the header's 760px breakpoint its height is content driven. */
@media (min-width: 761px) and (max-width: 1100px) {
  body.app-ui.requests-page .requests-main { height: calc(100dvh - 118px); }
}
@media (min-width: 761px) {
  body.app-ui.requests-page .requests-main { overflow-y: auto; }
  body.app-ui.requests-page .request-board { min-height: 240px; }
}
@media (max-width: 760px) {
  body.app-ui .page-heading { padding: 16px; border-left-width: 6px; }
  body.app-ui .page-heading h1,
  body.app-ui.auth-page .container > h1,
  body.app-ui.requests-page .requests-toolbar h1 { font-size: 28px; }
  body.app-ui.requests-page { overflow: auto; }
  body.app-ui.requests-page .requests-main { height: auto; min-height: calc(100dvh - 118px); }
}

/* The two-tone ring remains legible on both violet and light surfaces.
   Narrow scope preserves the existing readonly/disabled/checklist contracts. */
body.app-ui :focus-visible {
  outline: 3px solid var(--vp-ui-ink);
  outline-offset: 3px;
}
body.app-ui .btn:focus-visible,
body.app-ui .app-header :focus-visible,
body.app-ui.requests-page button:focus-visible {
  outline: 3px solid var(--vp-ui-ink);
  outline-offset: 3px;
  box-shadow: 0 0 0 3px var(--vp-ui-white);
}
@media (prefers-reduced-motion: reduce) {
  body.app-ui .btn { transition: none; }
}
@media (forced-colors: active) {
  body.app-ui .page-heading,
  body.app-ui .quick-nav,
  body.app-ui .section-nav,
  body.app-ui .btn,
  body.app-ui.requests-page button.btn {
    border-color: ButtonText;
    box-shadow: none;
  }
  body.app-ui :focus-visible,
  body.app-ui .btn:focus-visible,
  body.app-ui .app-header :focus-visible,
  body.app-ui.requests-page button:focus-visible {
    outline-color: Highlight;
  }
}

/* Navigation: the existing sticky breakpoints and route order stay in place. */
body.app-ui .app-header,
body.app-ui.home-page .app-header {
  gap:16px;
  padding-block:8px;
  background:var(--vp-ui-paper);
  border-bottom:2px solid var(--vp-ui-ink);
  box-shadow:none;
}
body.app-ui .app-brand { gap:10px; color:var(--vp-ui-ink); }
body.app-ui .app-brand strong {
  font-family:var(--vp-ui-display);
  font-size:22px;
  font-weight:800;
  line-height:1.05;
  letter-spacing:-.025em;
}
body.app-ui .app-brand small { color:var(--vp-ui-muted); }
body.app-ui .app-brand-icon {
  flex:0 0 34px;
  width:34px;
  height:38px;
  padding:5px;
  border:1.5px solid var(--vp-ui-ink);
  border-radius:10px;
  background:var(--vp-ui-pink);
  color:var(--vp-ui-ink);
  box-shadow:2px 2px 0 var(--vp-ui-ink);
}
body.app-ui .app-nav { min-width:0; }
body.app-ui .app-nav a,
body.app-ui .app-user-nav a,
body.app-ui .app-user-nav .button-link {
  min-height:44px;
  padding:8px 10px;
  border:1.5px solid transparent;
  border-radius:999px;
  color:var(--vp-ui-ink);
  background:transparent;
  transition:background-color 150ms,border-color 150ms,box-shadow 150ms;
}
body.app-ui .app-nav a:hover,
body.app-ui .app-user-nav a:hover,
body.app-ui .app-user-nav .button-link:hover {
  border-color:var(--vp-ui-ink);
  background:var(--vp-ui-white);
  color:var(--vp-ui-ink);
}
body.app-ui .app-nav a[aria-current="page"],
body.app-ui.home-page .app-nav a[aria-current="page"] {
  border:1.5px solid var(--vp-ui-ink);
  background:var(--vp-ui-yellow);
  color:var(--vp-ui-ink);
  box-shadow:2px 2px 0 var(--vp-ui-ink);
}
body.app-ui .app-user-nav { min-width:0; border-left-color:var(--vp-ui-ink); }
body.app-ui .app-user-nav .app-register {
  border-color:var(--vp-ui-ink);
  background:var(--vp-ui-violet);
  color:var(--vp-ui-white);
}
body.app-ui .app-user-nav .app-register:hover {
  background:var(--vp-ui-ink);
  color:var(--vp-ui-white);
}
body.app-ui .app-brand:focus-visible,
body.app-ui .app-nav a:focus-visible,
body.app-ui .app-user-nav a:focus-visible,
body.app-ui .app-user-nav .button-link:focus-visible {
  outline:3px solid var(--vp-ui-ink);
  outline-offset:3px;
}

/* An inset ring stays visible inside the existing horizontal scroll strips. */
body.app-ui .app-nav a:focus-visible,
body.app-ui .app-user-nav a:focus-visible,
body.app-ui .app-user-nav .button-link:focus-visible { outline-offset:-4px; }

/* Home: bold editorial framing; the decoration is confined to the molecule. */
body.app-ui.home-page { background:var(--vp-ui-paper); color:var(--vp-ui-ink); overflow-x:visible; }
body.app-ui.home-page .home-main { padding-top:32px; padding-bottom:48px; }
body.app-ui.home-page .home-atmosphere { display:none; }
body.app-ui.home-page .home-hero {
  grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);
  gap:32px;
  min-height:390px;
  padding:clamp(28px,3.5vw,52px);
  border:2px solid var(--vp-ui-ink);
  border-radius:14px;
  background:var(--vp-ui-paper);
  box-shadow:5px 5px 0 var(--vp-ui-ink);
}
body.app-ui.home-page .home-hero .eyebrow {
  display:inline-block;
  padding:6px 10px;
  border:1.5px solid var(--vp-ui-ink);
  border-radius:6px;
  background:var(--vp-ui-yellow);
  color:var(--vp-ui-ink);
  font-size:12px;
  letter-spacing:.045em;
}
body.app-ui.home-page .home-hero h1 {
  max-width:760px;
  font-family:var(--vp-ui-display);
  font-weight:800;
  font-size:clamp(32px,3.5vw,52px);
  line-height:1.04;
  letter-spacing:-.025em;
  color:var(--vp-ui-ink);
}
body.app-ui.home-page .home-hero h1 span {
  color:var(--vp-ui-ink);
  background:none;
  background-clip:border-box;
  -webkit-background-clip:border-box;
  -webkit-text-fill-color:currentColor;
  text-decoration:underline;
  text-decoration-color:var(--vp-ui-pink);
  text-decoration-thickness:5px;
  text-underline-offset:5px;
}
body.app-ui.home-page .hero-copy { margin-top:20px; color:var(--vp-ui-muted); font-size:16px; line-height:1.65; }
body.app-ui.home-page .actions { margin-top:24px; gap:12px; }
body.app-ui.home-page .actions .btn {
  min-height:46px;
  padding:11px 16px;
  border:2px solid var(--vp-ui-ink);
  border-radius:10px;
  box-shadow:3px 3px 0 var(--vp-ui-ink);
  font-size:14px;
  transition:background-color 150ms,box-shadow 150ms;
}
body.app-ui.home-page .actions .home-cta-primary { background:var(--vp-ui-violet); color:var(--vp-ui-white); }
body.app-ui.home-page .actions .home-cta-secondary { background:var(--vp-ui-white); color:var(--vp-ui-ink); }
body.app-ui.home-page .actions .home-cta-primary:hover { background:var(--vp-ui-ink); color:var(--vp-ui-white); transform:none; }
body.app-ui.home-page .actions .home-cta-secondary:hover { background:var(--vp-ui-yellow); color:var(--vp-ui-ink); transform:none; }
body.app-ui.home-page .actions .btn:active { box-shadow:1px 1px 0 var(--vp-ui-ink); transform:none; }
body.app-ui.home-page .actions .btn:focus-visible,
body.app-ui.home-page .module-card a:focus-visible,
body.app-ui.home-page .tech-ribbon:focus-visible {
  outline:3px solid var(--vp-ui-ink);
  outline-offset:4px;
}
body.app-ui.home-page .molecular-engine {
  width:min(100%,340px);
  border:2px solid var(--vp-ui-ink);
  border-radius:50%;
  background:radial-gradient(var(--vp-ui-ink) .65px,transparent .9px) 0 0 / 9px 9px,var(--vp-ui-yellow);
  box-shadow:5px 5px 0 var(--vp-ui-ink);
}
body.app-ui.home-page .engine-halo { opacity:1; border:2px solid var(--vp-ui-ink); }
body.app-ui.home-page .engine-halo-cyan { background:var(--vp-ui-cyan); left:3%; top:12%; }
body.app-ui.home-page .engine-halo-magenta { background:var(--vp-ui-pale); right:3%; bottom:8%; }
body.app-ui.home-page .engine-orbit { border:2px solid var(--vp-ui-ink); }
body.app-ui.home-page .engine-orbit-one,
body.app-ui.home-page .engine-orbit-two,
body.app-ui.home-page .engine-node { animation:none; }
body.app-ui.home-page .engine-core {
  border:2px solid var(--vp-ui-ink);
  border-radius:14px;
  background:var(--vp-ui-violet);
  box-shadow:4px 4px 0 var(--vp-ui-ink);
  transform:none;
}
body.app-ui.home-page .engine-core svg { stroke:var(--vp-ui-white); stroke-width:3; transform:none; }
body.app-ui.home-page .engine-node {
  min-width:55px;
  min-height:38px;
  border:2px solid var(--vp-ui-ink);
  border-radius:9px;
  background:var(--vp-ui-white);
  color:var(--vp-ui-ink);
  box-shadow:3px 3px 0 var(--vp-ui-ink);
  font-size:12px;
}
body.app-ui.home-page .node-ngs { background:var(--vp-ui-cyan); }
body.app-ui.home-page .node-fish { background:var(--vp-ui-pink); }
body.app-ui.home-page .node-rna { background:var(--vp-ui-yellow); }
body.app-ui.home-page .node-idylla { background:var(--vp-ui-white); }
body.app-ui.home-page .engine-link { height:2px; background:var(--vp-ui-ink); opacity:1; }
body.app-ui.home-page .engine-signal { border:2px solid var(--vp-ui-ink); background:var(--vp-ui-pink); box-shadow:none; }

/* Keep every capability visible without an endlessly moving ticker. */
body.app-ui.home-page .tech-ribbon {
  margin-top:24px;
  overflow:visible;
  border:1.5px solid var(--vp-ui-ink);
  border-radius:10px;
  background:var(--vp-ui-white);
  color:var(--vp-ui-ink);
  box-shadow:none;
}
body.app-ui.home-page .ribbon-track { width:100%; max-width:100%; animation:none; transform:none; }
body.app-ui.home-page .ribbon-group { width:100%; min-width:0; max-width:100%; flex:1 1 100%; flex-wrap:wrap; }
body.app-ui.home-page .ribbon-group[aria-hidden="true"] { display:none; }
body.app-ui.home-page .ribbon-group > span { min-width:0; padding:12px 16px; font-size:12px; letter-spacing:.025em; }
body.app-ui.home-page .ribbon-group > span:not(:last-child)::after { content:none; }
body.app-ui.home-page .workflow,
body.app-ui.home-page .home-modules { padding-top:40px; }
body.app-ui.home-page .section-heading { max-width:none; margin-bottom:20px; }
body.app-ui.home-page .section-heading .eyebrow { color:var(--vp-ui-muted); letter-spacing:.08em; }
body.app-ui.home-page .section-heading h2 { font:800 clamp(26px,2.6vw,36px)/1.12 var(--vp-ui-display); color:var(--vp-ui-ink); letter-spacing:-.015em; }
body.app-ui.home-page .workflow ol { gap:12px; }
body.app-ui.home-page .workflow ol::before,
body.app-ui.home-page .workflow ol::after { display:none; }
body.app-ui.home-page .workflow li,
body.app-ui.home-page .workflow li:first-child,
body.app-ui.home-page .workflow li:last-child {
  /* Increment on list items so the count is shared across all five steps. */
  counter-increment:flow;
  min-height:100px;
  border:1.5px solid var(--vp-ui-ink);
  border-radius:10px;
  background:var(--vp-ui-white);
  color:var(--vp-ui-ink);
  padding:54px 12px 14px;
  box-shadow:none;
  font-size:14px;
}
body.app-ui.home-page .workflow li::before {
  counter-increment:none;
  top:28px;
  border:1.5px solid var(--vp-ui-ink);
  border-radius:8px;
  background:var(--vp-ui-yellow);
  color:var(--vp-ui-ink);
  font-variant-numeric:tabular-nums;
}
body.app-ui.home-page .module-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
body.app-ui.home-page .module-grid .module-card {
  --vp-ui-module:var(--vp-ui-cyan);
  grid-column:auto;
  min-height:245px;
  padding:24px;
  overflow:visible;
  border:2px solid var(--vp-ui-ink);
  border-top:8px solid var(--vp-ui-module);
  border-radius:12px;
  background:var(--vp-ui-white);
  color:var(--vp-ui-ink);
  box-shadow:3px 3px 0 var(--vp-ui-ink);
  transition:background-color 150ms,box-shadow 150ms;
}
body.app-ui.home-page .module-grid .vp-ui-module-requests { --vp-ui-module:var(--vp-ui-yellow); }
body.app-ui.home-page .module-grid .module-cases { --vp-ui-module:var(--vp-ui-cyan); }
body.app-ui.home-page .module-grid .module-variants { --vp-ui-module:var(--vp-ui-pink); }
body.app-ui.home-page .module-grid .module-atlas { --vp-ui-module:var(--vp-ui-violet); }
body.app-ui.home-page .module-grid .module-journal { --vp-ui-module:var(--vp-ui-orange); }
body.app-ui.home-page .module-card > svg {
  width:42px;
  height:42px;
  margin-bottom:16px;
  padding:7px;
  border:1.5px solid var(--vp-ui-ink);
  border-radius:9px;
  background:var(--vp-ui-module);
  stroke:var(--vp-ui-ink);
}
body.app-ui.home-page .module-atlas > svg { stroke:var(--vp-ui-white); }
body.app-ui.home-page .module-grid .module-card h3 { font:800 22px/1.15 var(--vp-ui-display); color:var(--vp-ui-ink); }
body.app-ui.home-page .module-card p { color:var(--vp-ui-muted); font-size:15px; line-height:1.6; }
body.app-ui.home-page .module-card > a {
  align-self:flex-start;
  display:inline-flex;
  min-height:44px;
  align-items:center;
  gap:8px;
  color:var(--vp-ui-ink);
  text-decoration:underline;
  text-decoration-thickness:1.5px;
  text-underline-offset:4px;
}
body.app-ui.home-page .module-grid .module-card:hover,
body.app-ui.home-page .module-grid .module-card:focus-within {
  border-color:var(--vp-ui-ink);
  border-top-color:var(--vp-ui-module);
  background:var(--vp-ui-paper);
  color:var(--vp-ui-ink);
  box-shadow:4px 4px 0 var(--vp-ui-ink);
  transform:none;
}
body.app-ui.home-page .module-card:hover > a span,
body.app-ui.home-page .module-card:focus-within > a span { transform:none; }
body.app-ui.home-page .app-footer { border-top:1.5px solid var(--vp-ui-ink); background:var(--vp-ui-white); color:var(--vp-ui-muted); }
body.app-ui.home-page .app-footer .version-badge { color:var(--vp-ui-ink); font-weight:750; }

@media (max-width:1100px) {
  body.app-ui .app-header,
  body.app-ui.home-page .app-header { gap:8px 16px; }
  body.app-ui .app-user-nav { border:0; }
  body.app-ui.home-page .home-hero { grid-template-columns:minmax(0,1.25fr) minmax(230px,.75fr); padding:32px; }
  body.app-ui.home-page .module-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:900px) {
  body.app-ui.home-page .home-hero { grid-template-columns:minmax(0,1fr) 210px; gap:24px; }
  body.app-ui.home-page .molecular-engine { width:210px; }
  body.app-ui.home-page .engine-node { min-width:46px; min-height:32px; font-size:10px; padding:5px; }
}
@media (max-width:760px) {
  body.app-ui .app-header,
  body.app-ui.home-page .app-header { gap:8px; }
  body.app-ui .app-nav { padding-bottom:5px; }
  body.app-ui .app-nav a { flex-shrink:0; }
  body.app-ui.home-page .home-main { padding-top:20px; }
  body.app-ui.home-page .home-hero { grid-template-columns:1fr; gap:24px; min-height:0; padding:26px; }
  body.app-ui.home-page .home-hero h1 { font-size:clamp(28px,6vw,36px); }
  body.app-ui.home-page .molecular-engine { width:160px; }
  body.app-ui.home-page .workflow ol { grid-template-columns:1fr; gap:8px; }
  body.app-ui.home-page .workflow li,
  body.app-ui.home-page .workflow li:first-child,
  body.app-ui.home-page .workflow li:last-child { min-height:54px; padding:14px 14px 14px 56px; }
  body.app-ui.home-page .workflow li::before { left:28px; top:50%; }
  body.app-ui.home-page .module-grid { grid-template-columns:1fr; }
  body.app-ui.home-page .module-grid .module-card { min-height:0; }
}
@media (max-width:430px) {
  body.app-ui .app-user-nav { padding:0 0 4px; }
  body.app-ui .app-nav a,
  body.app-ui .app-user-nav a,
  body.app-ui .app-user-nav .button-link { padding-inline:8px; }
  body.app-ui.home-page .home-hero { padding:24px 20px; }
  body.app-ui.home-page .hero-copy { font-size:15px; }
  body.app-ui.home-page .actions .btn { min-height:46px; }
  body.app-ui.home-page .molecular-engine { width:140px; }
  body.app-ui.home-page .engine-node { min-width:40px; min-height:28px; font-size:9px; padding:3px; }
}
@media (prefers-reduced-motion: reduce) {
  body.app-ui .app-nav a,
  body.app-ui .app-user-nav a,
  body.app-ui .app-user-nav .button-link,
  body.app-ui.home-page .actions .btn,
  body.app-ui.home-page .module-grid .module-card { transition:none; }
}
@media (forced-colors:active) {
  body.app-ui .app-header,
  body.app-ui.home-page .app-header,
  body.app-ui .app-brand-icon,
  body.app-ui.home-page .home-hero,
  body.app-ui.home-page .module-grid .module-card { border-color:CanvasText; box-shadow:none; }
  body.app-ui .app-nav a[aria-current="page"],
  body.app-ui.home-page .app-nav a[aria-current="page"] { border-color:Highlight; color:LinkText; text-decoration:underline; box-shadow:none; }
  body.app-ui.home-page .home-hero h1 span { color:CanvasText; -webkit-text-fill-color:CanvasText; text-decoration-color:CanvasText; }
  body.app-ui.home-page .molecular-engine { background:Canvas; border-color:CanvasText; box-shadow:none; }
  body.app-ui.home-page .module-grid .module-card { border-top-color:CanvasText; }
  body.app-ui.home-page .engine-core svg,
  body.app-ui.home-page .module-card > svg { stroke:CanvasText; }
  body.app-ui .app-brand:focus-visible,
  body.app-ui .app-nav a:focus-visible,
  body.app-ui .app-user-nav a:focus-visible,
  body.app-ui .app-user-nav .button-link:focus-visible,
  body.app-ui.home-page .actions .btn:focus-visible,
  body.app-ui.home-page .module-card a:focus-visible,
  body.app-ui.home-page .tech-ribbon:focus-visible { outline-color:Highlight; }
}