/* NexyCell public product design quality layer.
   This loads after feature styles and immediately before the shared theme contract:
   layout, density and touch targets converge here; final color/type tokens stay shared. */
:root {
  --nc-shell-max: 1360px;
  --nc-type-body: 14px;
  --nc-type-small: 12.5px;
  --nc-type-micro: 11.5px;
  --nc-section-gap: 20px;
}

body {
  font-size: var(--nc-type-body);
  line-height: 1.55;
}

.wrap { padding-inline: clamp(16px, 2vw, 28px); }
.view > :where(.section-head, .view-flow, .view-task-zone, .analysis-advanced, .mfg-page-head, .mfg-workflow-nav, .mfg-workflow-shell, .mfg-handoff-bar) {
  scroll-margin-top: 82px;
}
[data-view-zone] { scroll-margin-top: 88px; }

/* Two-column work surfaces size to their own content. A long editor must not turn the
   neighbouring result into an empty full-height panel. */
.grid,
.cols-2,
.cols-2b,
.cols-3,
.proc-grid,
.cell-grid { align-items: start; }

.cols-2 > .card,
.cols-2b > .card,
.cols-3 > .card { height: auto; align-self: start; }

/* Balance only the paired engineering workspaces. The generic grids above still size
   naturally, while these known pairs use spare space for an actual chart or aligned
   readout instead of leaving an unexplained empty column. */
@media (min-width: 961px) {
  #view-cell .task-input-grid,
  #view-cell .task-result-grid,
  #view-performance .view-task-configure > .grid.cols-2b,
  #view-optimize .opt-decision-grid {
    align-items: stretch;
  }

  #view-cell .task-input-grid > .card,
  #view-cell .task-result-grid > .card,
  #view-performance .view-task-configure > .grid.cols-2b > .card,
  #view-optimize .opt-decision-grid > .card {
    height: 100%;
    align-self: stretch;
  }

  #view-cell .task-input-grid > .card {
    display: flex;
    flex-direction: column;
  }
  #view-cell .task-input-grid > .card > .kpis {
    margin-top: auto;
  }
  #view-cell .task-result-grid > .card {
    display: flex;
    flex-direction: column;
  }
  #view-cell #cell-temp-chart {
    flex: 1 1 240px;
    min-height: 240px;
    height: auto;
  }
  #view-cell .task-result-grid > .card:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
  #view-cell .task-result-grid > .card:last-child:nth-child(odd) canvas.chart {
    height: 260px;
  }

  #view-performance .view-task-configure > .grid.cols-2b > .card {
    display: flex;
    flex-direction: column;
  }
  #view-performance .view-task-configure > .grid.cols-2b > .card > .p2d-bar {
    margin-top: auto;
  }

  #view-optimize .opt-best-card {
    display: flex;
    flex-direction: column;
  }
}

/* Dense engineering charts keep a stable reading aspect ratio. They must not be used
   as elastic spacers merely to force two asymmetric workspaces to the same height. */
#process-card .proc-grid { align-items: start; }
#process-card #proc-pareto { height: 320px; }
#view-optimize .opt-results-grid { grid-template-columns: minmax(0, 1fr); }
#view-optimize #opt-pareto { height: 320px; }
#view-optimize .opt-candidate-panel {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
#view-optimize .opt-candidate-panel h5 {
  margin: 0 0 10px;
  color: var(--txt);
  font-size: 13px;
  line-height: 1.4;
}
#view-optimize .opt-candidate-scroll {
  max-height: 300px;
  overflow: auto;
}

/* Materials is asymmetric by design: the cathode has a richer formulation editor.
   At notebook widths stack both workspaces; at wide widths compact the cathode into
   input/result columns before matching the neighbouring anode card. This avoids both
   a blank half-page and an artificially elongated anode chart. */
@media (min-width: 961px) and (max-width: 1279px) {
  #view-materials .view-task-configure > .grid.cols-2b {
    grid-template-columns: minmax(0, 1fr);
  }
  #view-materials #an-chart {
    height: 300px;
  }
}

@media (min-width: 1280px) {
  #view-materials .view-task-configure > .grid.cols-2b {
    grid-template-columns: minmax(0, 2fr) minmax(360px, 1fr);
    align-items: start;
  }
  #view-materials .material-cathode-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 18px;
    align-items: start;
  }
  #view-materials .material-cathode-results {
    min-width: 0;
  }
  #view-materials #cath-chart {
    height: 300px;
  }
  #view-materials #chem-doptype > button {
    min-width: 44px;
  }
  #view-materials #chem-coat > button {
    min-width: 60px;
  }
  #view-materials #an-chart {
    height: 300px;
  }
}

