/* Original Palinoia learning library. Printed kit values remain unstyled facts. */
.resources { min-width: 0; --resource-sage: var(--atelier-selected); --resource-peach: var(--atelier-surface); --resource-blue: var(--atelier-raised); --resource-lilac: var(--atelier-bg); --resource-art-ink: var(--atelier-text); }
.resources h1, .resources h2, .resources h3, .resources p { overflow-wrap: anywhere; }
.resources a, .resources summary { -webkit-tap-highlight-color: transparent; }
.resources a:focus-visible, .resources summary:focus-visible { outline: 3px solid var(--focus); outline-offset: 5px; }
.resources summary { cursor: pointer; list-style: none; }
.resources summary::-webkit-details-marker { display: none; }
.resources summary::marker { content: ""; }
.resource-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.resource-eyebrow, .resource-card-category, .resource-source-label { display: block; font-size: .6875rem; font-weight: 650; line-height: 1.5; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.resource-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; gap: 2rem; padding: 2.5rem 0 3rem; margin-bottom: 2.25rem; border-bottom: 1px solid var(--line); }
.resource-hero h1 { font-size: clamp(2.4rem, 4vw, 3.75rem); font-weight: 550; line-height: 1.1; letter-spacing: -.045em; margin: .6rem 0 1.1rem; }
.resource-hero-description { max-width: 43rem; margin: 0; color: var(--muted); font-size: 1.125rem; line-height: 1.7; }
.resource-quicklinks { display: flex; gap: .5rem 1.4rem; flex-wrap: wrap; margin-top: 1.4rem; }
.resource-quicklinks a { display: inline-flex; align-items: center; gap: .6rem; min-height: 2.75rem; font-size: .875rem; font-weight: 550; text-decoration: none; border-bottom: 1px solid var(--line-main); }
.resource-section { margin-bottom: 3.4rem; }
.resource-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.35rem; }
.resource-section-heading > div { display: flex; align-items: baseline; gap: .85rem; min-width: 0; }
.resource-section-number { flex: none; font-size: .75rem; line-height: 1.5; font-variant-numeric: tabular-nums; color: var(--muted); }
.resource-section h2, .resource-guide-banner h2, .resource-document-panel h2, .resource-support h2 { margin: 0; font-size: 1.35rem; font-weight: 550; letter-spacing: -.025em; line-height: 1.35; }
.resource-text-link { display: inline-flex; align-items: center; gap: .6rem; min-height: 2.75rem; font-size: .875rem; font-weight: 550; text-decoration: underline; text-underline-offset: .25em; }
.resource-section-heading > .resource-text-link { flex-shrink: 0; }
.resource-section-intro { margin: -0.6rem 0 1.5rem; font-size: .9375rem; line-height: 1.65; color: var(--muted); }
.resource-card-row { display: grid; gap: 1rem; }
.resource-about-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.resource-concern-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.resource-parameter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.6rem 1rem; }
.resource-card { display: block; min-width: 0; color: var(--ink); text-decoration: none; border-radius: 14px 14px 5px 5px; transition: transform var(--motion-normal) var(--ease-standard); }
.resource-card:hover { transform: translateY(-3px); }
.resource-card:hover h3 { color: var(--accent); }
.resource-card-row .resource-card:focus-visible { outline-offset: 2px; }
.resource-card-caption { position: relative; padding: .85rem 1.5rem .2rem .1rem; }
.resource-card-caption h3 { margin: .25rem 0 0; font-size: 1rem; font-weight: 550; letter-spacing: -.015em; line-height: 1.5; }
.resource-card-category { font-size: .625rem; letter-spacing: .075em; }
.resource-card-open { position: absolute; top: 1.6rem; right: .1rem; font-size: 1.1rem; color: var(--muted); }
.resource-parameter-art { overflow: hidden; border-radius: 12px; aspect-ratio: 3 / 2; background: var(--resource-sage); }
.resource-tone-water-balance { background: var(--resource-sage); color: var(--resource-art-ink); }
.resource-tone-metals { background: var(--resource-peach); color: var(--resource-art-ink); }
.resource-tone-disinfection { background: var(--resource-blue); color: var(--resource-art-ink); }
.resource-tone-nutrients { background: var(--resource-lilac); color: var(--resource-art-ink); }
.resource-tone-minerals { background: var(--resource-sage); color: var(--resource-art-ink); }
.resource-tone-bacteria { background: var(--resource-lilac); color: var(--resource-art-ink); }
.resource-topic-art { overflow: hidden; border-radius: 12px; aspect-ratio: 3 / 2; background: var(--resource-sage); }
.resource-concern-card .resource-topic-art { aspect-ratio: 3 / 2; }
.resource-faq-section { border: 1px solid var(--line); border-radius: 18px; padding: 2rem; margin: 0 0 2.5rem; background: var(--surface-subtle); }
.resource-faq-header { display: flex; gap: 1.1rem; align-items: center; margin-bottom: 1.5rem; }
.resource-faq-icon { display: grid; place-items: center; flex: 0 0 3.5rem; width: 3.5rem; height: 3.5rem; color: var(--accent); background: var(--paper); border-radius: 16px; border: 1px solid var(--line); }
.resource-faq-header h2 { margin: .2rem 0 .25rem; font-size: 1.5rem; font-weight: 550; letter-spacing: -.025em; line-height: 1.3; }
.resource-faq-header p { margin: 0; color: var(--muted); font-size: .875rem; }
.resource-faq-search, .resource-search { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: .65rem .75rem; margin-bottom: 1.5rem; }
.resource-faq-search label, .resource-search label { min-width: 0; font-size: .8125rem; font-weight: 550; color: var(--muted); }
.resource-faq-search input, .resource-search input { width: 100%; min-width: 0; min-height: 3rem; border: 1px solid var(--control-line); background: var(--paper); border-radius: 8px; margin-top: .45rem; padding: .7rem .9rem; color: var(--ink); font-size: 1rem; }
.resource-faq-search button, .resource-search button { min-height: 3rem; }
.resource-faq-groups { display: grid; grid-template-columns: minmax(0, 1fr); }
.resource-faq-group + .resource-faq-group { margin-top: 1.5rem; }
.resource-faq-group h3 { margin: 0; padding: .5rem 0; font-size: .6875rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-weight: 650; }
.resource-faq-item { border-bottom: 1px solid var(--line); }
.resource-faq-item > summary { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; min-height: 3.65rem; padding: .85rem .1rem; font-size: 1rem; font-weight: 500; line-height: 1.55; }
.resource-disclosure-mark { position: relative; display: block; width: 1rem; height: 1rem; flex: 0 0 1rem; color: var(--accent); transition: transform var(--motion-fast) var(--ease-standard); }
.resource-disclosure-mark::before, .resource-disclosure-mark::after { content: ""; position: absolute; height: 1.5px; width: .75rem; top: 50%; left: 50%; transform: translate(-50%, -50%); background: currentColor; }
.resource-disclosure-mark::after { transform: translate(-50%, -50%) rotate(90deg); transition: transform var(--motion-fast) var(--ease-standard); }
details[open] > summary .resource-disclosure-mark::after { transform: translate(-50%, -50%) rotate(0); }
.resource-faq-answer { padding: 0 2.5rem 1rem .1rem; }
.resource-faq-answer .resource-copy p { font-size: .9375rem; }
.resource-guide-banner { display: flex; align-items: center; flex-wrap: wrap; gap: 1.2rem 1.5rem; padding: 1.6rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-top: 2.5rem; }
.resource-guide-icon { display: grid; place-items: center; flex: none; width: 3.25rem; height: 3.25rem; color: var(--accent); background: var(--mint); border-radius: 50%; }
.resource-guide-banner > div:not(.resource-guide-actions) { flex: 1 1 14rem; }
.resource-guide-banner h2 { margin: .2rem 0; font-size: 1.125rem; }
.resource-guide-banner p { margin: .4rem 0 0; color: var(--muted); font-size: .875rem; line-height: 1.6; }
.resource-guide-actions { display: flex; flex-direction: column; align-items: flex-start; }
.resource-document-link { display: inline-flex; align-items: center; gap: .5rem; min-height: 2.75rem; max-width: 100%; color: var(--accent); font-size: .875rem; line-height: 1.5; text-decoration: underline; text-underline-offset: .2em; }
.resource-arrow { white-space: nowrap; flex-shrink: 0; }
.resource-unavailable { display: block; padding: .6rem 0; }
.resource-topnav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem 0; margin: 1rem 0 1.75rem; border-bottom: 1px solid var(--line); }
.resource-back { display: inline-flex; gap: .7rem; align-items: center; min-height: 2.75rem; font-size: .875rem; font-weight: 550; text-decoration: none; }
.resource-topnav-label { color: var(--muted); font-size: .5625rem; letter-spacing: .15em; }
.resource-page-head { margin: 0 0 2.2rem; }
.resource-page-head h1 { font-size: clamp(2rem, 3.5vw, 3rem); font-weight: 550; letter-spacing: -.045em; line-height: 1.15; margin: .6rem 0 .9rem; }
.resource-page-head > p:last-child:not(.resource-eyebrow) { max-width: 40rem; color: var(--muted); font-size: 1rem; line-height: 1.7; margin: 0; }
.resource-search { max-width: 43rem; padding: 1.25rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-subtle); margin-bottom: 1.2rem; }
.resource-search-field { display: block; position: relative; }
.resource-search-symbol { position: absolute; left: .9rem; top: 50%; font-size: 1.4rem; line-height: 1; transform: translateY(-30%); pointer-events: none; }
.resource-search-field input { padding-left: 2.7rem; }
.resource-search > p { grid-column: 1 / -1; margin: 0; font-size: .75rem; color: var(--muted); }
.resource-results-count, .resource-faq-results-count { font-size: .8125rem; color: var(--muted); line-height: 1.6; margin: .75rem 0 1.4rem; }
.resource-empty { padding: 2rem 1rem; border: 1px dashed var(--control-line); border-radius: 12px; margin: 1rem 0; text-align: center; }
.resource-empty h3, .resource-empty h2 { margin: 0 0 .6rem; font-size: 1.25rem; }
.resource-empty p { margin: 0 auto; color: var(--muted); font-size: 1rem; line-height: 1.65; max-width: 35rem; }
.resource-not-found { padding-block: 3rem; }
.resource-not-found .secondary { display: inline-flex; margin-top: 1.5rem; }
.resource-procedures { display: grid; gap: 1rem; }
.resource-procedure { border: 1px solid var(--line); border-radius: 12px; background: var(--paper); }
.resource-procedure > summary { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr) 1rem; align-items: center; gap: 1rem; padding: 1.3rem; }
.resource-procedure-number { display: grid; place-items: center; height: 2.5rem; width: 2.5rem; border-radius: 9px; background: var(--mint); color: var(--accent); font-size: .75rem; }
.resource-procedure summary strong { display: block; font-weight: 550; line-height: 1.5; font-size: 1rem; }
.resource-procedure summary small { display: block; color: var(--muted); font-size: .8125rem; line-height: 1.5; margin-top: .2rem; }
.resource-procedure-body { padding: 0 1.5rem 1.5rem; }
.resource-procedure-body > p { font-size: .9375rem; line-height: 1.7; }
.resource-instructions { display: grid; gap: .75rem; margin: .5rem 0 1.5rem; padding-left: 1.5rem; line-height: 1.75; }
.resource-instructions li { padding-left: .3rem; }
.resource-source-links { display: flex; flex-wrap: wrap; gap: 0 1.3rem; margin-top: 1rem; }
.resource-article { max-width: 56rem; margin-inline: auto; }
.resource-article-header { display: grid; grid-template-columns: minmax(0, 1fr) 160px; align-items: start; gap: 2.5rem; margin: 0 0 1.75rem; }
.resource-article h1 { font-size: clamp(2.1rem, 3.3vw, 3.2rem); font-weight: 550; line-height: 1.15; letter-spacing: -.04em; margin: .5rem 0 1.3rem; }
.resource-detail-art { width: 160px; aspect-ratio: 3 / 2; overflow: hidden; border-radius: 14px; }
.resource-detail-topic-art { aspect-ratio: 3 / 2; }
.resource-copy { min-width: 0; margin-bottom: 1.1rem; }
.resource-copy p { font-size: 1rem; line-height: 1.8; margin: .5rem 0; color: var(--ink); }
.resource-review-label { display: inline-block; padding: .2rem .45rem; border: 1px solid var(--line-main); border-radius: 4px; font-size: .625rem; font-weight: 550; line-height: 1.5; letter-spacing: .015em; color: var(--muted); background: var(--surface-subtle); }
.resource-review-label.is-placeholder { color: var(--note-ink); border-color: var(--attention-line); background: var(--note-bg); }
.resource-placeholder { padding: .9rem 1rem; border-left: 2px solid var(--attention-line); border-radius: 0 8px 8px 0; background: var(--surface-subtle); }
.resource-citations { display: flex; align-items: baseline; flex-wrap: wrap; gap: .2rem .4rem; color: var(--muted); font-size: .6875rem; line-height: 1.7; }
.resource-citations a { display: inline; color: var(--muted); text-underline-offset: .2em; }
.resource-citations a > .resource-arrow { margin-left: .3rem; }
.resource-detail-facts { display: flex; flex-wrap: wrap; gap: 1.1rem 2.5rem; margin: 0 0 1.75rem; padding: 1.1rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.resource-detail-facts > div { flex: 1 1 9rem; }
.resource-detail-facts dt { color: var(--muted); font-size: .6875rem; line-height: 1.5; margin-bottom: .4rem; }
.resource-detail-facts dd { margin: 0; font-size: .875rem; line-height: 1.6; }
.resource-read-more { border: 1px solid var(--line); border-radius: 12px; overflow: clip; background: var(--paper); }
.resource-read-more > summary { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; padding: 1.2rem 1.5rem; min-height: 3.75rem; color: var(--accent); font-weight: 550; font-size: 1rem; line-height: 1.5; }
.resource-read-more[open] > summary { border-bottom: 1px solid var(--line); background: var(--surface-subtle); }
.resource-read-more > summary:focus-visible { outline-offset: -5px; }
.resource-article-body { padding: 1.75rem 1.5rem; }
.resource-article-body > section + section { margin-top: 2.5rem; }
.resource-article-body h2, .resource-related h2 { font-size: 1.25rem; font-weight: 550; line-height: 1.5; letter-spacing: -.015em; margin: 0 0 .8rem; }
.resource-approved-note { margin-top: 1.2rem; padding: 1.2rem; background: var(--surface-main); border: 1px solid var(--line-main); border-radius: 8px; }
.resource-approved-note p { font-size: .9375rem; line-height: 1.7; margin: .6rem 0 1rem; }
.resource-approved-note button { text-align: left; font-size: .875rem; line-height: 1.5; }
.resource-source-label { font-size: .625rem; letter-spacing: .07em; }
.resource-unit-caption { color: var(--muted); font-size: .875rem; margin: 0 0 1rem; }
.resource-levels { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; margin-top: 1.1rem; }
.resource-level-row { display: grid; grid-template-columns: minmax(7rem, .65fr) minmax(0, 1fr); gap: 1rem; align-items: baseline; padding: 1rem; }
.resource-level-row + .resource-level-row { border-top: 1px solid var(--line); }
.resource-level-label { font-size: 1rem; font-weight: 550; font-variant-numeric: tabular-nums; }
.resource-level-alternate { display: block; color: var(--muted); font-size: .75rem; line-height: 1.6; margin-top: .3rem; }
.resource-level-row > p { font-size: .875rem; line-height: 1.7; margin: 0; }
.resource-level-pending { color: var(--muted); }
.resource-catalog-explanation { font-size: .875rem; line-height: 1.75; color: var(--muted); margin: 1.5rem 0 0; }
.resource-catalog-explanation .resource-source-label { margin-bottom: .45rem; }
.resource-article-sources { padding-top: 1.3rem; border-top: 1px solid var(--line); }
.resource-article-sources .resource-citations { font-size: .8125rem; }
.resource-related { margin-top: 2rem; }
.resource-related-links { display: flex; flex-wrap: wrap; gap: .6rem; }
.resource-related-links > a { display: inline-flex; justify-content: space-between; align-items: center; gap: 1.5rem; min-height: 2.75rem; padding: .7rem 1rem; border: 1px solid var(--line-main); border-radius: 8px; font-size: .875rem; text-decoration: none; background: var(--surface-main); }
.resource-instructions-link { margin-top: 1.5rem; }
.resource-document-panel, .resource-support { padding: 1.5rem; margin-top: 1.5rem; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); }
.resource-component-documents { margin-top: 1.5rem; }
.resource-component-documents + .resource-component-documents { padding-top: 1.2rem; border-top: 1px solid var(--line); }
.resource-component-documents h3 { font-size: 1rem; font-weight: 550; margin: 0; line-height: 1.6; }
.resource-component-documents .resource-source-links { margin-top: .35rem; }
.resource-support p { font-size: .9375rem; line-height: 1.7; }
.resource-support .resource-review-label { display: table; margin-bottom: .7rem; }
.resource-article { animation: resource-reveal var(--motion-normal) var(--ease-standard); }
.resource-faq-item[open] > .resource-faq-answer, .resource-read-more[open] > .resource-article-body { animation: resource-reveal var(--motion-fast) var(--ease-standard); }
@keyframes resource-reveal { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } }

