/* The Knowledge Centre and study pages (Phase 6b; Ana 2026-10-27 §3-§11, §14-§15). Replaces knowledge.css (the 5b slot).
   The card link (.sv-nf-card) is shared with the 404 page (Ana 2026-10-23 §4.2). Tokens only; no new colours. */
.sv-kc { padding: 32px var(--pg) 96px; }
.sv-kc-read { max-width: 1100px; }
.sv-kc-question .sv-kc-body, .sv-kc-guide .sv-kc-body, .sv-kc-term .sv-kc-body, .sv-kc-study .sv-kc-body { max-width: 720px; }
.sv-kc .sv-eyebrow { margin: 0; font-size: 13px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--wp--preset--color--ink-600); }
.sv-kc-title { max-width: 760px; margin: 14px 0 0; font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: clamp(28px, 3.6vw, 52px);
	line-height: 1.04; letter-spacing: -.025em; text-wrap: pretty; color: var(--wp--preset--color--ink-900); }
.sv-kc-lede { max-width: 620px; margin: 16px 0 0; font-size: 17px; line-height: 1.6; color: var(--wp--preset--color--ink-700); }
.sv-kc-question .sv-kc-lede, .sv-kc-term .sv-kc-lede { font-size: 19px; line-height: 1.55; color: var(--wp--preset--color--ink-900); }
.sv-kc-counts { margin: 12px 0 0; font-family: var(--wp--preset--font-family--mono, monospace); font-size: 13px; color: var(--wp--preset--color--ink-600); }
.sv-kc h2 { margin: 40px 0 0; font-size: 24px; color: var(--wp--preset--color--ink-900); scroll-margin-top: 96px; }
.sv-kc h3 { margin: 28px 0 0; font-size: 18px; scroll-margin-top: 96px; }
.sv-kc-body { margin-top: 24px; font-size: 17px; line-height: 1.65; color: var(--wp--preset--color--ink-700); }
.sv-kc-body strong { color: var(--wp--preset--color--ink-900); }
.sv-kc-body a, .sv-kc-related a, .sv-kc-src a, .sv-kc-refs a { color: var(--wp--preset--color--ink-900); text-decoration: underline; }
.sv-kc-table { overflow-x: auto; margin: 20px 0; }
.sv-kc-table table { border-collapse: collapse; min-width: 100%; font-size: 15px; }
.sv-kc-table th, .sv-kc-table td { padding: 8px 12px; border-bottom: 1px solid var(--sv-stroke-hair, rgba(12, 26, 42, .12)); text-align: left; }
/* Decision 223 (Task 16f): the original hyperbaric comparison. Its two product images float as in the original (stacked at phone width). */
.sv-kc-body:has(.sv-kc-img) { display: flow-root; }
.sv-kc-img { display: block; max-width: 100%; height: auto; margin: 8px auto 16px; }
.sv-kc-img-r + ul { display: flow-root; }
@media (min-width: 600px) {
	.sv-kc-img-r { float: right; max-width: 45%; margin: 4px 0 16px 24px; }
	.sv-kc-img-l { float: left; max-width: 45%; margin: 4px 24px 16px 0; }
}
/* Its dashboard (decision 231: the site's look, not the original's): glass cards (.sv-glass, as product.css), the KC table
   (.sv-kc-table), chip buttons (.sv-kc-chip) for the Pros/Cons toggle, theme tokens only. Pro and con cells are tinted from the
   primary and ink tokens; the hidden "(pro)"/"(con)" words carry the same meaning to screen readers. */
.sv-kc-dash { margin: 48px 0 0; }
.sv-kc .sv-kc-dash > h2 { margin: 0; }
.sv-kc-dash-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); gap: 24px; margin-top: 24px; }
.sv-kc-dash-panel { min-width: 0; padding: 24px; }
.sv-kc-dash-wide { grid-column: 1 / -1; }
.sv-kc-dash-grid + .sv-kc-dash-panel { margin-top: 24px; }
.sv-kc .sv-kc-dash-title { margin: 0 0 16px; font-size: 18px; color: var(--wp--preset--color--ink-900); }
.sv-kc-dash-chart { position: relative; height: 300px; }
.sv-kc-dash-note { margin: 16px 0 0; font-size: 14px; line-height: 1.5; color: var(--wp--preset--color--ink-700); }
.sv-kc-dash-note strong { color: var(--wp--preset--color--ink-900); }
.sv-kc-dash-toggle { display: flex; gap: 8px; margin: 0 0 16px; }
.sv-kc-dash-toggle[hidden] { display: none; }
.sv-kc-dash-btn { font-family: inherit; cursor: pointer; }
.sv-kc-dash-btn[aria-pressed="true"] { border: 1.5px solid var(--wp--preset--color--ink-900); background: var(--wp--preset--color--white); color: var(--wp--preset--color--ink-900); }
.sv-kc-dash .sv-kc-table { position: relative; margin: 0; }   /* holds the hidden "(pro)"/"(con)" spans inside the scroller */
.sv-kc-dash .sv-kc-table table { min-width: 560px; }
.sv-kc-dash .sv-kc-table tbody th { font-weight: 600; color: var(--wp--preset--color--ink-900); }
.sv-kc-dash-pro { font-weight: 600; color: var(--wp--preset--color--teal-aa); background: color-mix(in srgb, var(--wp--preset--color--primary) 14%, transparent); }
.sv-kc-dash-con { color: var(--wp--preset--color--ink-900); background: color-mix(in srgb, var(--wp--preset--color--ink-600) 9%, transparent); }
@media (max-width: 480px) { .sv-kc-dash-panel { padding: 18px 14px; } }
/* Breadcrumb (product.css look): <= 720 only the parent crumb shows, the rest stay for screen readers. */
.sv-kc .sv-crumbs ol { display: flex; flex-wrap: wrap; margin: 0 0 20px; padding: 0; list-style: none; font-family: var(--wp--preset--font-family--mono, monospace);
	font-size: 12px; text-transform: uppercase; color: var(--wp--preset--color--ink-600); }
