/* Cache-busting Week 01 style refresh.
 * This file intentionally contains only the current callout palette and
 * native classification-map styles, so browsers fetch a new CSS URL when the
 * Fall 2026 Zensical pattern changes.
 */

:root {
  --chem-callout-note: 79 70 229;
  --chem-callout-abstract: 2 132 199;
  --chem-callout-info: 8 145 178;
  --chem-callout-tip: 5 150 105;
  --chem-callout-success: 22 163 74;
  --chem-callout-question: 101 163 13;
  --chem-callout-warning: 217 119 6;
  --chem-callout-danger: 220 38 38;
  --chem-callout-example: 147 51 234;
  --chem-callout-quote: 100 116 139;
  --chem-callout-reading: 3 105 161;
  --chem-callout-resource: 37 99 235;
  --chem-callout-formula: 124 58 237;
  --chem-callout-flow: 234 88 12;
  --chem-callout-practice: 13 148 136;
  --chem-callout-problem: 190 24 93;
}

body[data-md-color-scheme="slate"] {
  --chem-callout-note: 129 140 248;
  --chem-callout-abstract: 56 189 248;
  --chem-callout-info: 34 211 238;
  --chem-callout-tip: 52 211 153;
  --chem-callout-success: 74 222 128;
  --chem-callout-question: 163 230 53;
  --chem-callout-warning: 251 191 36;
  --chem-callout-danger: 248 113 113;
  --chem-callout-example: 196 181 253;
  --chem-callout-quote: 148 163 184;
  --chem-callout-reading: 125 211 252;
  --chem-callout-resource: 96 165 250;
  --chem-callout-formula: 196 181 253;
  --chem-callout-flow: 251 146 60;
  --chem-callout-practice: 94 234 212;
  --chem-callout-problem: 244 114 182;
}

.md-typeset .admonition,
.md-typeset details {
  --chem-admonition-accent: var(--chem-callout-info);
  border: 1px solid color-mix(in oklab, CanvasText 14%, Canvas 86%);
  box-shadow: 0 1px 2px color-mix(in oklab, CanvasText 5%, transparent);
}

.md-typeset .admonition > .admonition-title,
.md-typeset details > summary {
  background-color: transparent;
}

.md-typeset .admonition > .admonition-title::before,
.md-typeset details > summary::before {
  background-color: rgb(var(--chem-admonition-accent));
}

.md-typeset .admonition > .admonition-title::after,
.md-typeset details > summary::after {
  color: rgb(var(--chem-admonition-accent));
}

.md-typeset .admonition.note,
.md-typeset details.note {
  --chem-admonition-accent: var(--chem-callout-note);
  background-color: rgb(var(--chem-callout-note) / 0.045);
}

.md-typeset .admonition.abstract,
.md-typeset details.abstract,
.md-typeset .admonition.summary,
.md-typeset details.summary,
.md-typeset .admonition.tldr,
.md-typeset details.tldr {
  --chem-admonition-accent: var(--chem-callout-abstract);
  background-color: rgb(var(--chem-callout-abstract) / 0.045);
}

.md-typeset .admonition.info,
.md-typeset details.info {
  --chem-admonition-accent: var(--chem-callout-info);
  background-color: rgb(var(--chem-callout-info) / 0.045);
}

.md-typeset .admonition.tip,
.md-typeset details.tip,
.md-typeset .admonition.hint,
.md-typeset details.hint,
.md-typeset .admonition.important,
.md-typeset details.important {
  --chem-admonition-accent: var(--chem-callout-tip);
  background-color: rgb(var(--chem-callout-tip) / 0.045);
}

.md-typeset .admonition.success,
.md-typeset details.success,
.md-typeset .admonition.check,
.md-typeset details.check,
.md-typeset .admonition.done,
.md-typeset details.done {
  --chem-admonition-accent: var(--chem-callout-success);
  background-color: rgb(var(--chem-callout-success) / 0.045);
}

.md-typeset .admonition.question,
.md-typeset details.question,
.md-typeset .admonition.help,
.md-typeset details.help,
.md-typeset .admonition.faq,
.md-typeset details.faq {
  --chem-admonition-accent: var(--chem-callout-question);
  background-color: rgb(var(--chem-callout-question) / 0.045);
}

.md-typeset .admonition.warning,
.md-typeset details.warning,
.md-typeset .admonition.caution,
.md-typeset details.caution,
.md-typeset .admonition.attention,
.md-typeset details.attention {
  --chem-admonition-accent: var(--chem-callout-warning);
  background-color: rgb(var(--chem-callout-warning) / 0.045);
}

