body.note-page {
  background: var(--page-paper);
  color: var(--page-ink);
  font-family: var(--font-sans);
  line-height: 1.65;
}

.note-page a { color: inherit; text-underline-offset: .25rem; }
.note-page :focus-visible { outline: 2px solid var(--page-ink); outline-offset: 4px; }
.note-page section { scroll-margin-top: 6rem; }

.note-article { width: min(100% - 2.5rem, 40rem); margin-inline: auto; padding: clamp(3rem, 6vw, 4.5rem) 0 clamp(4rem, 8vw, 6rem); }

.note-kicker {
  font-family: var(--font-mono);
  font-size: .7rem;
  font-weight: 550;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--page-muted);
  margin-bottom: 1rem;
}
.note-kicker a { color: var(--page-muted); text-decoration: underline; }

.note-head h1 {
  font-size: clamp(2rem, 4.6vw, 2.9rem);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.14;
}

.note-dek {
  margin-top: 1.25rem;
  max-width: 34rem;
  font-size: clamp(1.05rem, 1.6vw, 1.2rem);
  line-height: 1.5;
  color: var(--page-muted);
}

.note-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1.25rem;
  margin-top: 1.75rem;
  padding: 1.1rem 0;
  border-top: 1px solid var(--page-ink);
  border-bottom: 1px solid var(--page-line);
  font-family: var(--font-mono);
  font-size: .78rem;
  color: var(--page-muted);
}

.note-body { margin-top: 2.5rem; }
.note-body p { margin: 0 0 1.35rem; }
.note-body ul, .note-body ol { margin: 0 0 1.35rem; padding-left: 1.25rem; }
.note-body li { margin: .4rem 0; }
.note-body strong { font-weight: 650; }
.note-body a { text-decoration: underline; font-weight: 550; }

.note-toc {
  margin-bottom: 2rem;
  padding: 1.1rem 0;
  border-top: 1px solid var(--page-line);
  border-bottom: 1px solid var(--page-ink);
}
.note-toc b {
  display: block;
  margin-bottom: .6rem;
  font-family: var(--font-mono);
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--page-muted);
}
.note-toc a { display: inline-block; margin: .2rem 1.1rem .2rem 0; font-size: .92rem; }

.note-lede { font-size: 1.18rem; line-height: 1.55; }

.note-stub-status { color: var(--page-muted); }

.note-act {
  margin: clamp(3rem, 6vw, 4.5rem) 0 2rem;
  padding: 1.5rem 0 1.25rem;
  border-top: 2px solid var(--page-ink);
  border-bottom: 1px solid var(--page-line);
}
.note-act-n {
  display: block;
  margin-bottom: .5rem;
  font-family: var(--font-mono);
  font-size: .78rem;
  color: var(--page-muted);
}
.note-act h2 {
  font-size: clamp(1.4rem, 3vw, 1.8rem);
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.18;
}
.note-act p { margin-top: .5rem; color: var(--page-muted); font-size: 1rem; }

.dispensary-guide-page .note-body section h2 {
  font-size: clamp(1.55rem, 3.2vw, 2.05rem);
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.16;
  margin: 3rem 0 1.1rem;
}

.note-body section h3 {
  font-size: clamp(1.25rem, 2.6vw, 1.55rem);
  font-weight: 680;
  letter-spacing: -.015em;
  line-height: 1.24;
  margin: 2.75rem 0 1rem;
}
.note-body section h4 {
  font-size: 1.05rem;
  font-weight: 650;
  margin: 1.75rem 0 .5rem;
}

.note-body blockquote {
  margin: 1.75rem 0;
  padding: .1rem 0 .1rem 1.25rem;
  border-left: 2px solid var(--page-ink);
  font-weight: 650;
  font-size: 1.15rem;
  line-height: 1.4;
}

.note-chain {
  font-family: var(--font-mono);
  font-size: .82rem;
  line-height: 2;
  border-top: 1px solid var(--page-ink);
  border-bottom: 1px solid var(--page-ink);
  padding: .9rem 0;
  margin: 1.5rem 0;
  overflow-x: auto;
  white-space: nowrap;
}
.note-chain i { font-style: normal; color: var(--page-muted); padding: 0 .2rem; }