/* Reading hierarchy: body copy is never rendered as telemetry microtype. */
.card h4 { font-size: 14.5px; line-height: 1.4; }
.card :is(p, li),
.insight-list li { line-height: 1.6; }
.card .sub,
.note,
.legend,
.grounding,
.view-handoff p,
.disc-act,
.copilot-note,
.copilot-applied,
.proc-design-bar,
.pat-abs,
.pat-claim { font-size: var(--nc-type-small); }

.ctrl label,
.bar .lab,
.fit-lab,
.pat-sublabel,
.strategy-grid label,
.adv-field > label { font-size: 12.5px; line-height: 1.45; }

.kpi :is(.k, .d),
.mobile-summary-kpi small { font-size: 12px; line-height: 1.4; }

:is(.chip, .stage-pills .sp, .conf-badge, .comp-body, .comp-scope, .comp-badge,
  .reg-chip, .stage-badge, .std-badge, .live-badge, .lib-topic, .rag-tag,
  .clm-ind, .wbadge, .plan-badge) {
  font-size: var(--nc-type-micro);
  line-height: 1.35;
}

.chem-title,
.proc-stage,
.flabel,
.rag-src-h,
.news-day { font-size: 12px; line-height: 1.4; }
.pw-ok { font-size: 11.5px; }
#view-performance small { font-size: 12px; line-height: 1.5; }
#view-performance :is(.sens-axislbl, .tm-head, .trust-check) { font-size: 11.5px; line-height: 1.45; }
#view-performance :is(.sens-axislbl, .tm-head, .trust-check) span,
#view-performance .asim-benchmark .scope a { font-size: inherit; }
#view-performance :is(.asim-badge, .asim-kpi span, .asim-benchmark header span, .asim-benchmark .metrics) {
  font-size: 11.5px;
  line-height: 1.45;
}
#view-methodology .vs-lit { font-size: var(--nc-type-micro); line-height: 1.4; }

.view-flow button { min-height: 52px; font-size: 13px; }
.view-flow-index,
.home-lineage-no { font-size: 11.5px; }
.hero-demo-head .hd-dot { font-size: 11.5px; }
#view-overview small { font-size: 12px; line-height: 1.5; }
#view-overview .home-disclosure-description { font-size: 13px; line-height: 1.55; }
.home-lineage-public-detail article > span { font-size: 11.5px; }
#view-overview :is(.hero-eyebrow, .decision-boundary-step, .pilot-disclaimer, .preset-d) {
  font-size: 11.5px;
  line-height: 1.45;
}
.analysis-advanced-copy b { font-size: 14px; }
.analysis-advanced-copy small,
.analysis-module-count { font-size: 12px; line-height: 1.5; }
.ad-btn b { font-size: 13.5px; }
.ad-btn span { font-size: 11.5px; line-height: 1.35; }

/* Form controls remain compact on desktop but never look like miniature utilities. */
:where(.view) :is(input:not([type="range"]):not([type="checkbox"]):not([type="radio"]), select, textarea) {
  min-height: 40px;
  font-size: 13px;
}

:where(.view) :is(.btn, .tbtn, .pat-tab, .fchip, .cex, .seg > button, [role="tab"]) {
  min-height: 36px;
}
.adv-rx { min-width: 36px; min-height: 36px; }

.seg.sm button { min-height: 34px; font-size: 12px; }
.fchip { padding-block: 7px; font-size: 12px; }
.fc-n { font-size: 11.5px; }
.pat-tab .pt-n { font-size: 11.5px; }
.search-strategy summary small { font-size: 12px; line-height: 1.45; }
.visual-export button,
.viz-tool { min-width: 38px; min-height: 34px; font-size: 11.5px; }
.unc-lbl,
.viz-mode-badge,
.pro-viz-hint { font-size: 11.5px; }

/* Library filters behave like a report index, not a box filled with more boxes. */
.tech-filter {
  padding: 14px 0;
  border-inline: 0;
  border-radius: 0;
  background: transparent;
}
.tech-filter .fline { gap: 8px; margin-bottom: 9px; }
.tech-filter .flabel { min-width: 112px; }
.lib-body,
.governed-meta,
.paper-content,
.lib-link,
.search-hint,
.rag-src-row,
.rag-src-m { font-size: 12px; line-height: 1.55; }
.lib-title2 { font-size: 14px; line-height: 1.45; }
.lib-card { padding: 17px 18px; }
.lib-link { display: inline-flex; min-height: 32px; align-items: center; }

