/* Catalysis illustration: original synthetic curves in the TEM visual language. */
.catalysis-page .detail { max-width: none; }
.catalysis-overview { margin-top: 22px; }
.catalysis-notice { padding: 16px 18px; border-left: 2px solid var(--accent); background: #101c19; color:var(--prose); font: calc(15px + var(--prose-size-increase))/1.8 var(--font-body); max-width:var(--prose-width); }
.catalysis-notice strong { color: #e1efea; }
.catalysis-figure { margin: 28px 0 0; }
.catalysis-figure > figcaption { margin: 16px 0 0; color:var(--prose); font: calc(12px + var(--prose-size-increase))/1.75 var(--font-body); max-width:var(--prose-width); }
.catalysis-demo { --cat-accent: #6cd4c8; --cat-amber: #f3b887; color: #e8e4dd; font-family: var(--font-ui); }
.catalysis-demo [hidden] { display: none !important; }
.cat-notice { color: #aebeb7; font: 11px/1.7 var(--font-ui); padding-bottom: 18px; }
.cat-step { display: flex; align-items: baseline; gap: 9px; margin: 23px 0 16px; font: 500 15px/1.5 var(--font-ui); }
.cat-step > span { color: var(--cat-accent); font: 13px ui-monospace, SFMono-Regular, Consolas, monospace; }
.cat-apparatus { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; }
.cat-apparatus li { position: relative; padding: 16px 13px 14px; border: 1px solid #344642; border-radius: 5px; background: #0d1715; }
.cat-apparatus li:not(:last-child)::after { content: '→'; color: var(--cat-accent); position: absolute; right: -16px; top: 45%; font: 16px var(--font-ui); }
.cat-apparatus strong { display: block; margin: 0 0 8px; font-size: 13px; font-weight: 500; line-height: 1.5; }
.cat-apparatus p { margin: 0; color:var(--prose); font: calc(12px + var(--prose-size-increase))/1.7 var(--font-body); }
.cat-control-note { color:var(--prose); font: calc(12px + var(--prose-size-increase))/1.75 var(--font-body); margin: 12px 0 20px; }
.cat-hypotheses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; padding: 19px 0 4px; }
.cat-hypotheses h4 { display: flex; align-items: center; gap: 7px; margin: 0 0 8px; font: 500 13px/1.5 var(--font-ui); }
.cat-hypotheses p { margin: 0; color:var(--prose); font: calc(13px + var(--prose-size-increase))/1.7 var(--font-body); }
.cat-step-plot { margin-top: 28px; }
.cat-presets { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 15px; }
.cat-presets button, .cat-reveal { padding: 9px 13px; min-height: 42px; border: 1px solid #344642; border-radius: 5px; color: #d6e1db; background: #111919; font: 13px/1.4 var(--font-ui); cursor: pointer; }
.cat-presets button:hover { background: #1a302b; }
.cat-presets button[aria-pressed="true"] { color: var(--cat-accent); border-color: var(--cat-accent); background: #142e2a; }
.cat-presets button:focus-visible, .cat-reveal:focus-visible, .cat-option input:focus-visible, .catalysis-method summary:focus-visible { outline: 2px solid white; outline-offset: 4px; }
.cat-option { display: flex; align-items: center; gap: 9px; color: #c8d2cf; cursor: pointer; font-size: 12px; line-height: 1.6; min-height: 38px; margin-bottom: 12px; }
.cat-option input { accent-color: var(--cat-accent); width: 16px; height: 16px; flex-shrink: 0; }
.cat-chart { border: 1px solid #283936; background: #0a1211; border-radius: 6px; padding: 8px 6px; overflow: hidden; }
.cat-chart svg { display: block; width: 100%; height: auto; font-family: var(--font-ui); }
.cat-chart-compact { display: none; }
.cat-chart-label { fill: #c5d4cd; font-size: 14px; }
.cat-tick { fill: #aebeb7; font-size: 13px; font-variant-numeric: tabular-nums; }
.cat-grid { stroke: #233630; stroke-width: 1; }
.cat-axis { fill: none; stroke: #53665e; stroke-width: 1; }
.cat-transition { stroke: #61756c; stroke-width: 1; stroke-dasharray: 3 5; }
.cat-wet { fill: #1e3d37; stroke: #0a1211; stroke-width: 1; }
.cat-dry { fill: #28312b; stroke: #0a1211; stroke-width: 1; }
.cat-feed-label { fill: #d8e7e0; font-size: 14px; }
.cat-reference { fill: none; stroke: #8fa69d; stroke-dasharray: 2 5; stroke-width: 1; }
.cat-model-a { fill: none; stroke: var(--cat-accent); stroke-width: 3; stroke-linejoin: round; }
.cat-model-b { fill: none; stroke: var(--cat-amber); stroke-width: 2; stroke-dasharray: 8 5; }
.cat-observation { fill: #e7eeea; stroke: #0a1211; stroke-width: 1; }
.cat-legend { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 13px 0 5px; color: #b1c0bd; font-size: 12px; line-height: 1.5; }
.cat-legend > span { display: inline-flex; align-items: center; gap: 7px; }
.cat-key { display: inline-block; flex-shrink: 0; width: 19px; height: 0; border-top: 3px solid var(--cat-accent); }
.cat-key-b { border-top: 2px dashed var(--cat-amber); }
.cat-key-observation { width: 6px; height: 6px; border: 0; border-radius: 50%; background: #e7eeea; }
.cat-axis-note { color:var(--prose); font: calc(12px + var(--prose-size-increase))/1.7 var(--font-body); margin: 10px 0 0; }
.cat-decision { margin-top: 20px; padding: 17px; border-radius: 5px; background: #122421; }
.cat-decision > span { font-size: 12px; color: #b1c0bd; }
.cat-decision h3 { margin: 9px 0 7px; color: var(--cat-accent); font: 500 16px/1.5 var(--font-ui); }
.cat-decision p, .cat-next p { margin: 0; color:var(--prose); font: calc(14px + var(--prose-size-increase))/1.75 var(--font-body); }
.cat-next { padding: 18px 0 0; }
.cat-next h4 { margin: 0 0 8px; color: #d3dfda; font: 500 14px/1.5 var(--font-ui); }
.cat-next p { color: #b1c0bd; }
.catalysis-method { margin-top: 22px; color:var(--prose); font: calc(13px + var(--prose-size-increase))/1.8 var(--font-body); max-width:var(--prose-width); }
.catalysis-method summary { cursor: pointer; color: #d9e1df; padding: 7px 0; font-family: var(--font-ui); }
.catalysis-method p { margin: 14px 0 0; }
.catalysis-method a { color: var(--accent); }
@media (max-width: 1050px) and (min-width: 761px), (max-width: 600px) {
  .cat-chart-wide { display: none; }
  .cat-chart-compact { display: block; }
  .cat-chart-label, .cat-feed-label { font-size: 15px; }
  .cat-tick { font-size: 14px; }
  .cat-apparatus { grid-template-columns: 1fr; gap: 20px; }
  .cat-apparatus li { padding: 12px 16px; }
  .cat-apparatus strong { margin: 0 0 5px; }
  .cat-apparatus li:not(:last-child)::after { content: '↓'; right: auto; left: 50%; top: auto; bottom: -19px; }
  .cat-hypotheses { grid-template-columns: 1fr; gap: 16px; }
  .cat-presets button, .cat-reveal { padding: 9px 10px; min-height: 44px; font-size: 12px; }
}
@media print { .cat-controls { display: none !important; } }

.cat-reveal { color: var(--cat-accent); border-color: #52776b; background: #122421; margin-bottom: 6px; }
.cat-reveal:hover:enabled { background: #1a302b; }
.cat-reveal:disabled { color: #b1c0bd; border-color: #344642; cursor: default; background: #111919; }
