/* ===== Canonical brand tokens (unchanged) ===== */
:root {
  --font-heading: 'Plus Jakarta Sans', ui-sans-serif, system-ui, sans-serif;
  --font-body: 'Asap', ui-sans-serif, system-ui, sans-serif;
  --font-accent: 'Cousine', ui-monospace, Menlo, monospace;
  --colour-main-canvas: #19363A;
  --colour-inverse-lettering: #19363A;
  --colour-expanded-working-surface: #28464A;
  --colour-primary-text: #E3B380;
  --colour-primary-action: #E3B380;
  --colour-keyboard-focus: #E3B380;
  --colour-secondary-text: #CCDCD7;
  --colour-functional-boundary: #CCDCD7;
  --colour-reconciled-sample-indicator: #A7BA99;
  --colour-decorative-correspondence: #B76849;
  --radius-button: 6px; --radius-input: 6px; --radius-tool-shell: 12px; --radius-dialogue: 12px;
  --content-max: 1424px;
}
/* ===== Light editorial overrides (named) ===== */
:root {
  --paper: #F9F8F4;            /* considered off-white, faint violet cast */
  --paper-2: #F0F0EB;
  --lav: #E7EDEB;
  --violet: #19363A;
  --deep: #10292E;
  --ink: #1B2A2B;              /* body text: 12.9:1 on paper */
  --ink-2: #526461;            /* quiet text: 7.6:1 on paper, 6.4:1 on lavender */
  --rule: #93A4A0;             /* functional boundary on light: 4.9:1 */
  --rule-soft: rgba(25,54,58, .18);
  --lime-d: #426B55;           /* tickmark on light: 4.5:1 */
  --rose-d: #94513A;           /* review-note ink on light: 5.6:1 */
  --sulphur: #E3B380;
  --orchid: #CCDCD7;
  --rose: #B76849;
  --gutter: clamp(20px, 4vw, 56px);
  --ease: cubic-bezier(.2,.7,.2,1);
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scroll-padding-top: 96px; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 17px/27px var(--font-body); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: hidden; }
img, svg { display: block; max-width: 100%; }
a { color: var(--violet); text-underline-offset: 3px; text-decoration-thickness: 1px; }
button, input, select, textarea { font: inherit; color: inherit; }
::selection { background: var(--sulphur); color: var(--deep); }
:focus-visible { outline: 3px solid var(--deep); outline-offset: 3px; }
.dark :focus-visible, .site-footer :focus-visible, dialog :focus-visible { outline-color: var(--sulphur); }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 16px; top: -60px; z-index: 300; background: var(--sulphur); color: var(--violet); padding: 12px 16px; border-radius: var(--radius-button); font-weight: 700; }
.skip:focus { top: 12px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition-duration: 0s !important; animation: none !important; } }