.md-typeset .admonition.danger,
.md-typeset details.danger,
.md-typeset .admonition.failure,
.md-typeset details.failure,
.md-typeset .admonition.fail,
.md-typeset details.fail,
.md-typeset .admonition.missing,
.md-typeset details.missing,
.md-typeset .admonition.bug,
.md-typeset details.bug {
  --chem-admonition-accent: var(--chem-callout-danger);
  background-color: rgb(var(--chem-callout-danger) / 0.045);
}

.md-typeset .admonition.example,
.md-typeset details.example {
  --chem-admonition-accent: var(--chem-callout-example);
  background-color: rgb(var(--chem-callout-example) / 0.045);
}

.md-typeset .admonition.quote,
.md-typeset details.quote,
.md-typeset .admonition.cite,
.md-typeset details.cite {
  --chem-admonition-accent: var(--chem-callout-quote);
  background-color: rgb(var(--chem-callout-quote) / 0.045);
}

.md-typeset .admonition.reading,
.md-typeset details.reading {
  --chem-admonition-accent: var(--chem-callout-reading);
  background-color: rgb(var(--chem-callout-reading) / 0.055);
}

.md-typeset .admonition.resource,
.md-typeset details.resource {
  --chem-admonition-accent: var(--chem-callout-resource);
  background-color: rgb(var(--chem-callout-resource) / 0.055);
}

.md-typeset .admonition.formula,
.md-typeset details.formula {
  --chem-admonition-accent: var(--chem-callout-formula);
  background-color: rgb(var(--chem-callout-formula) / 0.055);
}

.md-typeset .admonition.flow,
.md-typeset details.flow {
  --chem-admonition-accent: var(--chem-callout-flow);
  background-color: rgb(var(--chem-callout-flow) / 0.055);
}

.md-typeset .admonition.practice,
.md-typeset details.practice {
  --chem-admonition-accent: var(--chem-callout-practice);
  background-color: rgb(var(--chem-callout-practice) / 0.055);
}

.md-typeset .admonition.problem,
.md-typeset details.problem {
  --chem-admonition-accent: var(--chem-callout-problem);
  background-color: rgb(var(--chem-callout-problem) / 0.055);
}

.matter-classification {
  --matter-pure-rgb: 37 99 235;
  --matter-mixture-rgb: 217 119 6;
  --matter-element-rgb: 22 163 74;
  --matter-compound-rgb: 124 58 237;
  --matter-homogeneous-rgb: 8 145 178;
  --matter-heterogeneous-rgb: 220 38 38;
  display: grid;
  gap: 0.9rem;
  margin: 1rem 0;
}

body[data-md-color-scheme="slate"] .matter-classification {
  --matter-pure-rgb: 96 165 250;
  --matter-mixture-rgb: 251 146 60;
  --matter-element-rgb: 74 222 128;
  --matter-compound-rgb: 196 181 253;
  --matter-homogeneous-rgb: 34 211 238;
  --matter-heterogeneous-rgb: 248 113 113;
}

.matter-classification__node {
  --matter-accent-rgb: 71 85 105;
  background: rgb(var(--matter-accent-rgb) / 0.04);
  border: 1px solid color-mix(in oklab, CanvasText 14%, Canvas 86%);
  border-radius: 8px;
  box-shadow: 0 1px 2px color-mix(in oklab, CanvasText 5%, transparent);
  display: grid;
  gap: 0.22rem;
  min-height: 5.2rem;
  padding: 0.75rem 0.85rem;
}

.matter-classification__root {
  justify-items: center;
  text-align: center;
}

.matter-classification__branches,
.matter-classification__children {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.matter-classification__branch {
  display: grid;
  gap: 0.75rem;
}

.matter-classification__branch--pure > .matter-classification__node {
  --matter-accent-rgb: var(--matter-pure-rgb);
}

.matter-classification__branch--mixture > .matter-classification__node {
  --matter-accent-rgb: var(--matter-mixture-rgb);
}

.matter-classification__node--element {
  --matter-accent-rgb: var(--matter-element-rgb);
}

.matter-classification__node--compound {
  --matter-accent-rgb: var(--matter-compound-rgb);
}

.matter-classification__node--homogeneous {
  --matter-accent-rgb: var(--matter-homogeneous-rgb);
}

.matter-classification__node--heterogeneous {
  --matter-accent-rgb: var(--matter-heterogeneous-rgb);
}

.matter-classification__node strong {
  color: rgb(var(--matter-accent-rgb));
  font-size: 0.98rem;
  line-height: 1.2;
}

.matter-classification__node span {
  color: color-mix(in oklab, CanvasText 72%, Canvas 28%);
  font-size: 0.84rem;
  line-height: 1.35;
}

@media (max-width: 760px) {
  .matter-classification__branches,
  .matter-classification__children {
    grid-template-columns: 1fr;
  }
}