.sv-kc .sv-crumbs a { color: inherit; }
@media (max-width: 720px) {
	.sv-kc { padding-top: 24px; padding-bottom: 64px; }
	.sv-kc .sv-crumbs li:not(.sv-crumbs-parent) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.sv-kc .sv-crumbs-parent a { display: inline-flex; align-items: center; min-height: 44px; }
	.sv-kc .sv-crumbs-parent > span[aria-hidden] { display: none; }
	.sv-kc .sv-crumbs-parent a::before { content: "\2039\00a0"; }
	/* Ana 29 Oct F6 (B2 failed at 360 x 740): on answers and terms the eyebrow repeats the parent crumb word for word; it goes. */
	.sv-kc-question .sv-kc-head .sv-eyebrow, .sv-kc-term .sv-kc-head .sv-eyebrow { display: none; }
}
/* The disclaimer note (Ana §3): quiet, not a warning. */
/* Chris decision 232: the site's glass panel (base.css .sv-glass), no accent stripe. */
.sv-kc-disc { max-width: 720px; margin: 20px 0 0; padding: 18px 22px; border: 1px solid rgba(255, 255, 255, .85); border-radius: 20px;
	background: rgba(255, 255, 255, .42); -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%);
	font-size: 15px; line-height: 1.55; color: var(--wp--preset--color--ink-700); }
.sv-kc-disc p { margin: 0; }
.sv-kc-disc-short { margin-top: 48px; }
.sv-kc-s1 { max-width: 720px; margin: 16px 0 0; font-size: 15px; color: var(--wp--preset--color--ink-700); }
.sv-kc-tag { display: inline-block; margin-left: 8px; padding: 2px 10px; border-radius: 999px; background: rgba(255, 255, 255, .62); font-size: 13px; color: var(--wp--preset--color--ink-900); }
/* Cards (shared with the 404): one link per card, glass, title + line + arrow. */
.sv-kc-cards { display: grid; gap: 12px; margin: 20px 0 0; padding: 0; list-style: none; }
.sv-nf-card { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 16px; min-height: 72px; padding: 18px 20px; border-radius: 20px;
	text-decoration: none; color: var(--wp--preset--color--ink-900); }