.resource-parameter-art { border-color: var(--atelier-border); }
@media (max-width: 1050px) and (min-width: 701px) {
 .resource-parameter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 .resource-concern-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

}
@media (max-width: 700px) {
 .shell:has(.resources) .sidebar { height: auto; min-height: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom)); }
 .shell:has(.resources) .nav { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: stretch; }
 .shell:has(.resources) .nav button { min-width: 0; width: 100%; max-width: 100%; padding-inline: .125rem; overflow-wrap: anywhere; white-space: normal; line-height: 1.35; text-align: center; }
 .resource-hero { grid-template-columns: minmax(0, 1fr); gap: 0; padding: 1.75rem 0 2rem; margin-bottom: 2rem; }
 .resource-hero h1 { font-size: 2.8rem; margin-top: .65rem; }
 .resource-hero-description { font-size: 1rem; line-height: 1.7; max-width: 27rem; }
 .resource-quicklinks { gap: .35rem 1.1rem; margin-top: 1.15rem; }
 .resource-quicklinks a { font-size: .8125rem; }
 .resource-section { margin-bottom: 2.65rem; }
 .resource-section-heading { align-items: flex-start; gap: .75rem; margin-bottom: 1.1rem; }
 .resource-section-heading > div { gap: .65rem; }
 .resource-section h2 { font-size: 1.2rem; }
 .resource-section-number { font-size: .6875rem; }
 .resource-section-heading > .resource-text-link { min-height: 1.6rem; font-size: .75rem; line-height: 1.6; }
 .resource-section-intro { font-size: .875rem; margin-bottom: 1.15rem; }
 .resource-card-row { display: grid; grid-auto-flow: column; grid-auto-columns: 77%; grid-template-columns: none; gap: .85rem; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x proximity; scroll-padding-inline: 0; overscroll-behavior-x: contain; padding: .4rem .35rem 1rem; margin: -.4rem -.35rem -1rem; scrollbar-width: thin; scrollbar-color: var(--line-main) transparent; }
 .resource-card-row > .resource-card { scroll-snap-align: start; }
 .resource-parameter-grid { grid-auto-columns: 60%; gap: .8rem; }

 .resource-parameter .resource-card-caption h3 { font-size: .9375rem; }
 .resource-card-caption { padding-top: .8rem; }
 .resource-card-caption h3 { font-size: 1rem; }


 .resource-search-grid { grid-auto-flow: initial; grid-auto-columns: initial; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem .8rem; overflow: visible; padding: 0; margin: 0; }
 .resource-faq-section { padding: 1.25rem; margin-bottom: 2rem; border-radius: 14px; }
 .resource-faq-header { gap: .8rem; margin-bottom: 1.3rem; align-items: flex-start; }
 .resource-faq-icon { width: 2.75rem; height: 2.75rem; flex-basis: 2.75rem; border-radius: 12px; }
 .resource-faq-header h2 { font-size: 1.25rem; }
 .resource-faq-header .resource-card-category { font-size: .5625rem; }
 .resource-faq-header p { font-size: .8125rem; }
 .resource-faq-search { grid-template-columns: minmax(0, 1fr); }
 .resource-faq-search button { justify-self: start; }
 .resource-faq-item > summary { font-size: .9375rem; padding-block: 1rem; gap: 1rem; }
 .resource-faq-answer { padding-right: 0; }
 .resource-guide-banner { gap: 1rem; padding-block: 1.4rem; margin-top: 2rem; }
 .resource-guide-icon { width: 2.75rem; height: 2.75rem; }
 .resource-guide-banner > div:not(.resource-guide-actions) { flex-basis: calc(100% - 4rem); }
 .resource-guide-actions { width: 100%; }
 .resource-guide-banner h2 { font-size: 1.0625rem; }
 .resource-topnav { margin: .6rem 0 1.5rem; }
 .resource-topnav-label { font-size: .5rem; letter-spacing: .1em; }
 .resource-page-head h1 { font-size: 2.3rem; }
 .resource-search { padding: 1rem; }
 .resource-search button { padding-inline: .85rem; }
 .resource-procedure > summary { padding: 1.1rem; gap: .8rem; grid-template-columns: 2rem minmax(0, 1fr) 1rem; }
 .resource-procedure-number { width: 2rem; height: 2rem; font-size: .6875rem; }
 .resource-procedure-body { padding-inline: 1.1rem; }
 .resource-procedure-body .primary { width: 100%; text-align: left; }
 .resource-source-links { flex-direction: column; align-items: flex-start; gap: .1rem; }
 .resource-article-header { grid-template-columns: minmax(0, 1fr); gap: 0; }
 .resource-detail-art { grid-row: 1; width: 120px; margin-bottom: 1.3rem; }
 .resource-article h1 { font-size: 2.3rem; }
 .resource-article-header .resource-copy { margin-bottom: 0; }
 .resource-detail-facts { gap: 1rem; }
 .resource-detail-facts > div:first-child { flex-basis: 100%; }
 .resource-read-more > summary { padding: 1.1rem; font-size: .9375rem; }
 .resource-article-body { padding: 1.3rem 1.1rem; }
 .resource-article-body h2 { font-size: 1.15rem; }
 .resource-copy p { font-size: .9375rem; }
 .resource-approved-note { padding: 1rem; }
 .resource-level-row { grid-template-columns: minmax(0, 1fr); gap: .4rem; }
 .resource-level-row > p { font-size: .8125rem; }
 .resource-document-panel, .resource-support { padding: 1.2rem; }
}
@media (max-width: 360px) {
 .resource-section-heading { flex-wrap: wrap; }
 .resource-section-heading > .resource-text-link { margin-left: 1.6rem; }
 .resource-parameter-grid { grid-auto-columns: 62%; }
 .resource-search-grid { grid-auto-columns: initial; grid-template-columns: repeat(2, minmax(0, 1fr)); }
 .resource-quicklinks { column-gap: .75rem; }
 .resource-topnav-label { display: none; }
 .resource-faq-section { padding: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
 .resources *, .resources *::before, .resources *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
 .resource-card:hover { transform: none; }
 .resource-card-row { scroll-snap-type: none; }
}
@media (forced-colors: active) {
 .resource-card, .resource-topic-art, .resource-parameter-art, .resource-detail-symbol { border: 1px solid ButtonText; }
 .resource-review-label { border-color: CanvasText; }
 .resource-disclosure-mark::before, .resource-disclosure-mark::after { background: ButtonText; }
}

.resource-visually-hidden:focus { position: static; width: auto; height: auto; padding: .5rem; margin: .75rem 0; overflow: visible; clip-path: none; white-space: normal; outline: 3px solid var(--focus); outline-offset: 3px; }

/* Decorative editorial illustrations. Titles carry the accessible name. */
.resource-art-image { display: block; width: 100%; height: 100%; object-fit: cover; }
/* Keep the original framing of the retained drinking-water illustrations.
   The new WebP collection uses 3:2; older SVG canvases have different bounds. */
.resource-parameter-art:has(> .resource-art-image[src$=".svg"]) { aspect-ratio: 16 / 9; }
.resource-detail-art:has(> .resource-art-image[src$=".svg"]) { aspect-ratio: 4 / 3; }
.resource-topic-art:has(> .resource-art-image[src$=".svg"]),
.resource-detail-topic-art:has(> .resource-art-image[src$=".svg"]) { aspect-ratio: 15 / 13; }
.resource-concern-card .resource-topic-art:has(> .resource-art-image[src$=".svg"]),
.resource-parameter-guide .resource-detail-art:has(> .resource-art-image[src$=".svg"]) { aspect-ratio: 16 / 9; }
.resource-topic-card .resource-card-caption { padding-top: .8rem; }
.resource-topic-card .resource-card-open { top: 1rem; }
.resource-topic-card .resource-card-caption h3 { margin-top: 0; }
.resource-guide-icon, .resource-faq-icon { overflow: hidden; }
.resource-guide-icon .resource-art-image, .resource-faq-icon .resource-art-image { object-fit: contain; }
.resource-card:hover .resource-art-image { opacity: .96; }
:root[data-theme=dark] :is(.resource-topic-art, .resource-parameter-art, .resource-detail-art) { box-shadow: inset 0 0 0 1px var(--atelier-border); }
@media (prefers-color-scheme: dark) {
 :root:not([data-theme]) :is(.resource-topic-art, .resource-parameter-art, .resource-detail-art) { box-shadow: inset 0 0 0 1px var(--atelier-border); }
}

/* Long-form parameter guides. Review status lives in data; one banner per page. */
.resource-review-banner { display: flex; align-items: baseline; gap: .6rem 1.2rem; flex-wrap: wrap; padding: .8rem 1rem; margin: 1rem 0; border: 1px solid var(--line-main); border-radius: 9px; background: var(--surface-subtle); color: var(--muted); font-size: .8125rem; line-height: 1.55; }
.resource-review-banner strong { color: var(--ink); font-weight: 600; }
.resource-review-banner p { margin: 0; flex: 1 1 28rem; }
.resource-parameter-guide { max-width: 72rem; }
.resource-parameter-guide .resource-article-header { grid-template-columns: minmax(0,1fr) 220px; gap: 2.5rem; align-items: center; margin-bottom: 2rem; }
.resource-parameter-guide .resource-detail-art { width: 220px; aspect-ratio: 3/2; }
.resource-guide-summary { max-width: 42rem; font-size: 1.125rem; line-height: 1.75; color: var(--muted); }
.resource-inline-citations { font: 500 .75rem/1.7 var(--font-sans, sans-serif); }
.resource-inline-citations a { color: var(--accent); text-underline-offset: .18em; }
.resource-at-glance { border: 1px solid var(--line-main); border-radius: 14px; background: var(--surface-subtle); padding: 1.5rem; margin-bottom: 2.4rem; }
.resource-at-glance h2 { margin: 0 0 1.3rem; font-size: 1.4rem; }
.resource-glance-facts { display: grid; grid-template-columns: 1.15fr .65fr 1.5fr 1.5fr; gap: 1.5rem; margin: 0; }
.resource-glance-facts dt { font: 600 .6875rem/1.5 var(--font-sans, sans-serif); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin-bottom: .5rem; }
.resource-glance-facts dd { margin: 0; font-size: .9375rem; line-height: 1.65; }
.resource-glance-facts dd p { margin: 0 0 .3rem; }
.resource-glance-facts dd > strong { display: block; margin-bottom: .35rem; font-weight: 550; }
.resource-own-result { display: grid; grid-template-columns: minmax(12rem,.8fr) minmax(0,1.8fr); gap: 1.5rem; margin-top: 1.5rem; padding-top: 1.4rem; border-top: 1px solid var(--line-main); }
.resource-own-result h3 { margin: 0 0 .35rem; font-size: 1.15rem; }
.resource-own-result p { margin: .3rem 0; font-size: .9375rem; line-height: 1.65; }
.resource-own-result .resource-own-state, .resource-own-result .resource-own-context { color: var(--muted); font-size: .8125rem; }
.resource-own-result .resource-own-value { font-size: 1.8rem; font-weight: 550; line-height: 1.3; }
.resource-own-value span { font-size: .9rem; font-weight: 400; }
.resource-own-result .resource-text-link { min-height: 2.75rem; margin-top: .35rem; }
.resource-guide-layout { display: grid; grid-template-columns: 11rem minmax(0,1fr); gap: 2.5rem; align-items: start; }
.resource-guide-contents { position: sticky; top: 6rem; display: grid; gap: .25rem; padding-right: 1rem; }
.resource-guide-contents > p { margin: 0 0 .6rem; font-size: .7rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.resource-guide-contents a { display: block; padding: .45rem .1rem; font-size: .8125rem; line-height: 1.55; text-decoration: none; color: var(--muted); }
.resource-guide-contents a:hover { color: var(--accent); text-decoration: underline; }
.resource-guide-chapters { min-width: 0; }
.resource-guide-section { border-top: 1px solid var(--line); scroll-margin-top: 6rem; }
.resource-guide-section > summary { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 4.5rem; padding: 1.2rem .2rem; }
.resource-guide-section h2 { margin: 0; font-size: 1.4rem; font-weight: 550; line-height: 1.35; }
.resource-guide-section-body { padding: 0 .2rem 1.5rem; }
.resource-guide-section-body p, .resource-guide-section-body li { font-size: 1rem; line-height: 1.85; }
.resource-guide-section-body p { margin: .6rem 0 1rem; }
.resource-guide-section-body h3 { font-size: 1.1rem; font-weight: 550; margin: 1.5rem 0 .5rem; }
.resource-guide-section-body ul { padding-left: 1.3rem; margin-block: .6rem 1.2rem; }
.resource-guide-section-body li { margin-bottom: .65rem; padding-left: .2rem; }
.resource-guide-section-body .resource-approved-note { margin-block: 1.3rem; }
.resource-guide-section-body .resource-level-row p { font-size: .9375rem; margin: 0; }
.resource-guide-section-body .resource-level-row { grid-template-columns: 5.5rem minmax(0,1fr); }
.resource-guide-callout { border-left: 3px solid var(--accent); padding: .9rem 1.1rem; margin: 1.2rem 0; background: var(--surface-subtle); border-radius: 0 8px 8px 0; }
.resource-guide-callout h3 { margin: 0 0 .3rem; }
.resource-guide-callout p { margin: .3rem 0; }
.resource-guide-warning { border-color: var(--attention-line); background: var(--note-bg); color: var(--note-ink); }
.resource-guideline-table { max-width: 100%; margin: 1.5rem 0; }
.resource-guideline-table table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: .875rem; line-height: 1.6; }
.resource-guideline-table caption { text-align: left; font-size: .75rem; color: var(--muted); padding-bottom: .65rem; }
.resource-guideline-table th, .resource-guideline-table td { text-align: left; vertical-align: top; padding: .8rem; border: 1px solid var(--line-main); overflow-wrap: anywhere; }
.resource-guideline-table th { background: var(--surface-subtle); font-weight: 550; }
.resource-guideline-table th:nth-child(1) { width: 18%; }
.resource-guideline-table th:nth-child(2) { width: 25%; }
.resource-guideline-table small, .resource-guide-sources small { display: block; margin-top: .5rem; color: var(--muted); font-size: .7rem; }
.resource-guide-related { list-style: none; padding-left: 0 !important; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem; }
.resource-guide-related li { border: 1px solid var(--line); border-radius: 9px; padding: .9rem; margin: 0; }
.resource-guide-related a { font-weight: 550; text-underline-offset: .2em; }
.resource-guide-related p { font-size: .875rem; margin: .4rem 0; }
.resource-guide-sources { border-top: 1px solid var(--line); margin-top: 1rem; padding-top: 1.5rem; scroll-margin-top: 6rem; }
.resource-guide-sources h2 { font-size: 1.3rem; }
.resource-guide-sources ul { padding-left: 1.1rem; }
.resource-guide-sources li { padding: 0 0 .9rem .2rem; font-size: .8125rem; line-height: 1.7; }
.resource-guide-sources a { text-underline-offset: .2em; }
.resource-unpublished { margin: 1.5rem 0; }
@media (max-width: 1000px) {
 .resource-glance-facts { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .resource-guide-layout { grid-template-columns: minmax(0,1fr); gap: 0; }
 .resource-guide-contents { display: none; }
}
@media (max-width: 700px) {
 .resource-review-banner { font-size: .75rem; gap: .25rem; }
 .resource-review-banner p { flex-basis: 100%; }
 .resource-parameter-guide .resource-article-header { grid-template-columns: minmax(0,1fr) 96px; gap: .8rem; align-items: start; }
 .resource-parameter-guide .resource-article-header > div:first-child { display: contents; }
 .resource-parameter-guide .resource-article-header .resource-eyebrow { grid-column: 1; grid-row: 1; margin-bottom: 0; }
 .resource-parameter-guide .resource-article-header h1 { grid-column: 1; grid-row: 2; margin-block: 0; }
 .resource-parameter-guide .resource-article-header .resource-guide-summary { grid-column: 1/-1; grid-row: 3; }
 .resource-parameter-guide .resource-detail-art { width: 96px; grid-column: 2; grid-row: 1/3; margin: .4rem 0 0; }
 .resource-parameter-guide h1 { font-size: 2.2rem; }
 .resource-guide-summary { font-size: 1rem; }
 .resource-at-glance { padding: 1rem; }
 .resource-glance-facts { gap: 1.3rem .9rem; }
 .resource-glance-facts dd { font-size: .875rem; }
 .resource-glance-facts > div:nth-child(n+3) { grid-column: 1/-1; }
 .resource-own-result { grid-template-columns: minmax(0,1fr); gap: .7rem; }
 .resource-guide-section h2 { font-size: 1.2rem; }
 .resource-guide-section > summary { min-height: 4rem; }
 .resource-guide-section-body p, .resource-guide-section-body li { font-size: .9375rem; line-height: 1.8; }
 .resource-guide-related { grid-template-columns: minmax(0,1fr); }
 .resource-guideline-table th, .resource-guideline-table td { padding: .55rem .4rem; font-size: .8125rem; }
 .resource-guide-section-body .resource-level-row { grid-template-columns: minmax(0,1fr); gap: .4rem; }
}

/* Printed swatches are the source image pixels; theme colors never tint them. */
.resource-levels-heading h2 { margin-bottom: .7rem; }
.resource-printed-chapter { padding: 1.4rem; }
.resource-printed-chapter .resource-printed-levels { margin: 0; }
.resource-level-intro { max-width: 43rem; }
.resource-level-intro > p { margin: 0; font-size: 1rem; line-height: 1.75; color: var(--ink); }
.resource-level-note, .resource-chart-mismatch { padding: 1rem 1.15rem; margin: 1.4rem 0; border-left: 3px solid var(--attention-line); border-radius: 0 var(--radius-small, 8px) var(--radius-small, 8px) 0; background: var(--note-bg); color: var(--note-ink); }
.resource-level-note > p, .resource-chart-mismatch { font-size: .9375rem; line-height: 1.7; }
.resource-level-note > p { margin: .35rem 0; }
.resource-level-note > summary { display: flex; align-items: center; gap: .65rem; min-height: 1.75rem; font-size: .875rem; font-weight: 550; cursor: pointer; }
.resource-level-note > summary > span:first-child { min-width: 0; overflow-wrap: anywhere; }
.resource-level-note > summary::after { content: "+"; flex-shrink: 0; margin-left: auto; font: 400 1.25rem/1 var(--font-sans, sans-serif); }
.resource-level-note[open] > summary::after { content: "−"; }
.resource-source-checked-notice { margin: 0 0 1.5rem; padding: 1rem 1.15rem; border-left: 3px solid var(--attention-line); border-radius: 0 var(--radius-small, 8px) var(--radius-small, 8px) 0; background: var(--note-bg); color: var(--note-ink); }
.resource-source-checked-notice p { margin: 0; font-size: .875rem; line-height: 1.7; }
.resource-level-note > summary .resource-draft-marker { margin-right: .6rem; }
.resource-level-note[open] > summary { margin-bottom: .75rem; }
.resource-level-note .resource-level-citations, .resource-level-note .resource-level-citations a { color: inherit; }
.resource-interpreted-levels { border: 0; border-radius: 0; margin-top: 1.6rem; overflow: visible; }
.resource-level-row.resource-interpreted-level { grid-template-columns: minmax(8.5rem, .42fr) minmax(0, 1fr); align-items: start; gap: 1.5rem; padding: 1.6rem .1rem; border-top: 1px solid var(--line); }
.resource-interpreted-level:last-child { border-bottom: 1px solid var(--line); }
.resource-interpreted-level.is-your-result { border-color: var(--accent); background: var(--atelier-selected); box-shadow: inset 3px 0 var(--accent); padding-inline: 1rem; border-radius: var(--radius-small, 8px); }
.resource-level-fact { display: flex; flex-wrap: wrap; align-items: flex-start; gap: .8rem; min-width: 0; }
.resource-level-swatch { flex: 0 0 3rem; width: 3rem; height: 3rem; margin-top: .15rem; object-fit: fill; border-radius: 3px; box-shadow: 0 0 0 1px var(--line-main); filter: none; opacity: 1; }
.resource-interpreted-level .resource-level-label { display: block; font-size: 1.5rem; line-height: 1.25; font-weight: 550; letter-spacing: -.025em; }
.resource-level-unit { display: block; margin-top: .25rem; color: var(--muted); font-size: .6875rem; line-height: 1.5; }
.resource-level-copy { min-width: 0; }
.resource-level-copy:empty { display: none; }
.resource-level-title { display: flex; align-items: baseline; flex-wrap: wrap; gap: .5rem .7rem; margin: 0 0 .6rem; }
.resource-level-title h3 { display: flex; align-items: center; gap: .5rem; margin: 0; font: 550 1.0625rem/1.5 var(--font-sans, sans-serif); color: var(--ink); }
.resource-level-title h3 svg, .resource-your-result svg { width: 1.1rem; height: 1.1rem; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.resource-draft-marker { display: inline-block; width: fit-content; vertical-align: middle; padding: 0; color: var(--muted); font: 500 .6875rem/1.5 var(--font-sans, sans-serif); }
.resource-interpreted-level .resource-level-meaning, .resource-level-next { margin: 0; font-size: .9375rem; line-height: 1.75; }
.resource-interpreted-level .resource-level-next { margin-top: .8rem; }
.resource-level-next > strong { display: block; font-weight: 550; font-size: .8125rem; margin-bottom: .15rem; }
.resource-level-citations { display: flex; align-items: baseline; flex-wrap: wrap; gap: .25rem .5rem; margin-top: .7rem; font-size: .75rem; line-height: 1.75; color: var(--muted); }
.resource-level-citations > span:first-child { font-weight: 550; }
.resource-level-citations a { color: var(--accent); text-underline-offset: .2em; }
.resource-your-result { display: flex; align-items: center; gap: .2rem; margin-top: .55rem; color: var(--accent); font-size: .6875rem; font-weight: 650; line-height: 1.5; }
.resource-your-result svg { width: .9rem; height: .9rem; }
@media (max-width: 700px) {
 .resource-level-row.resource-interpreted-level { grid-template-columns: minmax(0, 1fr); gap: 1rem; padding-block: 1.4rem; }
 .resource-level-fact { align-items: center; }
 .resource-interpreted-level .resource-level-label { font-size: 1.6rem; }
 .resource-level-fact > div { display: flex; align-items: baseline; flex-wrap: wrap; gap: .25rem .6rem; }
 .resource-level-unit { margin-top: 0; }
 .resource-your-result { flex-basis: 100%; margin-top: .2rem; }
 .resource-level-intro > p { font-size: .9375rem; }
 .resource-level-title h3 { font-size: 1rem; }
 .resource-level-note { padding: .85rem 1rem; }
}
@media (forced-colors: active) {
 .resource-level-swatch { forced-color-adjust: none; }
 .resource-interpreted-level.is-your-result { outline: 2px solid Highlight; box-shadow: none; }
 .resource-draft-marker { border-color: CanvasText; }
}

/* Compact section citations and shared kit facts for the full parameter guides. */
.resource-guide-section-body .resource-section-sources, .resource-section-sources { margin: 1.2rem 0 .2rem; font: 400 .75rem/1.8 var(--font-sans, sans-serif); color: var(--muted); }
.resource-section-sources > span { font-weight: 650; margin-right: .35rem; }
.resource-section-sources a { color: var(--accent); text-underline-offset: .18em; }
.resource-glance-timing { display: grid; grid-template-columns: minmax(7rem,.65fr) minmax(0,3fr); gap: 1rem 1.5rem; margin: 1.25rem 0 .3rem; padding-top: 1.1rem; border-top: 1px solid var(--line); }
.resource-glance-timing dt { font: 600 .6875rem/1.5 var(--font-sans,sans-serif); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin-bottom: .4rem; }
.resource-glance-timing dd { margin: 0; font-size: .875rem; line-height: 1.65; }
.resource-parameter-guide .resource-interpreted-level { grid-template-columns: minmax(7rem,.6fr) minmax(0,2.5fr); }
@media (max-width:700px) { .resource-glance-timing { grid-template-columns: minmax(0,1fr); gap: .9rem; } .resource-parameter-guide .resource-interpreted-level { grid-template-columns: minmax(0,1fr); } }

.resource-source-references { display: inline-flex; flex-wrap: wrap; gap: .25rem; font-size: .6875rem; line-height: 1.6; }
.resource-source-references a { color: var(--muted); text-underline-offset: .2em; }
.resource-guide-section > summary > .resource-draft-marker { margin-left: auto; margin-right: .6rem; }