.note-datacard {
  background: var(--page-ink);
  color: var(--page-paper);
  padding: 1.25rem 1.4rem;
  margin: 1.75rem 0;
  font-family: var(--font-mono);
  font-size: .82rem;
  line-height: 1.85;
  overflow-x: auto;
  white-space: pre;
}
.note-datacard-cap {
  display: block;
  color: #9a9a9a;
  font-size: .74rem;
  white-space: normal;
  margin-bottom: .9rem;
  padding-bottom: .8rem;
  border-bottom: 1px solid #333;
}
.note-datacard .k { color: #fff; }
.note-datacard .v { color: #bdbdbd; }
.note-datacard .p { color: #777; }

.note-callout { background: rgba(9,9,9,.04); border-left: 2px solid var(--page-ink); padding: 1.1rem 1.25rem; margin: 1.5rem 0; }
.note-callout b { display: block; font-family: var(--font-mono); font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; margin-bottom: .5rem; color: var(--page-muted); }
.note-callout-fig { font-family: var(--font-mono); font-size: .95rem; line-height: 1.9; }

.note-cta { margin: 3rem 0 0; padding: 1.75rem; border: 1px solid var(--page-ink); }
.note-cta h3 { font-size: 1.25rem; font-weight: 700; margin-bottom: .6rem; }
.note-cta p { color: var(--page-muted); }
.note-cta-btn {
  display: inline-flex;
  min-height: 2.9rem;
  align-items: center;
  gap: .7rem;
  margin-top: .5rem;
  padding: .7rem 1.2rem;
  background: var(--page-ink);
  color: var(--page-paper);
  font-weight: 650;
  text-decoration: none !important;
}
.note-cta-btn:hover { background: #303030; }

.note-sources { margin-top: 3rem; padding-top: 1.5rem; border-top: 2px solid var(--page-ink); }
.note-sources ol { font-size: .92rem; }
.note-sources li { line-height: 1.6; margin: .55rem 0; }

.note-author { margin-top: 2.5rem; padding: 1.5rem 0; border-top: 1px solid var(--page-line); border-bottom: 1px solid var(--page-line); }
.note-author h3 { font-size: 1.05rem; margin-bottom: .5rem; }
.note-author-small { color: var(--page-muted); font-size: .85rem; }

.note-back { margin-top: 2.5rem; }
.note-back a { font-weight: 600; }

.note-figure { margin: 2rem 0; }
.note-figure img { width: 100%; height: auto; display: block; border: 1px solid var(--page-line); }
.note-figure figcaption { margin-top: .6rem; font-size: .85rem; color: var(--page-muted); }

.note-table-wrap { overflow-x: auto; margin: 1.75rem 0; }
.note-table-wrap table { width: 100%; min-width: 32rem; border-collapse: collapse; margin: 0; font-size: .92rem; }
.note-table-wrap th, .note-table-wrap td { text-align: left; padding: .7rem 1.1rem .7rem 0; border-bottom: 1px solid var(--page-line); vertical-align: top; }
.note-table-wrap th { font-family: var(--font-mono); font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--page-muted); border-bottom: 2px solid var(--page-ink); }

.layers-list { list-style: none; margin: 1.75rem 0; padding: 0; border-top: 1px solid var(--page-line); }
.layers-list li { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem .9rem; padding: .85rem 0; border-bottom: 1px solid var(--page-line); }
.layers-list li[data-depth="1"] { margin-left: 1.1rem; }
.layers-list li[data-depth="2"] { margin-left: 2.2rem; }
.layers-list li[data-depth="3"] { margin-left: 3.3rem; }
.layers-list li[data-depth="4"] { margin-left: 4.4rem; }
.layers-list b { font-family: var(--font-mono); font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; white-space: nowrap; }
.layers-list span { color: var(--page-muted); font-size: .92rem; }

@media (max-width: 480px) {
  .layers-list li[data-depth] { margin-left: 0; }
  .layers-list b { flex-basis: 100%; }
}

@media (max-width: 390px) {
  .note-article { width: min(100% - 2rem, 40rem); }
  .note-cta-btn { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .note-page * { scroll-behavior: auto; }
}