/* Preserve one clear top-level card while flattening decorative nesting. */
.card > .chem-block {
  border-width: 0 0 0 2px;
  border-color: var(--cath);
  border-radius: 0;
  background: color-mix(in srgb, var(--cath) 3%, transparent);
  padding: 12px 14px;
}

#view-manufacturing .mfg-workflow-nav {
  padding: 0 0 10px;
  border-width: 0 0 1px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
#view-manufacturing .mfg-workflow-nav a { border-color: transparent; border-radius: 8px; }
#view-manufacturing .mfg-workflow-nav b { font-size: 13px; }
#view-manufacturing .mfg-workflow-nav small { font-size: 11.5px; line-height: 1.4; }
#view-manufacturing .mfg-work-card,
#view-manufacturing .mfg-secondary-card { box-shadow: none; }
#view-manufacturing .mfg-step-title > span,
#view-manufacturing .mfg-workflow-nav i,
#view-manufacturing .mfg-scope-badge { font-size: 11.5px; }
#view-manufacturing .mfg-step-title h3 { font-size: 18px; }
#view-manufacturing .mfg-step-title p { font-size: 12.5px; }
#view-manufacturing :is(.mfg-field, .mfg-builder-body label, .mfg-opt-controls label,
  .mfg-calibration-row strong, .mfg-selected-list, .mfg-record-empty, .mfg-record-row,
  .mfg-boundary-note, .mfg-livebar b) { font-size: 12px; line-height: 1.5; }
#view-manufacturing :is(.mfg-field > small, .mfg-builder summary small, .mfg-livebar small,
  .mfg-flow-surface header p, .mfg-flow-surface header small, .mfg-card-description,
  .mfg-flow-detail small) { font-size: 12px; line-height: 1.5; }
#view-manufacturing .mfg-param-groups { gap: 0; }
#view-manufacturing .mfg-param-group {
  padding: 2px 14px 6px;
  border-width: 0 0 0 1px;
  border-radius: 0;
  background: transparent;
}
#view-manufacturing .mfg-param-group:first-child { border-inline-start: 0; }
#view-manufacturing .mfg-param-group legend { font-size: 12.5px; }
#view-manufacturing .mfg-param {
  padding: 10px 3px 12px;
  border-width: 0 0 1px;
  border-radius: 0;
  background: transparent;
}
#view-manufacturing .mfg-param > label { font-size: 12px; }
#view-manufacturing .mfg-param .val { font-size: 11.5px; }
#view-manufacturing .mfg-flow-detail { font-size: 12px; line-height: 1.45; }
#view-manufacturing .mfg-flow-detail strong { font-size: 12px; }
#view-manufacturing :is(.mfg-analysis-output h5, .mfg-influence-row, .mfg-range-row, .mfg-uncertainty-row) {
  font-size: 12px;
  line-height: 1.5;
}
#view-manufacturing :is(.mfg-opt-row, .mfg-analysis-row) {
  border-inline: 0;
  border-radius: 0;
  background: transparent;
}

/* Chart furniture is supporting text, but it still needs to be readable at 100% zoom. */
:is(.viz-axis-label, .viz-axis-value, .viz-scale-label, .viz-section-label,
  .decision-viz-report-class, .decision-viz-figure, .decision-viz-toolbar,
  .decision-viz-stagebar, .decision-viz-selection) { font-size: 12px; }

@media (max-width: 960px) {
  .wrap { padding-inline: 16px; }
  .tech-filter .flabel { min-width: 100px; }
}