.sv-nf-card-title { font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: 18px; letter-spacing: -.01em; }
.sv-nf-card-line { grid-column: 1; font-size: 15px; line-height: 1.45; color: var(--wp--preset--color--ink-700); }
.sv-nf-arrow { grid-column: 2; grid-row: 1 / span 2; font-size: 20px; color: var(--wp--preset--color--ink-700); transition: transform var(--dur-fast, 180ms); }
@media (hover: hover) { .sv-nf-card:hover { background: rgba(255, 255, 255, .62); } .sv-nf-card:hover .sv-nf-arrow { transform: translateX(3px); } }
@media (prefers-reduced-motion: reduce) { .sv-nf-arrow { transition: none; } .sv-nf-card:hover .sv-nf-arrow { transform: none; } }
@media (min-width: 481px) { .sv-kc-topics, .sv-kc-groups { grid-template-columns: 1fr 1fr; } .sv-kc-studies { grid-template-columns: 1fr 1fr; } }
@media (min-width: 721px) { .sv-kc-guides { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1101px) { .sv-kc-studies { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
/* Lists of questions and terms (mode P): the row is the link. */
.sv-kc-list { margin: 12px 0 0; padding: 0; list-style: none; max-width: 760px; }
.sv-kc-list li { border-bottom: 1px solid var(--sv-stroke-hair, rgba(12, 26, 42, .12)); scroll-margin-top: 96px; }
.sv-kc-list a { display: block; padding: 18px 0; text-decoration: none; }
.sv-kc-list-q { display: block; font-size: 19px; line-height: 1.4; color: var(--wp--preset--color--ink-900); }
.sv-kc-list-short { display: block; margin-top: 4px; font-size: 16px; line-height: 1.55; color: var(--wp--preset--color--ink-700); }
.sv-kc-chips ul, .sv-kc-chips-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 0; padding: 0; list-style: none; }
.sv-kc-chips-label { margin: 24px 0 0; font-size: 13px; color: var(--wp--preset--color--ink-600); }
.sv-kc-chip { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border: 1px solid var(--sv-stroke-hair, rgba(12, 26, 42, .12)); border-radius: 999px;
	background: rgba(255, 255, 255, .45); font-size: 15px; color: var(--wp--preset--color--ink-900); text-decoration: none; }
.sv-kc-related { margin: 8px 0 0; padding-left: 20px; }
.sv-kc-related a { display: inline-flex; min-height: 44px; align-items: center; font-size: 17px; }
.sv-kc-src ol, .sv-kc-refs { margin: 8px 0 0; padding-left: 20px; font-size: 15px; color: var(--wp--preset--color--ink-700); overflow-wrap: anywhere; }
.sv-kc-refs li { margin-top: 12px; }
.sv-kc-refs a { font-size: 17px; line-height: 1.45; }
.sv-kc-ref-meta { display: block; font-size: 15px; color: var(--wp--preset--color--ink-600); }
.sv-kc-aka { margin: 8px 0 0; font-size: 14px; color: var(--wp--preset--color--ink-600); }
.sv-kc-rel { max-width: 720px; margin-top: 24px; padding: 18px 22px; border: 1px solid rgba(255, 255, 255, .85); border-radius: 20px; background: rgba(255, 255, 255, .42); -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%); font-size: 16px; color: var(--wp--preset--color--ink-700); }
.sv-kc-az { columns: 1; margin: 12px 0 0; padding: 0; list-style: none; }
.sv-kc-az a { display: inline-flex; min-height: 44px; align-items: center; color: var(--wp--preset--color--ink-900); }
@media (min-width: 481px) { .sv-kc-az { columns: 2; } }
@media (min-width: 1101px) { .sv-kc-az { columns: 3; } }
/* Contents (guides, legal; Ana 29 Oct F4, F5): a <details>, open as served; toc.js closes it at 720 and narrower. From 1101 a sticky
   column beside the text (.sv-doc). The label reads as the eyebrow, never louder than the headings it lists. */
.sv-toc { margin-top: 24px; }
.sv-toc summary { min-height: 44px; padding: 10px 0; cursor: pointer; }
.sv-toc summary h2 { display: inline; }
.sv-toc .sv-toc-h { margin: 0; font-size: 13px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--wp--preset--color--ink-600); }
.sv-toc ol { margin: 8px 0 0; padding-left: 20px; }
.sv-toc a { display: inline-flex; min-height: 44px; align-items: center; color: var(--wp--preset--color--ink-900); }
@media (min-width: 1101px) {
	/* Ana 29 Oct F4: the contents column (only where the contents are printed); the legal head and "Who we are" keep the 720 reading width. */
	.sv-doc:has(> .sv-toc) { display: grid; grid-template-columns: 240px minmax(0, 720px); gap: 48px; align-items: start; }
	.sv-doc > .sv-toc { grid-column: 1; grid-row: 1 / span 20; position: sticky; top: 96px; max-height: calc(100vh - 120px); overflow: auto; margin-top: 24px; }
	.sv-doc > :not(.sv-toc) { grid-column: 2; }
	.sv-toc summary { pointer-events: none; list-style: none; }
	.sv-toc summary::-webkit-details-marker { display: none; }
	.sv-legal .sv-legal-read { max-width: 1008px; }   /* beats legal.css (loaded after kc.css) */
	.sv-legal-head, .sv-legal-who { box-sizing: border-box; max-width: 720px; }
}
/* The first-aid panel (Ana §7): calm, bordered, near the top; no red, no amber, no icon, no motion. */
.sv-kc-firstaid { max-width: 720px; margin: 24px 0 0; padding: 22px 24px; border: 1px solid var(--wp--preset--color--ink-600); border-radius: 16px; background: rgba(255, 255, 255, .82); color: var(--wp--preset--color--ink-900); }
.sv-kc-firstaid h2 { margin: 0; font-size: 22px; }
.sv-kc-fa-lead { margin: 12px 0 0; font-size: 18px; line-height: 1.55; }
.sv-kc-firstaid ol { margin: 12px 0 0; padding-left: 24px; font-size: 17px; line-height: 1.6; }
.sv-kc-fa-help { margin: 16px 0 0; padding-top: 16px; border-top: 1px solid var(--sv-stroke-hair, rgba(12, 26, 42, .12)); font-size: 17px; }
.sv-kc-firstaid h3 { margin: 20px 0 0; font-size: 18px; }
/* Ana 29 Oct §7 R1: on the first-aid answer the lede follows the panel. */
.sv-kc-firstaid + .sv-kc-lede { margin-top: 24px; }
@media (max-width: 480px) { .sv-kc-firstaid { padding: 18px; } }
/* Phase 6b Task 17 fix round 1: stand-alone links ("All studies", "All questions in ...", a source) are 44px targets at 390. */
.sv-kc-more a, .sv-kc-src li a, .sv-kc-refs li a { display: inline-flex; align-items: center; min-height: 44px; }