/* ===== Layout ===== */
.wrap { max-width: var(--content-max); margin: 0 auto; padding: 0 var(--gutter); }
@media (min-width: 1280px) { .wrap { padding-right: calc(var(--gutter) + 40px); } }
.sec { position: relative; padding: clamp(72px, 9vw, 136px) 0; }
.paper-bg { background: var(--paper); }
.lav-bg { background: var(--lav); }
.soft-bg { background: var(--paper-2); }
.ledger { background-image: repeating-linear-gradient(180deg, transparent 0 31px, rgba(25,54,58,.07) 31px 32px); }
.dark { background: var(--violet); color: #fff; }
.deep { background: var(--deep); color: #fff; }
.dark h2, .dark h3, .deep h2, .deep h3 { color: #fff; }
.dark .dek, .deep .dek { color: var(--orchid); }
.sulphur-bg { background: var(--sulphur); color: var(--violet); }

/* ===== Type ===== */
h1, h2, h3, h4 { font-family: var(--font-heading); margin: 0; color: var(--violet); }
.display { font-weight: 800; font-size: clamp(42px, 5.5vw, 86px); line-height: .96; letter-spacing: -.05em; }
.h2 { font-weight: 800; font-size: clamp(31px, 3.7vw, 54px); line-height: 1.02; letter-spacing: -.04em; }
.h3 { font-weight: 700; font-size: clamp(22px, 2vw, 28px); line-height: 1.18; letter-spacing: -.02em; }
.dek { font: 400 clamp(19px, 1.6vw, 23px)/1.45 var(--font-body); color: var(--ink-2); margin: 0; max-width: 46ch; }
.body-l { font-size: 19px; line-height: 30px; }
.small { font-size: 15px; line-height: 23px; }
.t-cap { font-size: 14px; line-height: 21px; }
.t-col { font: 700 13px/18px var(--font-body); letter-spacing: .02em; }
.mono, .t-id { font-family: var(--font-accent); font-size: 13px; line-height: 19px; }
.t-total { font: 700 28px/36px var(--font-accent); letter-spacing: -.02em; }
.quiet { color: var(--ink-2); }
.measure { max-width: 64ch; }
.hl { background: linear-gradient(100deg, transparent 0 1%, var(--sulphur) 1% 99%, transparent 99%) no-repeat 0 78% / 0% 42%; transition: background-size 1.1s var(--ease) .25s; padding: 0 .04em; }
.is-ready .hl { background-size: 100% 42%; }
.strike-red { text-decoration: line-through; text-decoration-color: var(--rose); text-decoration-thickness: 3px; }

/* Folio: working-paper reference line */
.folio { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; font: 600 14px/20px var(--font-body); color: var(--ink-2); }
.folio .ref { font: 700 13px/18px var(--font-accent); color: var(--violet); background: var(--sulphur); padding: 4px 9px; border-radius: 3px; }
.folio::after { content: ""; flex: 1; height: 1px; background: var(--rule-soft); }
.dark .folio, .deep .folio { color: var(--orchid); }
.dark .folio::after, .deep .folio::after { background: rgba(25,54,58,.3); }

/* ===== Buttons & fields ===== */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 22px; border-radius: var(--radius-button); font: 700 15px/20px var(--font-body); text-decoration: none; cursor: pointer; border: 2px solid transparent; transition: transform .18s var(--ease), background-color .18s, border-color .18s, box-shadow .18s; white-space: nowrap; }
.btn svg { transition: transform .18s var(--ease); }
.btn:hover svg { transform: translateX(3px); }
.btn-primary { background: var(--sulphur); color: var(--violet); border-color: var(--violet); box-shadow: 4px 4px 0 var(--violet); }
.btn-primary:hover { transform: translate(-1px,-1px); box-shadow: 6px 6px 0 var(--violet); }
.btn-primary:active { transform: translate(2px,2px); box-shadow: 1px 1px 0 var(--violet); }
.btn-lg { min-height: 60px; padding: 0 30px; font-size: 17px; }
.btn-secondary { background: transparent; color: var(--violet); border-color: var(--violet); }
.btn-secondary:hover { background: var(--lav); }
.btn-ghost { background: #fff; color: var(--violet); border: 1px solid var(--rule); min-height: 42px; padding: 0 14px; font-weight: 600; }
.btn-ghost:hover { border-color: var(--violet); background: var(--paper-2); }
.btn-sm { min-height: 38px; padding: 0 12px; font-size: 14px; }
.btn[disabled] { opacity: .45; cursor: not-allowed; box-shadow: none; transform: none; }
.btn[aria-disabled="true"] { opacity: .55; box-shadow: none; }
.btn[aria-pressed="true"] { background: var(--sulphur); border-color: var(--violet); }
.dark .btn-primary, .deep .btn-primary, dialog .btn-primary { border-color: var(--sulphur); box-shadow: 4px 4px 0 var(--deep); }
.dark .btn-secondary, .deep .btn-secondary { color: #fff; border-color: var(--orchid); }
.dark .btn-secondary:hover, .deep .btn-secondary:hover { background: rgba(255,255,255,.08); }
.sulphur-bg .btn-primary { background: var(--violet); color: var(--sulphur); box-shadow: 4px 4px 0 var(--deep); border-color: var(--violet); }
.linkbtn { background: none; border: 0; padding: 0; color: var(--violet); font: 700 15px/20px var(--font-body); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; min-height: 32px; }
.arrow-link { display: inline-flex; align-items: center; gap: 8px; font: 700 15px/20px var(--font-body); color: var(--violet); text-decoration: none; border-bottom: 2px solid var(--sulphur); padding-bottom: 2px; }
.arrow-link svg { transition: transform .18s var(--ease); }
.arrow-link:hover svg { transform: translateX(4px); }
.field { display: grid; gap: 6px; align-content: start; }
.field label, .field .lbl, .lbl { font: 700 14px/20px var(--font-body); color: var(--violet); }
.input { min-height: 48px; width: 100%; padding: 10px 12px; border: 1px solid var(--rule); border-radius: var(--radius-input); background: #fff; color: var(--ink); transition: border-color .15s, box-shadow .15s; }
textarea.input { min-height: 116px; font: 13px/19px var(--font-accent); }
.input:focus { border-color: var(--violet); box-shadow: 0 0 0 3px rgba(255,242,102,.9); outline: none; }
.chk { display: flex; gap: 10px; align-items: flex-start; min-height: 32px; font-size: 15px; line-height: 22px; cursor: pointer; }
.chk input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--violet); flex: none; }
.chip { display: inline-flex; align-items: center; min-height: 26px; padding: 0 9px; font: 600 12.5px/18px var(--font-body); border: 1px solid var(--rule); color: var(--violet); background: #fff; border-radius: 3px; }
.demo-badge { display: inline-flex; align-items: center; gap: 6px; font: 700 12px/16px var(--font-accent); padding: 4px 8px; border: 1px solid currentColor; border-radius: 3px; color: var(--violet); }
.err { color: #94513A; font: 700 14px/20px var(--font-body); }
.ok { color: var(--lime-d); font: 700 14px/20px var(--font-body); }
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 640px) { .two { grid-template-columns: 1fr; } }
.stack { display: grid; gap: 18px; align-content: start; }

/* ===== Tickmark status semantics ===== */
.st { display: inline-flex; align-items: center; gap: 8px; font: 700 14px/19px var(--font-body); white-space: nowrap; }
.st::before { content: ""; width: 12px; height: 12px; border-radius: 50%; flex: none; }
.st-match::before { content: "✓"; width: auto; height: auto; border-radius: 0; font: 700 16px/1 var(--font-body); color: var(--lime-d); }
.st-review::before { background: var(--rose); border-radius: 1px; transform: rotate(45deg); width: 9px; height: 9px; }
.st-unmapped::before { border: 2px solid var(--violet); }
.st-na::before { border: 2px dashed var(--ink-2); }
.st-fail::before { content: "×"; width: auto; height: auto; border-radius: 0; font: 700 18px/1 var(--font-accent); color: #94513A; }
.dark .st-match::before, .deep .st-match::before, .shell .st-match::before { color: var(--colour-reconciled-sample-indicator); }
.dark .st-unmapped::before, .deep .st-unmapped::before, .shell .st-unmapped::before { border-color: #fff; }
.dark .st-na::before, .deep .st-na::before, .shell .st-na::before { border-color: var(--orchid); }
.dark .st-fail::before, .deep .st-fail::before { color: #E3B380; }

/* ===== Dateline + header ===== */
.dateline { background: var(--deep); color: var(--orchid); font: 400 12.5px/18px var(--font-accent); }
.dateline .wrap { display: flex; gap: 10px 28px; justify-content: space-between; flex-wrap: wrap; padding-top: 8px; padding-bottom: 8px; }
.dateline b { color: var(--sulphur); font-weight: 700; }
@media (max-width: 720px) { .dateline .hide-sm { display: none; } }
.site-header { position: sticky; top: 0; z-index: 60; background: rgba(252,251,255,.9); backdrop-filter: saturate(1.6) blur(12px); -webkit-backdrop-filter: saturate(1.6) blur(12px); border-bottom: 1px solid transparent; transition: border-color .2s, box-shadow .2s; }
.site-header.scrolled { border-bottom-color: var(--rule-soft); box-shadow: 0 10px 30px -24px rgba(36,0,150,.5); }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 76px; }
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.brand-word { font: 800 25px/26px var(--font-heading); letter-spacing: -.045em; color: var(--violet); display: block; }
.brand-desc { display: block; font: 500 12.5px/16px var(--font-body); color: var(--ink-2); margin-top: 3px; }
.nav { display: flex; align-items: center; gap: 2px; }
.nav a { position: relative; padding: 10px 12px; text-decoration: none; font: 600 15px/20px var(--font-body); color: var(--ink); }
.nav a::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 4px; height: 3px; background: var(--sulphur); transform: scaleX(0); transform-origin: left; transition: transform .2s var(--ease); }
.nav a:hover::after { transform: scaleX(1); }
.icon-btn { width: 46px; height: 46px; display: inline-grid; place-items: center; background: #fff; border: 1px solid var(--rule-soft); border-radius: var(--radius-button); cursor: pointer; color: var(--violet); transition: border-color .15s; }
.icon-btn:hover { border-color: var(--violet); }
.menu-btn { display: none; }
@media (max-width: 1200px) { .nav a.hide-md { display: none; } }
@media (max-width: 980px) {
  .nav { display: none; position: absolute; left: 0; right: 0; top: 76px; flex-direction: column; align-items: stretch; background: var(--paper); border-bottom: 1px solid var(--rule-soft); padding: 8px var(--gutter) 18px; box-shadow: 0 20px 30px -20px rgba(36,0,150,.4); }
  .nav.open { display: flex; } .nav a.hide-md { display: block; } .nav a { padding: 14px 0; border-bottom: 1px solid var(--rule-soft); } .nav a::after { display: none; }
  .menu-btn { display: inline-grid; } .header-cta { display: none; }
}
@media (max-width: 420px) { .brand-desc { display: none; } }

/* ===== Binder index tabs (desktop) ===== */
.tabs-rail { position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index: 55; display: none; flex-direction: column; align-items: flex-end; gap: 4px; pointer-events: none; }
.tabs-rail a { pointer-events: auto; }
@media (min-width: 1280px) { .tabs-rail { display: flex; } }
.tabs-rail a { --c: var(--lav); position: relative; display: flex; align-items: center; justify-content: flex-start; gap: 10px; width: 40px; height: 40px; padding-left: 13px; background: var(--c); color: var(--violet); text-decoration: none; font: 700 13px/1 var(--font-accent); border-radius: 8px 0 0 8px; box-shadow: -2px 2px 0 rgba(36,0,150,.12); transition: width .22s var(--ease); overflow: hidden; white-space: nowrap; }
.tabs-rail a span { font: 600 13px/1 var(--font-body); opacity: 0; transition: opacity .15s; }
.tabs-rail a:hover, .tabs-rail a:focus-visible, .tabs-rail a.active { width: 176px; }
.tabs-rail a:hover span, .tabs-rail a:focus-visible span, .tabs-rail a.active span { opacity: 1; }
.tabs-rail a.active { background: var(--violet); color: var(--sulphur); }

/* ===== Hero ===== */
.hero { position: relative; padding: clamp(40px, 6vw, 88px) 0 clamp(56px, 6vw, 96px); overflow: hidden; background:
  linear-gradient(90deg, transparent calc(var(--gutter) - 14px), rgba(233,107,191,.35) calc(var(--gutter) - 14px), rgba(233,107,191,.35) calc(var(--gutter) - 13px), transparent calc(var(--gutter) - 13px), transparent calc(var(--gutter) - 10px), rgba(233,107,191,.35) calc(var(--gutter) - 10px), rgba(233,107,191,.35) calc(var(--gutter) - 9px), transparent calc(var(--gutter) - 9px)),
  repeating-linear-gradient(180deg, transparent 0 39px, rgba(25,54,58,.075) 39px 40px),
  radial-gradient(1100px 600px at 90% 0%, rgba(25,54,58,.45), transparent 65%),
  var(--paper); }
.hero-grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
.hero-copy { display: grid; gap: 26px; align-content: start; }
.kicker { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 10px; font: 700 14px/20px var(--font-body); color: var(--violet); }
.kicker .dot { width: 8px; height: 8px; background: var(--rose); transform: rotate(45deg); }
.hero-ctas { display: flex; gap: 16px 22px; flex-wrap: wrap; align-items: center; }
.hero-proof { display: flex; flex-wrap: wrap; gap: 8px 22px; padding-top: 22px; border-top: 1px solid var(--rule-soft); }
.hero-proof span { display: inline-flex; gap: 8px; align-items: center; font: 600 14px/20px var(--font-body); color: var(--ink-2); }
.hero-proof span::before { content: "✓"; color: var(--lime-d); font-weight: 700; }
.fig { position: relative; margin: 0; }
.fig-img { position: relative; margin-right: calc(-1 * var(--gutter) - 40px); }
.fig-img img { width: 100%; height: auto; aspect-ratio: 3 / 2; border-radius: 4px 0 0 4px; }
.fig figcaption { display: flex; gap: 12px; align-items: baseline; margin-top: 14px; font-size: 14px; line-height: 21px; color: var(--ink-2); }
.fig figcaption b { font: 700 12.5px/18px var(--font-accent); color: var(--violet); white-space: nowrap; }
.pin { position: absolute; transform: translate(-50%, -50%); width: 34px; height: 34px; border-radius: 50%; border: 2px solid var(--violet); background: var(--sulphur); color: var(--violet); font: 700 14px/1 var(--font-accent); display: grid; place-items: center; cursor: pointer; box-shadow: 0 0 0 5px rgba(255,255,255,.75); transition: transform .18s var(--ease); z-index: 2; }
.pin:hover, .pin:focus-visible, .pin[aria-expanded="true"] { transform: translate(-50%, -50%) scale(1.12); background: var(--violet); color: var(--sulphur); }
.pin-note { position: absolute; z-index: 3; width: min(290px, 70vw); background: var(--deep); color: #fff; padding: 14px 16px; border-radius: 8px; font-size: 14.5px; line-height: 21px; box-shadow: 0 18px 40px -16px rgba(36,0,150,.7); opacity: 0; transform: translateY(6px); pointer-events: none; transition: opacity .18s, transform .18s var(--ease); }
.pin-note b { display: block; color: var(--sulphur); font: 700 12.5px/18px var(--font-accent); margin-bottom: 4px; }
.pin-note.show { opacity: 1; transform: none; pointer-events: auto; }
@media (max-width: 1024px) { .hero-grid { grid-template-columns: 1fr; } .fig-img { margin-right: calc(-1 * var(--gutter)); } }
@media (max-width: 1279px) { .fig-img { margin-right: calc(-1 * var(--gutter)); } }

/* ===== Memo header ===== */
.memo { border-top: 3px solid var(--violet); border-bottom: 1px solid var(--rule); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: #fff; }
.memo > div { padding: 22px 22px 26px; display: grid; gap: 8px; align-content: start; }
.memo > div + div { border-left: 1px solid var(--rule-soft); }
.memo dt { font: 700 12.5px/18px var(--font-accent); color: var(--violet); }
.memo dt::after { content: ""; display: inline-block; margin-left: 8px; width: 22px; height: 2px; background: var(--sulphur); vertical-align: middle; }
.memo dd { margin: 0; font-size: 16px; line-height: 25px; color: var(--ink); }
@media (max-width: 980px) { .memo { grid-template-columns: 1fr 1fr; } .memo > div:nth-child(3) { border-left: 0; } .memo > div:nth-child(n+3) { border-top: 1px solid var(--rule-soft); } }
@media (max-width: 560px) { .memo { grid-template-columns: 1fr; } .memo > div + div { border-left: 0; border-top: 1px solid var(--rule-soft); } }

/* ===== Contents index ===== */
.contents-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(28px, 5vw, 80px); }
.toc { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 40px; }
.toc li { break-inside: avoid; border-top: 1px solid var(--rule); }
.toc a { display: grid; grid-template-columns: 48px 1fr 24px; gap: 14px; align-items: start; padding: 16px 0 18px; text-decoration: none; color: var(--ink); }
.toc .r { font: 700 13px/22px var(--font-accent); color: var(--violet); }
.toc .tc { display: grid; gap: 2px; }
.toc .tt { font: 700 18px/24px var(--font-heading); color: var(--violet); letter-spacing: -.015em; }
.toc .td { font-size: 15px; line-height: 22px; color: var(--ink-2); }
.toc svg { margin-top: 4px; color: var(--violet); transition: transform .18s var(--ease); }
.toc a:hover .tt { text-decoration: underline; text-decoration-color: var(--sulphur); text-decoration-thickness: 4px; text-underline-offset: 2px; }
.toc a:hover svg { transform: translateX(4px); }
.toc .tab-swatch { display: inline-block; width: 10px; height: 10px; margin-right: 8px; border: 1px solid var(--violet); vertical-align: 0; }
@media (max-width: 980px) { .contents-grid { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .toc { columns: 1; } }

/* ===== Generic section header layouts ===== */
.sh-split { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(24px, 5vw, 80px); align-items: end; margin-bottom: clamp(36px, 5vw, 64px); }
.sh-split .aside { display: grid; gap: 14px; justify-items: start; }
@media (max-width: 980px) { .sh-split { grid-template-columns: 1fr; } }

/* ===== Tool shell / crosswalk ===== */
.shell { background: var(--deep); color: #fff; border-radius: var(--radius-tool-shell); position: relative; overflow: hidden; border: 1px solid rgba(25,54,58,.35); }
.shell-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; border-bottom: 1px solid rgba(25,54,58,.3); }
.shell-title { font: 700 15px/20px var(--font-body); color: var(--sulphur); }
.shell-meta { font: 400 12.5px/18px var(--font-accent); color: var(--orchid); }
.shell .demo-badge { color: var(--sulphur); }
.cw { width: 100%; border-collapse: collapse; table-layout: fixed; }
.cw col.c-ctx { width: 14.3%; } .cw col.c-cur { width: 42.85%; } .cw col.c-dst { width: 42.85%; }
.cw thead th { text-align: left; padding: 12px 14px; font: 700 13.5px/19px var(--font-body); color: var(--sulphur); border-bottom: 1px solid var(--orchid); vertical-align: bottom; }
.cw thead th span { display: block; font: 400 12px/16px var(--font-accent); color: var(--orchid); margin-top: 2px; }
.cw tbody td { padding: 0; border-bottom: 1px solid rgba(25,54,58,.22); vertical-align: top; height: 1px; }
.cw td.src-td > .src-btn, .cw td.dst-td > .cell { height: 100%; }
.cw .ctx { padding: 14px; font: 400 12.5px/19px var(--font-accent); color: var(--orchid); }
.cw .cell { min-height: 60px; padding: 12px 14px; display: grid; gap: 4px; align-content: start; }
.cw .src-btn { all: unset; box-sizing: border-box; display: grid; gap: 4px; align-content: start; width: 100%; min-height: 60px; padding: 12px 14px; cursor: pointer; border: 2px solid transparent; transition: border-color .15s, background-color .15s; }
.cw .src-btn:hover { background: rgba(255,255,255,.06); }
.cw .src-btn:focus-visible { outline: 3px solid var(--sulphur); outline-offset: -3px; }
.cw .fname { font: 700 13px/19px var(--font-accent); color: #fff; }
.cw .fval { font-size: 14.5px; line-height: 21px; color: var(--orchid); }
.cw .dst { border: 2px solid transparent; transition: border-color .15s, background-color .15s; }
.cw .dst.empty .fval { color: rgba(25,54,58,.82); font-style: italic; }
.cw .dst.empty { background-image: repeating-linear-gradient(135deg, rgba(25,54,58,.13) 0 6px, transparent 6px 12px); }
.cw tr.is-selected .src-btn, .cw tr.is-selected .dst { border-color: var(--sulphur); background-color: rgba(255,242,102,.09); }
.cw tr.decision-row td { padding: 0; border-bottom: 1px solid var(--orchid); }
.decision { padding: 16px 18px 18px; background: var(--colour-expanded-working-surface); display: grid; gap: 10px; border-left: 4px solid var(--sulphur); animation: drop .2s var(--ease); }
@keyframes drop { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.decision h4 { color: var(--sulphur); font: 700 16px/22px var(--font-body); }
.decision p { margin: 0; font-size: 15px; line-height: 23px; color: #fff; }
.decision .q { color: var(--orchid); }
.cw-foot { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: center; justify-content: space-between; padding: 12px 18px 16px; }
.legend { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.legend .st { color: #fff; font-weight: 600; font-size: 13px; }
@media (max-width: 720px) {
  .cw, .cw tbody, .cw tr, .cw td { display: block; width: 100%; }
  .cw thead, .cw colgroup { display: none; }
  .cw tr.map-row { border-bottom: 1px solid var(--orchid); }
  .cw tbody td { border-bottom: 0; height: auto; }
  .cw td.src-td > .src-btn, .cw td.dst-td > .cell { height: auto; }
  .cw .ctx { padding: 12px 14px 0; }
  .cw td.dst-td::before, .cw td.src-td::before { display: block; padding: 8px 14px 0; font: 700 12px/16px var(--font-body); color: var(--sulphur); }
  .cw td.src-td::before { content: "Current estate"; } .cw td.dst-td::before { content: "Required destination"; }
}
.xw-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.xw-grid .lead { display: grid; gap: 24px; position: sticky; top: 110px; }
.legend-box { border: 1px solid rgba(25,54,58,.4); padding: 18px; display: grid; gap: 12px; }
.legend-box h3 { font: 700 12.5px/18px var(--font-accent); color: var(--sulphur); }
.legend-box .row { display: grid; grid-template-columns: 150px 1fr; gap: 12px; font-size: 14.5px; line-height: 21px; color: #fff; }
.legend-box .row .st { color: #fff; }
@media (max-width: 1024px) { .xw-grid { grid-template-columns: 1fr; } .xw-grid .lead { position: static; } }
@media (max-width: 520px) { .legend-box .row { grid-template-columns: 1fr; gap: 2px; } }

/* ===== Working-paper tables (light) ===== */
.ws { width: 100%; border-collapse: collapse; background: #fff; }
.ws th, .ws td { text-align: left; padding: 13px 14px; border-bottom: 1px solid var(--rule-soft); vertical-align: top; }
.ws thead th { font: 700 13px/18px var(--font-body); letter-spacing: .02em; color: var(--violet); background: #fff; border-bottom: 2px solid var(--violet); }
.ws tbody tr:nth-child(even) td, .ws tbody tr:nth-child(even) th { background: rgba(237,228,255,.38); }
.ws .grp th { background: var(--lav) !important; font: 700 12.5px/18px var(--font-accent); color: var(--violet); border-bottom: 1px solid var(--rule); }
.ws-frame { border: 1px solid var(--rule); background: #fff; overflow-x: auto; box-shadow: 0 1px 0 rgba(36,0,150,.04), 0 24px 50px -36px rgba(36,0,150,.45); }
.ws td.empty-cell { background-image: repeating-linear-gradient(135deg, rgba(25,54,58,.14) 0 6px, transparent 6px 12px) !important; color: var(--ink-2); font-style: italic; }
.ws input.num { width: 78px; min-height: 40px; padding: 6px 8px; text-align: right; font-family: var(--font-accent); font-size: 14px; }
.ws select.input { min-height: 40px; padding: 6px 8px; min-width: 128px; }
#wtTable th[scope="row"] { min-width: 210px; }
#wtTable td, #wtTable th { padding-left: 10px; padding-right: 10px; }
.panel { background: #fff; border: 1px solid var(--rule); padding: clamp(18px, 2.2vw, 28px); }

/* Scope */
.scope-layout { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 4fr) minmax(0, 5fr); gap: clamp(18px, 2.4vw, 32px); align-items: start; }
@media (max-width: 1100px) { .scope-layout { grid-template-columns: 1fr 1fr; } .scope-layout .hier { grid-column: 1 / -1; } }
@media (max-width: 720px) { .scope-layout { grid-template-columns: 1fr; } }
.hier { display: grid; gap: 14px; }
.ctx-name { font: 700 13px/19px var(--font-accent); color: var(--violet); padding: 10px 12px; background: var(--sulphur); justify-self: start; }
.wf-options { display: flex; flex-wrap: wrap; gap: 8px; }
.wf-options label { position: relative; }
.wf-options input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.wf-options span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border: 1px solid var(--rule); background: #fff; font: 600 15px/20px var(--font-body); color: var(--violet); border-radius: 999px; cursor: pointer; transition: background-color .15s, border-color .15s; }
.wf-options span:hover { border-color: var(--violet); }
.wf-options input:checked + span { background: var(--violet); color: var(--sulphur); border-color: var(--violet); }
.wf-options input:focus-visible + span { outline: 3px solid var(--deep); outline-offset: 2px; }
.memo-sheet { background: #fff; border: 1px solid var(--rule); border-top: 6px solid var(--sulphur); padding: clamp(20px, 2.4vw, 30px); display: grid; gap: 18px; box-shadow: 0 30px 60px -40px rgba(36,0,150,.55); }
.memo-sheet .mh { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; padding-bottom: 12px; border-bottom: 1px solid var(--rule-soft); }
.revealed { border-left: 4px solid var(--sulphur); background: var(--paper-2); padding: 14px 16px; display: grid; gap: 8px; animation: drop .2s var(--ease); }
.revealed h4 { font: 700 15px/20px var(--font-body); color: var(--violet); }
.revealed ol, .revealed ul { margin: 0; padding-left: 20px; display: grid; gap: 6px; font-size: 15px; line-height: 22px; }
.excl-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.excl-list li { display: flex; justify-content: space-between; gap: 10px; align-items: center; padding: 8px 12px; border: 1px dashed var(--rule); background: var(--paper); font-size: 15px; }
.excl-list li span { text-decoration: line-through; text-decoration-color: var(--rose); text-decoration-thickness: 2px; }
.excl-list button { background: none; border: 0; color: var(--violet); cursor: pointer; font: 700 13px/18px var(--font-body); min-height: 32px; text-decoration: underline; }

/* X-Ray */
.xr-head { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(24px, 5vw, 72px); align-items: end; margin-bottom: 40px; }
@media (max-width: 980px) { .xr-head { grid-template-columns: 1fr; } }
.tick-legend { background: #fff; border: 1px solid var(--rule); padding: 18px 20px; display: grid; gap: 10px; }
.tick-legend h3 { font: 700 12.5px/18px var(--font-accent); color: var(--violet); }
.tick-legend .row { display: grid; grid-template-columns: 30px 1fr; gap: 8px; font-size: 14.5px; line-height: 21px; align-items: baseline; }
.tick-legend .row .st { font-size: 0; gap: 0; }
.xr-controls { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-bottom: 18px; }
.finding { display: grid; gap: 2px; padding: 4px 0 6px 12px; border-left: 3px solid var(--rose); margin: 4px 0; }
.finding b { font: 700 13px/18px var(--font-body); color: var(--rose-d); }
.finding span { font-size: 14.5px; line-height: 21px; }
.coverage { display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px; border: 1px solid var(--rule); border-top: 0; background: #fff; font-size: 15px; line-height: 23px; }
.dl-row { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 22px; }

/* Responsibility */
.matrix th[scope="row"] { font: 700 15.5px/22px var(--font-body); color: var(--violet); width: 24%; }
.matrix td { font-size: 15px; line-height: 22px; }
.matrix thead th { font: 800 19px/24px var(--font-heading); letter-spacing: -.02em; padding-top: 18px; padding-bottom: 14px; }
.matrix thead th:first-child { font: 700 13px/18px var(--font-body); letter-spacing: .02em; }
.fit { display: inline-block; font: 700 11.5px/16px var(--font-accent); padding: 2px 6px; margin-bottom: 6px; border: 1px solid var(--rule); color: var(--violet); }
.fit-yes { background: var(--sulphur); border-color: var(--violet); }
.fit-no { border-style: dashed; color: var(--ink-2); }
.matrix tr.owner-row th, .matrix tr.owner-row td { background: var(--violet) !important; color: #fff; border-top: 0; }
.matrix tr.owner-row th { color: var(--sulphur); }
.route-panel { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.route-panel .caps { padding: 22px; border-right: 1px solid rgba(25,54,58,.3); display: grid; gap: 4px; align-content: start; }
.route-panel .caps .chk { color: #fff; font-size: 14.5px; line-height: 21px; }
.route-panel .caps .chk input { accent-color: var(--sulphur); }
.route-panel .caps h4 { font: 700 12.5px/18px var(--font-accent); color: var(--orchid); margin: 12px 0 4px; }
.route-panel .caps h4:first-child { margin-top: 0; }
.route-cards { display: grid; grid-template-columns: 1fr; }
.route-card { padding: 20px 22px; border-bottom: 1px solid rgba(25,54,58,.25); display: grid; gap: 8px; align-content: start; }
.route-card:last-child { border-bottom: 0; }
.route-card h4 { font: 700 19px/24px var(--font-heading); color: #fff; display: flex; justify-content: space-between; gap: 10px; align-items: baseline; letter-spacing: -.015em; }
.route-card .pts { font: 700 26px/30px var(--font-accent); color: var(--sulphur); }
.route-card .bar { height: 6px; background: rgba(25,54,58,.2); position: relative; overflow: hidden; }
.route-card .bar i { position: absolute; inset: 0 auto 0 0; background: var(--sulphur); transition: width .25s var(--ease); }
.route-card ul { margin: 0; padding-left: 18px; display: grid; gap: 3px; font-size: 14px; line-height: 20px; color: #fff; }
.route-card .blk { color: #E3B380; font-weight: 700; font-size: 14px; line-height: 20px; }
@media (max-width: 900px) { .route-panel { grid-template-columns: 1fr; } .route-panel .caps { border-right: 0; border-bottom: 1px solid rgba(25,54,58,.3); } }

/* Requirements: redline */
.req-layout { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
@media (max-width: 1100px) { .req-layout { grid-template-columns: 1fr; } }
.redline { position: relative; background: #fff; border: 1px solid var(--rule); padding: 28px 28px 24px; box-shadow: 0 40px 70px -50px rgba(36,0,150,.6); }
.redline .rh { display: flex; justify-content: space-between; font: 700 12.5px/18px var(--font-accent); color: var(--violet); padding-bottom: 14px; border-bottom: 1px solid var(--rule-soft); margin-bottom: 18px; }
.redline .del { color: var(--rose-d); text-decoration: line-through; text-decoration-thickness: 2px; font-size: 18px; line-height: 28px; }
.redline .ins { display: block; margin-top: 10px; font: 600 20px/31px var(--font-body); color: var(--ink); }
.redline .ins mark { background: linear-gradient(transparent 55%, rgba(255,242,102,.95) 55%); color: inherit; }
.redline .ins u { text-decoration-color: var(--violet); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.redline dl { margin: 22px 0 0; display: grid; grid-template-columns: 150px 1fr; border-top: 1px solid var(--rule-soft); }
.redline dt, .redline dd { margin: 0; padding: 11px 0; border-bottom: 1px solid var(--rule-soft); font-size: 15px; line-height: 22px; }
.redline dt { font-weight: 700; color: var(--violet); }
.comment-bubble { margin-top: 18px; background: var(--paper-2); border: 1px solid var(--orchid); border-left: 4px solid var(--rose); padding: 12px 14px; font-size: 14.5px; line-height: 21px; }
.comment-bubble b { font: 700 12.5px/18px var(--font-accent); color: var(--rose-d); display: block; }
@media (max-width: 520px) { .redline dl { grid-template-columns: 1fr; } .redline dt { padding-bottom: 0; border-bottom: 0; } }
.weight-total { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 14px 16px; border-top: 2px solid var(--violet); }
.results-row { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--rule); border-top: 0; background: #fff; }
.results-row > div { padding: 18px; display: grid; gap: 6px; }
.results-row > div + div { border-left: 1px solid var(--rule); }
@media (max-width: 640px) { .results-row { grid-template-columns: 1fr; } .results-row > div + div { border-left: 0; border-top: 1px solid var(--rule); } }

/* Directory */
.dir-filters { display: grid; grid-template-columns: 220px 300px 1fr auto; gap: 14px; align-items: end; margin-bottom: 18px; }
@media (max-width: 1024px) { .dir-filters { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .dir-filters { grid-template-columns: 1fr; } }
#dirList { border-top: 2px solid var(--violet); }
.prov { border-bottom: 1px solid var(--rule-soft); background: #fff; transition: background-color .15s; }
.prov:hover { background: var(--paper); }
.prov-row { display: grid; grid-template-columns: minmax(150px, 2fr) minmax(0, 4fr) minmax(0, 2.2fr) auto; gap: 18px; align-items: center; min-height: 84px; padding: 14px 18px; }
.prov-name { font: 800 21px/26px var(--font-heading); color: var(--violet); letter-spacing: -.03em; }
.prov-cat { display: flex; flex-wrap: wrap; gap: 6px; }
.prov-actions { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.prov-detail { padding: 0 18px 20px; animation: drop .2s var(--ease); }
.prov.open { box-shadow: inset 4px 0 0 var(--sulphur); background: var(--paper); }
.grp-head { padding: 12px 18px; background: var(--lav); font: 700 12.5px/18px var(--font-accent); color: var(--violet); border-bottom: 1px solid var(--rule); display: flex; justify-content: space-between; }
.prov-rel { font-size: 13.5px; line-height: 19px; color: var(--ink-2); }
@media (max-width: 960px) { .prov-row { grid-template-columns: 1fr 1fr; } .prov-actions { justify-content: flex-start; grid-column: 1 / -1; } }
@media (max-width: 560px) { .prov-row { grid-template-columns: 1fr; } }
.tray { position: sticky; bottom: 12px; z-index: 20; margin-top: 18px; background: var(--deep); color: #fff; border: 2px solid var(--sulphur); border-radius: var(--radius-tool-shell); padding: 12px 16px; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; box-shadow: 0 20px 40px -20px rgba(36,0,150,.7); }
.tray .slots { display: flex; gap: 8px; flex-wrap: wrap; }
.tray .slot { min-height: 34px; padding: 6px 10px; border: 1px dashed var(--orchid); font: 600 14px/20px var(--font-body); color: var(--orchid); }
.tray .slot.filled { border-style: solid; color: var(--sulphur); }

/* Reconciliation (deep section) */
.test-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 0; }
.test-tabs button { background: transparent; border: 1px solid rgba(25,54,58,.4); border-bottom: 0; border-radius: 8px 8px 0 0; padding: 12px 16px; min-height: 52px; font: 600 15px/20px var(--font-body); color: var(--orchid); cursor: pointer; display: grid; text-align: left; transition: background-color .15s, color .15s; }
.test-tabs button small { font: 700 11.5px/16px var(--font-accent); color: inherit; opacity: .85; }
.test-tabs button:hover { color: #fff; background: rgba(255,255,255,.06); }
.test-tabs button[aria-selected="true"] { background: #fff; color: var(--violet); border-color: #fff; }
.rec-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 4fr) minmax(0, 5fr); background: #fff; color: var(--ink); border-radius: 0 var(--radius-tool-shell) 0 0; }
.rec-grid > div { padding: 24px; display: grid; gap: 12px; align-content: start; }
.rec-grid > div + div { border-left: 1px solid var(--rule-soft); }
.rec-grid .t-body { font-size: 18px; line-height: 28px; }
@media (max-width: 900px) { .rec-grid { grid-template-columns: 1fr; } .rec-grid > div + div { border-left: 0; border-top: 1px solid var(--rule-soft); } }
.evid-card { border: 1px solid var(--violet); background: var(--paper); }
.evid-card .hd { background: var(--violet); color: var(--sulphur); padding: 8px 12px; font: 700 12.5px/18px var(--font-accent); display: flex; justify-content: space-between; }
.evid-card .bd { padding: 12px; display: grid; gap: 6px; font-size: 14px; line-height: 20px; }
.evid-card .att { display: flex; gap: 10px; align-items: center; padding: 8px; border: 1px dashed var(--rule); background: #fff; font: 12.5px/18px var(--font-accent); }
.criteria { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.criteria li { display: grid; grid-template-columns: 180px 1fr; gap: 10px; font-size: 14.5px; line-height: 21px; }
@media (max-width: 640px) { .criteria li { grid-template-columns: 1fr; gap: 2px; } }
details summary { cursor: pointer; }
details summary::-webkit-details-marker { display: none; }
.deep .rec-grid .st-match::before, .deep .tally .st-match::before { color: var(--lime-d); }
.deep .rec-grid .st-unmapped::before, .deep .tally .st-unmapped::before { border-color: var(--violet); }
.deep .rec-grid .st-na::before, .deep .tally .st-na::before { border-color: var(--ink-2); }
.deep .rec-grid .st-fail::before, .deep .tally .st-fail::before { color: #94513A; }
.deep .rec-grid :focus-visible, .deep .tally :focus-visible { outline-color: var(--deep); }
.tally { display: flex; flex-wrap: wrap; gap: 8px 24px; padding: 14px 24px; background: var(--paper-2); color: var(--ink); border-radius: 0 0 var(--radius-tool-shell) var(--radius-tool-shell); border-top: 1px solid var(--rule-soft); }

/* Cost: financial statement */
.tco-top { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(24px, 4vw, 56px); align-items: stretch; margin-bottom: 26px; }
@media (max-width: 1024px) { .tco-top { grid-template-columns: 1fr; } }
.tco-summary { display: grid; grid-template-columns: 1fr 1fr; border: 2px solid var(--violet); background: #fff; }
.tco-summary > div { padding: 18px 20px; display: grid; gap: 4px; align-content: start; }
.tco-summary > div:nth-child(n+2) { border-top: 1px solid var(--rule-soft); }
.tco-summary > div:nth-child(odd):not(:first-child) { border-left: 0; }
.tco-summary > div:nth-child(3) { border-left: 1px solid var(--rule-soft); }
.tco-summary .main { grid-column: 1 / -1; background: var(--sulphur); }
.tco-summary .main .t-total { font-size: clamp(36px, 4vw, 54px); line-height: 1.05; }
.tco-summary > div:last-child { grid-column: 1 / -1; }
.chart-box { background: #fff; border: 1px solid var(--rule); padding: 20px 22px 14px; display: grid; gap: 10px; }
.chart-box h3 { font: 700 15px/20px var(--font-body); color: var(--violet); }
.chart-key { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13.5px; line-height: 19px; color: var(--ink-2); }
.chart-key i { display: inline-block; width: 12px; height: 12px; margin-right: 6px; vertical-align: -1px; border: 1px solid var(--violet); }
.tco td.money, .tco th.money { text-align: right; font: 13.5px/19px var(--font-accent); white-space: nowrap; }
.tco .param { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: flex-end; font-size: 13px; line-height: 18px; color: var(--ink-2); }
.tco .formula { display: none; font: 12px/17px var(--font-accent); color: var(--ink-2); margin-top: 4px; font-weight: 400; }
.tco.show-f .formula { display: block; }
.tco tr.band-row th { background: var(--lav) !important; font: 700 12.5px/18px var(--font-accent); color: var(--violet); }
.tco tr.unknown td.money { color: #94513A; font-weight: 700; }
.tco tfoot th, .tco tfoot td { font-weight: 700; border-bottom: 0; padding-top: 16px; padding-bottom: 16px; }
.tco tfoot td.money { font-weight: 700; border-top: 1px solid var(--violet); box-shadow: inset 0 -4px 0 #fff, inset 0 -5px 0 var(--violet), inset 0 -7px 0 #fff, inset 0 -8px 0 var(--violet); }
.changed { animation: changed 1.3s ease-out; }
@keyframes changed { 0% { background-color: rgba(255,242,102,1); } 100% { background-color: transparent; } }

/* Research */
.shelf { position: relative; margin: 0; }
.shelf img { width: 100%; height: auto; aspect-ratio: 1800 / 640; }
.feature { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(24px, 4vw, 56px); align-items: center; padding: clamp(28px, 4vw, 48px) 0; border-bottom: 1px solid var(--rule); }
.feature .cover { aspect-ratio: 5/4; }
.feature h3 { font: 800 clamp(28px, 3vw, 42px)/1.06 var(--font-heading); letter-spacing: -.035em; }
@media (max-width: 860px) { .feature { grid-template-columns: 1fr; } .feature .cover { aspect-ratio: 16/10; } }
.minor-features { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-bottom: 1px solid var(--rule); }
.minor { display: grid; grid-template-columns: 140px 1fr; gap: 20px; padding: 28px 0; align-items: start; }
.minor + .minor { border-left: 1px solid var(--rule-soft); padding-left: 28px; }
.minor .cover { aspect-ratio: 3/4; }
.minor h3 { font: 700 21px/27px var(--font-heading); letter-spacing: -.02em; }
@media (max-width: 860px) { .minor-features { grid-template-columns: 1fr; } .minor + .minor { border-left: 0; padding-left: 0; border-top: 1px solid var(--rule-soft); } }
.cover { position: relative; background: var(--violet); overflow: hidden; box-shadow: 0 2px 0 rgba(36,0,150,.2), 0 30px 50px -30px rgba(36,0,150,.7); transition: transform .3s var(--ease); }
.cover:hover { transform: translateY(-3px) rotate(-.4deg); }
.cover svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.cover .cc { position: absolute; left: 16px; top: 14px; color: var(--sulphur); font: 700 11.5px/16px var(--font-accent); }
.cover .ct { position: absolute; left: 16px; right: 16px; bottom: 16px; color: #fff; font: 700 17px/22px var(--font-heading); letter-spacing: -.02em; }
.feature .cover .ct { font-size: clamp(20px, 2vw, 28px); line-height: 1.12; color: var(--sulphur); left: 24px; right: 24px; bottom: 24px; }
.cover::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 10px; background: linear-gradient(90deg, rgba(0,0,0,.25), transparent); }
.topic-bar { display: flex; flex-wrap: wrap; gap: 8px; margin: 40px 0 8px; }
.topic-bar label { position: relative; }
.topic-bar input { position: absolute; opacity: 0; inset: 0; }
.topic-bar span { display: inline-flex; min-height: 40px; align-items: center; padding: 0 14px; border-radius: 999px; border: 1px solid var(--rule); font: 600 14px/20px var(--font-body); color: var(--violet); background: #fff; cursor: pointer; transition: background-color .15s; }
.topic-bar input:checked + span { background: var(--violet); color: var(--sulphur); border-color: var(--violet); }
.topic-bar input:focus-visible + span { outline: 3px solid var(--deep); outline-offset: 2px; }
.art-list { list-style: none; margin: 0; padding: 0; counter-reset: wp; }
.art-list li { display: grid; grid-template-columns: 60px minmax(0, 6fr) minmax(0, 3fr); gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--rule-soft); align-items: baseline; animation: drop .2s var(--ease); }
.art-list .n { font: 700 13px/20px var(--font-accent); color: var(--violet); }
.art-list .topic { font: 700 12px/18px var(--font-accent); color: var(--rose-d); display: block; margin-bottom: 2px; }
@media (max-width: 860px) { .art-list li { grid-template-columns: 44px 1fr; } .art-list li > :last-child { grid-column: 2; } }

/* Bundle (sulphur) */
.bundle { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
@media (max-width: 980px) { .bundle { grid-template-columns: 1fr; } }
.sulphur-bg h2 { color: var(--violet); }
.sulphur-bg .dek { color: var(--violet); }
.bundle-list { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--violet); }
.bundle-list li { display: grid; grid-template-columns: 52px 1fr; gap: 12px; padding: 14px 0; border-bottom: 1px solid rgba(25,54,58,.3); font: 600 16px/23px var(--font-body); }
.bundle-list li b { font: 700 13px/23px var(--font-accent); }
.bundle form { background: #fff; border: 2px solid var(--violet); box-shadow: 10px 10px 0 var(--violet); padding: clamp(20px, 2.6vw, 32px); display: grid; gap: 16px; }

/* Basis of preparation */
.notes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(28px, 5vw, 80px); counter-reset: note; }
.note { display: grid; grid-template-columns: 80px 1fr; gap: 16px; padding: 24px 0; border-top: 1px solid var(--rule); }
.note .k { font: 700 13px/24px var(--font-accent); color: var(--violet); }
.note h3 { font: 700 21px/27px var(--font-heading); letter-spacing: -.02em; margin-bottom: 6px; }
.note p { margin: 0; color: var(--ink-2); font-size: 16px; line-height: 25px; }
@media (max-width: 860px) { .notes { grid-template-columns: 1fr; } }

/* Footer */
.site-footer { background: var(--deep); color: #fff; padding: 72px 0 28px; }
.site-footer a, .site-footer .linkbtn { color: #fff; text-decoration: none; font-weight: 500; font-size: 16px; min-height: 0; }
.site-footer a:hover, .site-footer .linkbtn:hover { color: var(--sulphur); text-decoration: underline; }
.foot-cta { display: flex; flex-wrap: wrap; gap: 24px; justify-content: space-between; align-items: end; padding-bottom: 48px; margin-bottom: 48px; border-bottom: 1px solid rgba(25,54,58,.3); }
.foot-cta h2 { color: #fff; font: 800 clamp(30px, 3.6vw, 52px)/1.04 var(--font-heading); letter-spacing: -.04em; max-width: 18ch; }
.foot-cta h2 span { color: var(--sulphur); }
.foot-grid { display: grid; grid-template-columns: 5fr 3fr 3fr 3fr; gap: 24px; }
@media (max-width: 860px) { .foot-grid { grid-template-columns: 1fr 1fr; } .foot-grid > :first-child { grid-column: 1/-1; } }
.foot-grid h3 { color: var(--orchid); font: 700 12.5px/18px var(--font-accent); margin-bottom: 14px; }
.foot-grid ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.foot-word { font: 800 30px/32px var(--font-heading); letter-spacing: -.045em; color: var(--sulphur); }
.foot-base { margin-top: 56px; padding-top: 20px; border-top: 1px solid rgba(25,54,58,.3); display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 18px; }
.foot-base p { margin: 0; color: var(--orchid); font-size: 14px; line-height: 21px; max-width: 78ch; }

/* doja badge */
.doja { --d: 44px; display: inline-flex; align-items: center; text-decoration: none; color: #fff; background: #000; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; padding: 4px 16px 4px 4px; transition: border-color .2s, padding .22s; position: relative; }
.doja .doja-mark { width: var(--d); height: var(--d); border-radius: 50%; overflow: hidden; flex: none; transition: transform .35s cubic-bezier(.3,1.6,.5,1); }
.doja .doja-mark svg { width: 100%; height: 100%; }
.doja .doja-dot { transition: transform .35s cubic-bezier(.3,1.8,.5,1); transform-origin: 650px 323px; }
.doja .doja-bowl { transition: transform .5s cubic-bezier(.3,1.3,.5,1); transform-origin: 518px 614px; }
.doja .doja-txt { display: grid; padding-left: 10px; line-height: 1; }
.doja .doja-txt small { font: 500 11px/14px var(--font-body); color: rgba(255,255,255,.66); }
.doja .doja-txt b { font: 800 17px/20px var(--font-heading); letter-spacing: -.03em; }
.doja .doja-go { width: 0; overflow: hidden; opacity: 0; transition: width .22s, opacity .22s, margin .22s; display: inline-grid; place-items: center; }
.doja:hover, .doja:focus-visible { border-color: var(--sulphur); padding-right: 12px; }
.doja:hover .doja-mark, .doja:focus-visible .doja-mark { transform: rotate(-8deg) scale(1.06); }
.doja:hover .doja-dot, .doja:focus-visible .doja-dot { transform: translateY(-70px) rotate(12deg); }
.doja:hover .doja-bowl, .doja:focus-visible .doja-bowl { transform: rotate(360deg); }
.doja:hover .doja-go, .doja:focus-visible .doja-go { width: 22px; opacity: 1; margin-left: 8px; }
.doja:active .doja-mark { transform: scale(.94); }
.doja.pulse .doja-mark { animation: dojaPulse .6s ease-out; }
@keyframes dojaPulse { 0% { box-shadow: 0 0 0 0 rgba(255,242,102,.8); } 100% { box-shadow: 0 0 0 14px rgba(255,242,102,0); } }
.doja .tip { position: absolute; bottom: calc(100% + 10px); right: 0; background: #000; color: #fff; border: 1px solid rgba(255,255,255,.25); padding: 8px 12px; border-radius: 8px; font: 500 13px/18px var(--font-body); white-space: nowrap; opacity: 0; transform: translateY(4px); pointer-events: none; transition: opacity .18s, transform .18s; }
.doja:hover .tip, .doja:focus-visible .tip { opacity: 1; transform: none; }

/* Dialogs + toast */
dialog { border: 2px solid var(--sulphur); border-radius: var(--radius-dialogue); padding: 0; max-width: min(720px, calc(100vw - 32px)); width: 100%; background: var(--violet); color: #fff; box-shadow: 18px 18px 0 var(--deep); }
dialog[open] { animation: dlg .2s var(--ease); }
@keyframes dlg { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
dialog::backdrop { background: rgba(36,0,150,.45); backdrop-filter: blur(2px); }
dialog .dlg-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 20px; border-bottom: 1px solid rgba(25,54,58,.3); }
dialog .dlg-head h2 { color: var(--sulphur); font: 800 21px/27px var(--font-heading); letter-spacing: -.02em; }
dialog .dlg-body { padding: 20px; display: grid; gap: 14px; max-height: 70vh; overflow: auto; font-size: 16px; line-height: 25px; }
dialog .dlg-body p { margin: 0; }
dialog .input { background: #fff; color: var(--ink); }
dialog a:not(.btn) { color: var(--sulphur); }
dialog .ws { color: var(--ink); }
.close-btn { width: 40px; height: 40px; border-radius: var(--radius-button); background: transparent; border: 1px solid var(--orchid); color: var(--sulphur); cursor: pointer; font-size: 20px; }
.toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%) translateY(20px); opacity: 0; z-index: 400; background: var(--deep); color: #fff; border: 2px solid var(--sulphur); padding: 12px 18px; border-radius: var(--radius-button); font: 700 15px/20px var(--font-body); transition: opacity .18s, transform .18s; pointer-events: none; max-width: calc(100vw - 32px); }
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* Reveal on scroll (JS-enabled only) */
.js .rv { opacity: 0; transform: translateY(18px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.js .rv.in { opacity: 1; transform: none; }

/* ===== Responsive + specificity fixes ===== */
.folio .ref { white-space: nowrap; flex: none; }
.site-footer a.btn { min-height: 60px; font-size: 17px; font-weight: 700; color: var(--violet); text-decoration: none; }
.site-footer a.btn:hover { color: var(--violet); text-decoration: none; }
.site-footer a.btn-primary { border-color: var(--sulphur); box-shadow: 4px 4px 0 #000; }
#xrTable { min-width: 760px; } .matrix { min-width: 760px; } #wtTable { min-width: 760px; } .tco { min-width: 900px; }
.scroll-cue { display: none; font: 700 12px/16px var(--font-accent); color: var(--ink-2); margin: 0 0 8px; }
@media (max-width: 900px) { .scroll-cue { display: block; } }
@media (max-width: 720px) { .tray { position: static; } .hero-ctas .btn-lg { width: 100%; } }

/* ====================================================
 CONTROLSPAN / 2026 — INDEPENDENT RESEARCH EDITION
 Bespoke editorial system layered over original tools.
 ==================================================== */
:root {
 --font-heading: Georgia, "Iowan Old Style", "Baskerville", serif;
 --font-body: "Helvetica Neue", Arial, sans-serif;
 --font-accent: "SFMono-Regular", Consolas, Menlo, monospace;
 --paper:#F9F8F4; --paper-2:#F0F0EB; --lav:#E7EDEB;
 --violet:#19363A; --deep:#10292E; --ink:#1B2A2B; --ink-2:#526461;
 --rule:#93A4A0; --rule-soft:rgba(26,59,60,.19);
 --sulphur:#E3B380; --orchid:#CCDCD7; --rose:#B76849; --rose-d:#94513A;
 --lime-d:#426B55; --colour-main-canvas:#19363A; --colour-inverse-lettering:#19363A;
 --colour-expanded-working-surface:#28464A; --colour-primary-text:#F1E9DB;
 --colour-primary-action:#E3B380; --colour-keyboard-focus:#E3B380;
 --colour-secondary-text:#CCDCD7; --colour-functional-boundary:#A8BCB4;
 --colour-reconciled-sample-indicator:#A7BA99; --colour-decorative-correspondence:#B76849;
 --radius-button:2px;--radius-input:2px;--radius-tool-shell:3px;--radius-dialogue:5px;
 --content-max:1450px;--gutter:clamp(22px,4.5vw,70px);
}
body{background:var(--paper);color:var(--ink);font:400 16px/1.65 var(--font-body);letter-spacing:0}
html{scroll-padding-top:100px}
::selection{background:var(--sulphur);color:var(--deep)}
a{color:var(--violet)}
h1,h2,h3,h4{font-family:var(--font-heading);color:var(--ink);font-weight:400}
.h2{font:400 clamp(34px,4vw,59px)/1.08 var(--font-heading);letter-spacing:-.045em}
.h3{font:400 clamp(23px,2.1vw,30px)/1.16 var(--font-heading);letter-spacing:-.026em}
.dek{font:400 clamp(17px,1.55vw,21px)/1.55 var(--font-body);color:var(--ink-2)}
.body-l{font-size:18px;line-height:1.65}
.mono,.t-id,.t-cap,.folio,.chip,.demo-badge{letter-spacing:.015em}
.sec{padding:clamp(75px,9vw,122px) 0}
.soft-bg{background:#F0F1ED}.lav-bg{background:#E6ECE9}.paper-bg{background:#FAF9F5}
.ledger{background-image:repeating-linear-gradient(180deg, transparent 0 32px,rgba(22,55,59,.045) 32px 33px)}
.dark{background:#163438;color:#F7F6F0}.deep{background:#0E282C;color:#F7F6F0}
.dark h2,.dark h3,.deep h2,.deep h3{color:#F7F6F0}
.dark .dek,.deep .dek{color:#D8E4E0}
.sulphur-bg{background:#E8DED0;color:var(--ink)}
.folio{color:var(--ink-2);font:600 11px/1.4 var(--font-accent);letter-spacing:.12em;text-transform:uppercase}
.folio .ref{background:transparent;color:var(--rose-d);font:700 11px/18px var(--font-accent);padding:2px 0;border-bottom:1px solid currentColor;border-radius:0}
.folio::after{background:var(--rule-soft)}
.btn{border-radius:2px;box-shadow:none!important;min-height:46px;font:600 13px/1.3 var(--font-body);letter-spacing:.015em;transition:background-color .2s, color .2s, border-color .2s}
.btn-primary{background:#19363A;color:#fff;border:1px solid #19363A}
.btn-primary:hover,.btn-primary:active{background:#31565B;box-shadow:none;transform:none}
.btn-lg{min-height:56px;padding:0 28px;font-size:14px}
.btn-secondary{border-color:var(--ink)}.btn-ghost{border-color:var(--rule);border-radius:2px;background:#fff}
.btn:hover,.btn:active{box-shadow:none!important;transform:none!important}
.btn svg{max-width:18px}
.linkbtn,.arrow-link{color:var(--violet);font-weight:600}
.chip,.demo-badge{border-radius:0}
.input{border-radius:2px;border-color:#A4B3AE;background:#fff}
.field label,.field .lbl,.lbl{color:var(--ink);font-weight:600}
.input:focus{border-color:var(--deep);box-shadow:0 0 0 3px rgba(227,179,128,.45)}
.st-match::before{color:var(--lime-d)}
/* Masthead and editorial navigation */
.dateline{background:#17353A;color:#CFDCD7;font:500 10px/1.7 var(--font-accent);letter-spacing:.09em;text-transform:uppercase}
.dateline .wrap{padding-top:8px;padding-bottom:8px}
.dateline b{color:#E6C095}
.edition-sep{color:#A7C1B9;margin:0 9px}
.site-header{background:rgba(249,248,244,.98);border-bottom:1px solid #D7DFDB;backdrop-filter:blur(18px)}
.site-header.scrolled{box-shadow:0 8px 22px rgba(13,45,47,.05);border-bottom-color:#CFD7D1}
.site-header .wrap{min-height:90px}
.brand{gap:15px}.brand-lock{display:grid}
.cs-mark{display:flex;align-items:flex-end;gap:4px;width:30px;height:34px;flex:0 0 auto}
.cs-mark i{display:block;width:6px;background:#19363A;height:28px}
.cs-mark i:nth-child(2){height:20px;background:#BD7551}
.cs-mark i:nth-child(3){height:33px}
.brand-word{color:#183337;font:700 29px/.95 var(--font-body);letter-spacing:-.07em}
.word-period{color:#B76849}.brand-desc{color:#566E69;font:500 10px/1.3 var(--font-body);letter-spacing:.12em;text-transform:uppercase;margin-top:8px}
.nav{gap:8px}.nav>a,.nav-dropdown summary{font:600 13px/1.2 var(--font-body);color:#243F42;text-decoration:none;padding:14px 14px;cursor:pointer;white-space:nowrap}
.nav a::after{height:1px;background:#BA7553;bottom:6px}
.n-chev{font-size:16px;margin-left:6px;font-weight:400}
.nav-dropdown{position:relative;align-self:center}
.nav-dropdown summary{list-style:none}.nav-dropdown summary::-webkit-details-marker{display:none}
.nav-dropdown[open] summary,.nav a:hover{color:#B16643}
.research-mega{position:absolute;left:-190px;top:calc(100% + 28px);width:min(760px,90vw);display:grid;grid-template-columns:.95fr 1.5fr;gap:30px;padding:30px;background:#FCFBF7;border:1px solid #C3D0C9;box-shadow:0 22px 60px rgba(18,48,51,.15);z-index:65}
.mega-intro{background:#18373A;padding:26px;color:#fff}
.mega-intro h3{font:400 29px/1.08 var(--font-heading);color:#FAF7F1;margin:18px 0}
.mega-intro p{font-size:13px;color:#C9D8D3;margin:0 0 28px}
.mega-intro a{font:600 12px var(--font-body);color:#E7BC88;text-decoration:none}
.mega-items{display:grid;grid-template-columns:1fr 1fr;gap:2px 20px;align-content:start}
.mega-items a{display:flex;align-items:center;gap:12px;font:600 12.5px/1.35 var(--font-body);padding:13px 0;border-bottom:1px solid #DFE4DE;color:#1F3638;text-decoration:none}
.mega-items a:hover{color:#B16643}.mega-items b{font:500 10px var(--font-accent);color:#AC7557}
.icon-btn{background:transparent;color:#1C383B;border:1px solid #CFD8D2;border-radius:2px;width:42px;height:42px}
.tabs-rail{display:none!important}
/* Hero: editorial page opening */
.cs-hero{position:relative;overflow:hidden;background:#F7F6F1;padding:0}
.cs-hero::before{content:"";position:absolute;top:-80px;left:-200px;width:500px;height:500px;border:1px solid rgba(41,69,67,.055);border-radius:50%;pointer-events:none}
.cs-hero-content{position:relative}
.hero-topline{display:flex;justify-content:space-between;gap:24px;padding:24px 0 20px;border-bottom:1px solid #CED8D2;font:600 10px/1.3 var(--font-accent);letter-spacing:.10em;color:#677D78}
.cs-hero-grid{display:grid;grid-template-columns:minmax(0,46%) minmax(0,54%);min-height:700px;align-items:stretch}
.cs-hero-message{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:60px clamp(24px,4vw,62px) 70px 0}
.hero-eyebrow{font:600 11px/1.5 var(--font-body);letter-spacing:.12em;text-transform:uppercase;color:#98694F;display:flex;align-items:center;gap:13px;margin-bottom:30px}
.rule-tick{width:36px;height:1px;background:#AA7354}
.cs-hero h1{font:400 clamp(51px,5.8vw,93px)/1.01 var(--font-heading);letter-spacing:-.068em;margin:0 0 27px;max-width:11ch;color:#193437}
.cs-hero h1 em{font-weight:400;color:#B46B4B}
.hero-lead{font-size:clamp(17px,1.4vw,20px);line-height:1.5;max-width:44ch;margin:0 0 15px;color:#253A3A}
.hero-small{font:400 14px/1.65 var(--font-body);max-width:51ch;color:#687875;margin:0}
.cs-hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin:29px 0 46px}
.cs-hero-actions .btn{display:inline-flex;gap:24px}
.cs-text-link{font:600 13px var(--font-body);text-decoration:none;color:#19383B;border-bottom:1px solid #A67C63;padding:10px 0}
.hero-basis{display:flex;flex-wrap:wrap;gap:11px 18px;margin-top:0;border-top:1px solid #CFD8D2;padding-top:18px;width:100%;font:500 9px/1.5 var(--font-accent);letter-spacing:.065em;color:#667D77}
.cs-hero-visual{position:relative;min-height:640px;overflow:hidden;background:#182D31;margin-right:calc(-1 * var(--gutter))}
.cs-hero-visual>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:52% center;filter:saturate(.78) contrast(1.05)}
.cs-hero-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(16,29,32,.10) 25%,rgba(16,29,32,.23) 55%,rgba(13,24,29,.68) 100%);pointer-events:none}
.visual-plate{position:absolute;top:50px;left:45px;z-index:1;width:230px;height:270px;background:rgba(247,244,237,.96);padding:19px 20px;display:flex;flex-direction:column;justify-content:space-between;color:#1E3839;box-shadow:16px 19px 0 rgba(17,40,43,.14)}
.plate-top{display:flex;justify-content:space-between;font:600 8px/1.3 var(--font-accent);letter-spacing:.06em;border-bottom:1px solid #B4C5BD;padding-bottom:12px}
.plate-bottom{font:400 26px/1.08 var(--font-heading);letter-spacing:-.05em}.plate-bottom em{color:#AD694F}.plate-bottom span{display:block;font:600 8px var(--font-accent);letter-spacing:.045em;margin-top:24px}
.image-index{position:absolute;left:40px;right:34px;bottom:28px;z-index:1;display:flex;justify-content:space-between;border-top:1px solid rgba(244,245,239,.65);padding-top:17px;color:#F6F6EF;font:500 10px var(--font-accent);letter-spacing:.11em}
.hero-underbar{display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px;padding:25px 0 29px;border-top:1px solid #CCD7D0;border-bottom:1px solid #CCD7D0}
.hero-underbar>div{display:flex;flex-direction:column;gap:7px;min-height:38px}
.hero-underbar>div+div{border-left:1px solid #CBD5CF;padding-left:28px}
.underbar-label{font:600 9px/1.5 var(--font-accent);letter-spacing:.13em;color:#B06649}
.hero-underbar strong{font:500 13px var(--font-body);color:#2D4242}
/* Three editorial dossiers */
.editorial-perspectives{background:#F9F8F4;padding:clamp(72px,9vw,132px) 0 80px}
.ed-section-top{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #9FAFAA;padding-top:14px;font:600 10px var(--font-accent);letter-spacing:.10em;color:#7C8C84}
.ed-intro{display:grid;grid-template-columns:1.2fr .65fr;gap:64px;align-items:end;margin:55px 0 42px}
.micro{display:inline-block;font:600 10px/1.3 var(--font-accent);letter-spacing:.13em;color:#A36B4C}
.ed-intro h2,.desk-heading h2{font:400 clamp(41px,4.5vw,68px)/1.09 var(--font-heading);letter-spacing:-.055em;color:#193538;margin:20px 0 0}
.ed-intro h2 em,.desk-heading h2 em{color:#A96B4B;font-weight:400}
.ed-intro>p{color:#536B66;font-size:17px;line-height:1.63;margin:0 0 5px}
.ed-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px}
.ed-card{display:flex;flex-direction:column;border:1px solid #CFD8D1;text-decoration:none;color:inherit;background:#FCFBF8;transition:transform .22s,box-shadow .22s}
.ed-card:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(22,54,56,.11)}
.ed-art{height:278px;overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center}
.ed-art-buy{background:#DDE6E0}.ed-art-migrate{background:#D9D9D0}.ed-art-operate{background:#E9E1D7}
.document-paper{background:#F9F8F3;width:67%;height:89%;transform:rotate(-6deg) translate(8px,14px);padding:23px;box-shadow:15px 15px 0 rgba(30,60,62,.14);display:flex;flex-direction:column;justify-content:space-between}
.paper-mark,.paper-foot{font:600 8px var(--font-accent);color:#617771;letter-spacing:.06em}
.paper-big{font:400 40px/.91 var(--font-heading);letter-spacing:-.05em;color:#19363A}.paper-big span{color:#B66C4E}
.paper-lines i{display:block;background:#C9D3CE;width:100%;height:1px;margin:8px 0}.paper-lines i:nth-child(2){width:83%}.paper-lines i:nth-child(3){width:61%}
.crosswalk-card{background:#F9F8F3;transform:rotate(3deg);border:1px solid #B2C1BB;width:84%;padding:16px;box-shadow:15px 14px 0 rgba(47,66,62,.12)}
.cw-heading{display:flex;justify-content:space-between;font:600 8px var(--font-accent);padding-bottom:13px;border-bottom:2px solid #19393B}
.cw-row{display:grid;grid-template-columns:1fr 24px 1fr;gap:9px;padding:12px 0;border-bottom:1px solid #D4DBD4;align-items:center;font:600 9px var(--font-accent);color:#415552}
.cw-row>i{font-style:normal;font-weight:bold;color:#50745C}
.cw-row>.cw-bad{color:#BB6A48}.cw-row>.cw-mark{color:#8D9C95}
.cw-foot{font:600 8px var(--font-accent);margin-top:12px;color:#A35B42}
.cost-note{background:#19383B;width:80%;padding:23px 21px;color:#F1F4EC;transform:rotate(-4deg);box-shadow:13px 13px 0 rgba(71,61,51,.16)}
.cost-caption{font:500 9px/1.4 var(--font-accent);letter-spacing:.08em;color:#DFCEB9}.cost-caption.bottom{border-top:1px solid #69817B;padding-top:13px;margin-top:20px}
.cost-bars{margin-top:27px}.cost-bars>div{display:flex;flex-direction:column;gap:4px;margin-bottom:11px}
.cost-bars span{font:500 8px var(--font-accent);letter-spacing:.04em;color:#C7D7D2}
.cost-bars i{height:8px;background:#E3B380;display:block}.cost-bars .unknown{background:repeating-linear-gradient(45deg,#AA7C62 0 4px,transparent 4px 8px);border:1px solid #AA7C62}
.ed-meta{display:flex;justify-content:space-between;padding:24px 24px 12px;font:600 10px var(--font-accent);letter-spacing:.11em;color:#A36547}
.ed-meta span{font-size:15px}
.ed-card h3{font:400 clamp(24px,2.2vw,33px)/1.14 var(--font-heading);letter-spacing:-.04em;color:#1A3436;margin:0 24px 12px}
.ed-card p{font-size:14px;color:#5C6B67;line-height:1.6;margin:0 24px 23px;flex:1}
.ed-cta{border-top:1px solid #D8DFDA;padding:16px 24px 20px;display:flex;justify-content:space-between;font:600 12px var(--font-body);color:#17393B}
.ed-disclosure{border-top:1px solid #B9C9BF;margin-top:44px;padding-top:21px;display:flex;gap:17px;align-items:center;color:#73827A}
.disc-emblem{width:25px;height:25px;border:1px solid #AEBDB5;border-radius:50%;flex:0 0 auto;text-align:center;font:italic 19px/24px Georgia}
.ed-disclosure p{font:400 12px/1.55 var(--font-body);margin:0;flex:1;max-width:90ch}
.ed-disclosure button{background:none;border:0;cursor:pointer;color:#29504C;text-decoration:underline;text-underline-offset:3px;font:600 12px var(--font-body);white-space:nowrap}
/* Desk: publication catalogue instead of product feature grid */
#desk{background:#E9EFEB!important;padding-top:95px!important}
.desk-heading{display:grid;grid-template-columns:1fr .58fr;gap:50px;align-items:end;border-top:1px solid #9CADA5;padding:22px 0 48px}
.desk-heading h2{margin-top:23px}.desk-heading p{max-width:38ch;font-size:17px;line-height:1.6;color:#5C716A;margin:0 0 8px}
#desk .memo{border-top:1px solid #9DAEA4;border-bottom:1px solid #9DAEA4;background:rgba(255,255,255,.36)}
#desk .memo>div{border-color:#C9D3CB}
#desk .contents-grid{margin-top:85px!important}
#desk .toc a{transition:background .2s}
#desk .toc a:hover{background:rgba(255,255,255,.64)}
/* Original complex tools: restrained and editorial but untouched JS */
.panel,.memo-sheet,.hier,.shell,.scorecard,.card,.tool-card,.provider-card,.research-card, .modal-card{border-radius:3px!important;box-shadow:none!important}
.shell{box-shadow:none!important}
.sec .wrap>.sh-split{margin-bottom:46px}
.sh-split .aside{max-width:50ch}
#exhibit .map-row,#inventory .map-row{border-color:rgba(216,230,224,.2)}
#exhibit .st-review,#reconcile .st-review{color:#F4CCAA}
.toc .r{color:#A16F51}
.sulphur-bg .btn-primary{background:#1A3A3E;color:#fff;border:1px solid #1A3A3E}
.sulphur-bg .btn-primary:hover{background:#31565B}
.sulphur-bg .h2,.sulphur-bg h2,.sulphur-bg h3{color:#203A3B}
#bundle{background:#EDE4D6!important}
#research{background:#E2E9E5!important}
.research-still{min-height:360px;background:#CFD9D1;display:flex;align-items:center;justify-content:center;gap:0;padding:35px;position:relative;overflow:hidden}
.archive-vol{width:27%;height:265px;background:#1B3A3D;color:#F9F7EF;padding:20px 15px;display:flex;flex-direction:column;justify-content:space-between;border-right:3px solid #BCC8BD;box-shadow:7px 6px 10px rgba(22,49,48,.16);transform:rotate(-3deg);position:relative}
.archive-vol span{font:600 8px/1.5 var(--font-accent);letter-spacing:.065em}.archive-vol strong{font:400 67px/1 var(--font-heading);color:#E2B582}.archive-vol em{font:italic 20px var(--font-heading);color:#F5F1E8}
.archive-vol.v-b{background:#B16D51;height:282px;transform:rotate(2deg) translateY(-7px);z-index:2}.archive-vol.v-b strong{color:#F5DEC5}
.archive-vol.v-c{background:#566D67;height:267px;transform:rotate(5deg) translateY(4px)}
.archive-caption{position:absolute;bottom:14px;left:20px;font:600 9px var(--font-accent);letter-spacing:.08em;color:#4B625A}
/* Footer, modals, interactive accessibility */
.site-footer{background:#142E32;color:#E6ECE7}
.site-footer h2,.site-footer h3{color:#F4F2E9}
.site-footer a{color:#D7E6E0}
.site-footer .btn-primary{background:#E8B783;color:#173437;border-color:#E8B783}
.site-footer .btn-primary:hover{background:#F2D1A8}
#searchOpen,#menuBtn{border-radius:1px}
dialog{border-radius:4px!important}
:focus-visible{outline:2px solid #B86D4A;outline-offset:4px}
.dark :focus-visible,.deep :focus-visible,.site-footer :focus-visible{outline-color:#E8B783}
/* Adjust article imagery and chart visuals without changing their research substance */
#research img{max-width:100%}
@media(min-width:1280px){.wrap{padding-right:var(--gutter)}}
@media(max-width:1200px){.nav{gap:0}.nav>a,.nav-dropdown summary{padding:13px 9px}.cs-hero h1{font-size:clamp(49px,5.5vw,74px)}.cs-hero-grid{min-height:650px}}
@media(max-width:980px){
 .site-header .wrap{min-height:76px}
 .nav{top:76px;background:#F9F8F4;border-color:#C8D3CB;gap:0;align-items:stretch}
 .nav-dropdown{align-self:auto}.nav-dropdown summary{padding:14px 0;border-bottom:1px solid var(--rule-soft)}
 .research-mega{position:static;width:100%;grid-template-columns:1fr;padding:10px;box-shadow:none;border-color:#D6E0D8;gap:10px}
 .mega-intro{display:none}.mega-items{grid-template-columns:1fr 1fr}
 .cs-hero-grid{grid-template-columns:1fr;min-height:0}
 .cs-hero-message{padding:66px 0 48px}
 .cs-hero h1{max-width:12ch;font-size:clamp(56px,8vw,88px)}
 .cs-hero-visual{margin-right:0;min-height:530px}
 .hero-underbar{gap:15px}
 .ed-intro{gap:30px}
 .ed-card-grid{gap:13px}.ed-art{height:240px}
 .ed-card h3{font-size:25px}.ed-card p{font-size:13px}
}
@media(max-width:720px){
 .dateline{font-size:9px}.hero-topline{font-size:9px}.hero-topline span:last-child{display:none}
 .brand-word{font-size:25px}.brand-desc{font-size:9px}
 .cs-hero-message{padding:55px 0 43px}
 .cs-hero h1{font-size:clamp(52px,11vw,73px);line-height:1.04}
 .hero-lead{font-size:18px}.hero-small{font-size:14px}
 .cs-hero-visual{min-height:475px;margin:0 calc(-1 * var(--gutter))}
 .visual-plate{width:176px;height:212px;left:24px;top:27px;padding:15px}
 .plate-top{font-size:7px}.plate-bottom{font-size:23px}
 .hero-underbar{grid-template-columns:1fr;gap:12px;padding:22px 0}
 .hero-underbar>div{min-height:0}.hero-underbar>div+div{padding:12px 0 0;border-left:0;border-top:1px solid #D4DDD7}
 .ed-section-top span:last-child{display:none}
 .editorial-perspectives{padding:75px 0 70px}
 .ed-intro,.desk-heading{grid-template-columns:1fr;gap:20px;margin:35px 0}
 .ed-intro h2,.desk-heading h2{font-size:clamp(40px,9vw,58px)}
 .ed-intro>p{font-size:15px}
 .ed-card-grid{grid-template-columns:1fr;gap:20px}
 .ed-art{height:260px}.ed-card h3{font-size:31px}
 .ed-disclosure{align-items:flex-start;flex-wrap:wrap;gap:11px}
 .ed-disclosure button{margin-left:36px}
 #desk{padding-top:70px!important}.desk-heading{margin:0 0 28px}
 .research-still{min-height:280px;padding:16px}.archive-vol{height:200px;padding:13px 9px}.archive-vol.v-b{height:215px}.archive-vol.v-c{height:207px}.archive-vol strong{font-size:44px}.archive-vol em{font-size:15px}.archive-vol span{font-size:6px}
}
@media(max-width:420px){.cs-hero h1{font-size:49px}.cs-hero-actions{gap:8px}.cs-hero-actions .btn{width:100%;justify-content:space-between}.visual-plate{top:22px}.hero-basis{font-size:8px}}
@media(prefers-reduced-motion:reduce){.ed-card{transition:none}}