@media (max-width: 760px) {
  :root { --nc-type-body: 15px; --nc-type-small: 13px; --nc-type-micro: 12px; }
  body { line-height: 1.62; }
  .wrap { padding-inline: 12px; }

  /* Mobile shell keeps the product architecture visible. The first row contains only
     durable utilities; the second row is a horizontally scrollable product switcher. */
  .topbar {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    grid-template-areas: "brand utilities" "products products";
    height: auto;
    min-height: 108px;
    padding: 7px 10px 6px;
    row-gap: 4px;
    overflow: visible;
  }
  .topbar .brand {
    grid-area: brand;
    width: max-content;
    min-width: max-content;
    font-size: 16px;
  }
  .topbar .right {
    grid-area: utilities;
    justify-content: flex-end;
    gap: 5px;
    overflow: visible;
  }
  .topbar .right > :is(#command-palette-open, #job-center-toggle, #undo-btn, #redo-btn,
    #status-pill, .topbar-contact-cta) { display: none !important; }
  .topbar .right > :is(#theme-btn, #lang-select, .topbar-workspace-link) { display: inline-flex; }
  .topbar .right .topbar-workspace-link {
    width: 44px;
    min-width: 44px;
    padding-inline: 0;
    overflow: hidden;
    font-size: 0;
  }
  .topbar .right .topbar-workspace-link::before {
    content: "W";
    font: 750 13px/1 var(--mono);
  }
  .topbar .nav {
    grid-area: products;
    display: flex;
    width: 100%;
    max-width: none;
    margin: 0;
    padding-top: 3px;
    gap: 3px;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline proximity;
  }
  .topbar .nav::-webkit-scrollbar { display: none; }
  .topbar .nav > [data-view="overview"] { display: none; }
  .topbar .nav > :is(button, .nav-dd, .nav-link) { flex: 0 0 auto; scroll-snap-align: start; }
  .topbar .nav button,
  .topbar .nav > .nav-link { min-height: 40px; padding: 7px 7px; font-size: 12px; }
  .topbar .nav-dd-menu {
    position: fixed;
    top: 106px;
    right: 10px;
    left: 10px;
    max-height: calc(100dvh - 126px);
    overflow-y: auto;
    background: var(--panel);
  }
  .mobile-workflow-tabs { top: 108px; }

  .section-head h2 { font-size: clamp(22px, 6vw, 26px); }
  .section-head p { font-size: 14px; }
  .card h4 { font-size: 15px; }
  :is(.ctrl label, .bar .lab, .fit-lab, .pat-sublabel, .strategy-grid label, .adv-field > label) {
    font-size: 13px;
  }

  :where(.view) :is(input:not([type="range"]):not([type="checkbox"]):not([type="radio"]), select, textarea,
    .btn, .tbtn, .pat-tab, .fchip, .cex, .seg > button, .adv-rx, [role="tab"]) { min-height: 44px; }
  :where(.view) :is(button, a[href], [role="button"]) { min-width: 44px; }
  .mobile-workflow-tabs button { min-height: 44px; font-size: 13px; }
  .mobile-summary-panel > p,
  .mobile-summary-signal,
  .mobile-summary-kpi small,
  .analysis-module-count { font-size: 12.5px; }
  .mobile-summary-kpi small { white-space: normal; overflow: visible; text-overflow: clip; }

  /* The dark translucent KPI tile used by the mobile workflow becomes a muddy grey
     block on a light canvas. Keep the same hierarchy with a proper light surface. */
  :root[data-theme="light"] .mobile-summary-kpi {
    background: color-mix(in srgb, var(--panel) 88%, var(--acc) 12%);
    border-color: var(--line2);
  }

  .tech-filter { padding-block: 12px; }
  .tech-filter .fline { align-items: flex-start; }
  .tech-filter .flabel { flex: 0 0 100%; min-width: 0; margin-bottom: 2px; }
  .fchip { min-width: 44px; padding-inline: 12px; }
  .lib-link { min-width: 44px; min-height: 44px; }
  .adv-field { flex-direction: column; gap: 7px; }
  .adv-field > label { width: auto; padding-top: 0; }
  .adv-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 80px 44px;
    align-items: center;
  }
  .adv-row .adv-rf { grid-column: 1; grid-row: 1; width: 100%; max-width: none; }
  .adv-row .adv-ro { grid-column: 2; grid-row: 1; width: 100%; max-width: none; }
  .adv-row .adv-rx { grid-column: 3; grid-row: 1; }
  .adv-row .adv-rv { grid-column: 1 / -1; grid-row: 2; width: 100%; }

  #view-manufacturing .mfg-workflow-nav { padding-bottom: 8px; }
  #view-manufacturing .mfg-workflow-nav a { min-height: 64px; }
  #view-manufacturing .mfg-workflow-nav small {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }
  #view-manufacturing .mfg-param-group {
    padding: 6px 0 10px;
    border-width: 0 0 1px;
  }
  #view-manufacturing .mfg-param-group:last-child { border-bottom: 0; }
  #view-manufacturing .mfg-param { padding-inline: 2px; }
}

@media print {
  .card,
  #view-manufacturing .mfg-work-card,
  #view-manufacturing .mfg-secondary-card { break-inside: avoid; box-shadow: none !important; }
}