/* assets/dcr.css · The Desert Camel Report (hub, insights, methodology, signals)
   Light mode (membership audience). Brand OS v1.2 tokens from brand-tokens.css; type sizes from type.css
   (loaded last). Cards carry no border; no side stripes; magenta = one action + one insight per screen.
   Logical properties throughout, so the Arabic twin mirrors without new rules. */

.dcr {
  --dcr-ink: var(--ink, #000);
  --dcr-muted: var(--ink-muted, #4A4A68);
  --dcr-line: var(--hairline, #D1D1D9);
  --dcr-ground: var(--ghost-white, #F8F8FA);
  --dcr-card: var(--surface, #fff);
  --dcr-shadow: var(--shadow-card, 0 1px 2px rgba(0,0,0,.06), 0 8px 24px rgba(0,0,0,.06));
  --dcr-r: var(--radius-card, 12px);
  --dcr-r-band: var(--radius-base, 24px);
  --dcr-gap: clamp(16px, 2vw, 24px);
  color: var(--dcr-ink);
  background: var(--dcr-ground);
}
.dcr :focus-visible { outline: 3px solid var(--focus-ring, #3B06D4); outline-offset: 2px; border-radius: 4px; }
.dcr a:not(.btn) { color: inherit; }
.dcr p { text-wrap: pretty; }
.dcr .wrap { max-inline-size: calc(1280px + 2 * var(--gutter)); }

/* ---------- section rhythm ---------- */
.dcr-sec { padding-block: clamp(48px, 6vw, 88px); }
.dcr-sec--tight { padding-block: clamp(32px, 4vw, 56px); }
.dcr-sec--white { background: var(--white, #fff); }
.dcr-head { max-inline-size: 760px; margin-block-end: clamp(24px, 3vw, 40px); }
.dcr-head .t-eyebrow { margin-block-end: 12px; }
.dcr-head h1, .dcr-head h2 { margin: 0 0 12px; }
.dcr-head .t-lead { margin: 0; }
.dcr-cols { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(24px, 4vw, 64px); align-items: start; }

/* ---------- edition stamp ---------- */
.dcr-stamp { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 0 0 16px; color: var(--dcr-ink); }
.dcr-stamp span:not(:last-child)::after { content: "·"; margin-inline-start: 12px; }

/* ---------- hero (one Bright duo band; black ink, full-field safe) ---------- */
.dcr-hero { padding-block: clamp(16px, 2vw, 32px) clamp(32px, 4vw, 56px); }
.dcr-hero__band { background: var(--duo-bright, linear-gradient(135deg, #4CF3FE, #F5C24B)); color: var(--on-duo-ink-light, #000); border-radius: var(--dcr-r-band); padding: clamp(24px, 4vw, 56px); display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(20px, 2.4vw, 32px); }
.dcr-hero__now { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.dcr-hero__now > .t-eyebrow { grid-column: 1 / -1; }
.dcr-hero__band .t-eyebrow { color: var(--on-duo-ink-light, #000); }
.dcr-hero__band :focus-visible { outline-color: var(--focus-ring-on-duo-light, #000); }
.dcr-hero h1 { margin: 0; max-inline-size: 30ch; }
.dcr-hero__left { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 12px clamp(24px, 4vw, 56px); align-items: start; }
.dcr-hero__left .dcr-actions { grid-column: 2; grid-row: 1; }
.dcr-hero__left .dcr-note { grid-column: 2; margin: 0; }
.dcr-hero .t-lead-hero { color: var(--on-duo-ink-light, #000); margin: 0; grid-row: 1 / span 2; }
.dcr-hero__now { display: grid; gap: 12px; }
.dcr-hero__now > .t-eyebrow { margin: 0 0 2px; }
.dcr-page-hero { padding-block: clamp(32px, 5vw, 72px) clamp(24px, 3vw, 40px); }
.dcr-page-hero h1 { margin: 0 0 16px; max-inline-size: 24ch; }
.dcr-page-hero .t-lead-hero { max-inline-size: 60ch; margin: 0; }

/* ---------- actions ---------- */
.dcr-actions { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: center; }
.dcr-actions .btn { min-block-size: 48px; }
.dcr .btn--magenta { background: var(--magenta, #FF00D4); border-color: var(--magenta, #FF00D4); color: var(--on-accent, #fff); font-weight: 600; }
.dcr .btn--magenta:hover { background: var(--magenta-600, #D700B3); border-color: var(--magenta-600, #D700B3); }
.dcr-hero .btn--ghost { background: var(--white, #fff); border-color: transparent; color: #000; }
.dcr-link { font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.dcr-link:hover { text-decoration-thickness: 2px; }
.dcr-note { margin: 12px 0 0; color: inherit; }

/* ---------- data-state chip (text only, never colour alone) ---------- */
.dcr-chip { display: inline-flex; align-items: center; font: 500 var(--t-meta, .75rem)/1.3 var(--font-mono); letter-spacing: .02em; padding: 4px 10px; border-radius: 999px; background: var(--ghost-white, #F8F8FA); color: var(--dcr-ink); white-space: normal; }
.dcr-chip--src { background: var(--purple-subtle, #F6F8FF); color: var(--purple, #3B06D4); }
.dcr-chip--wait { background: var(--gold-subtle, #FFF7E8); color: var(--warning-text, #956F00); }
.dcr-chip--comm { background: var(--green-subtle, #E3FFEC); color: var(--success-text, #00864F); }

/* ---------- figure tile ---------- */
.dcr-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: var(--dcr-gap); }
.dcr-tiles--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.dcr-tile { background: var(--dcr-card); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); padding: clamp(18px, 2vw, 24px); display: flex; flex-direction: column; gap: 8px; min-inline-size: 0; }
.dcr-tile__k { margin: 0; color: var(--dcr-muted); }
.dcr-tile__v { margin: 0; font: 500 var(--t-h2)/1.1 var(--font-mono); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; color: var(--dcr-ink); }
.dcr-tile__v--word { font-family: var(--font-sans); font-weight: 600; }
.dcr-tile__l { margin: 0; font-weight: 500; }
.dcr-tile__d { margin: 0; color: var(--dcr-muted); }
.dcr-tile__cap { margin: 0; font-size: var(--t-small); line-height: 1.5; color: var(--dcr-ink); font-weight: 500; }
.dcr-tile__src { margin: auto 0 0; padding-block-start: 10px; font: 400 var(--t-small)/1.5 var(--font-sans); color: var(--dcr-muted); }
.dcr-tile__src a { color: inherit; }
.dcr-tile .dcr-chip { align-self: flex-start; }
.dcr-hero .dcr-tile { padding: 16px 18px; gap: 6px; }
.dcr-hero .dcr-tile__v { font-size: var(--t-h3); }
.dcr-pairnote { margin: var(--dcr-gap) 0 0; font-weight: 600; }
.dcr-tile--wide { grid-column: 1 / -1; }

/* ---------- method line + source rows ---------- */
.dcr-method { margin: 16px 0 0; max-inline-size: 80ch; font-size: var(--t-small); line-height: 1.55; color: var(--dcr-muted); }
.dcr-more { margin-block-start: 16px; }
.dcr-more > summary { cursor: pointer; display: inline-flex; gap: 8px; align-items: center; font-weight: 600; font-size: var(--t-small); padding-block: 8px; list-style: none; }
.dcr-more > summary::-webkit-details-marker { display: none; }
.dcr-more > summary::before { content: "+"; font: 500 16px/1 var(--font-mono); inline-size: 16px; text-align: center; }
.dcr-more[open] > summary::before { content: "−"; }
.dcr-more__body { padding-block: 8px 4px; }
.dcr-srcrow { display: grid; gap: 4px; padding-block: 12px; border-block-start: 1px solid var(--dcr-line); font-size: var(--t-small); line-height: 1.5; }
.dcr-srcrow b { font-weight: 600; }
.dcr-srcrow span { color: var(--dcr-muted); }

/* ---------- tables (numbers fallbacks, floors, register) ---------- */
.dcr-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.dcr-table { inline-size: 100%; border-collapse: collapse; font-size: var(--t-small); line-height: 1.45; background: var(--dcr-card); }
.dcr-table caption { text-align: start; caption-side: top; padding-block-end: 8px; font-weight: 600; color: var(--dcr-ink); }
.dcr-table th, .dcr-table td { text-align: start; padding: 10px 12px; border-block-end: 1px solid var(--dcr-line); vertical-align: top; }
.dcr-table thead th { font: 500 var(--t-micro)/1.3 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--dcr-muted); background: var(--dcr-card); }
.dcr-table td.num { font-family: var(--font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.dcr-card { background: var(--dcr-card); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); padding: clamp(16px, 2vw, 24px); }

/* ---------- the gap: data-availability matrix ---------- */
.dcr-matrix { inline-size: 100%; border-collapse: separate; border-spacing: 0; background: var(--dcr-card); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); overflow: hidden; font-size: var(--t-small); }
.dcr-matrix th, .dcr-matrix td { padding: 12px 14px; text-align: start; border-block-end: 1px solid var(--dcr-line); vertical-align: top; }
.dcr-matrix thead th { font: 500 var(--t-micro)/1.3 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--dcr-muted); }
.dcr-matrix thead th.is-ref, .dcr-matrix td.is-ref { color: var(--dcr-muted); background: var(--ghost-white, #F8F8FA); }
.dcr-matrix tbody th { font-weight: 600; inline-size: 26%; }
.dcr-matrix tbody tr:last-child > * { border-block-end: 0; }
.dcr-state { display: block; font-weight: 600; }
.dcr-state small { display: block; font-weight: 400; color: var(--dcr-muted); font-size: var(--t-meta); line-height: 1.4; margin-block-start: 2px; }
.dcr-state--none { color: var(--dcr-ink); }
.dcr-state--thin, .dcr-state--global { color: var(--dcr-ink); }
.dcr-state--ok { color: var(--dcr-ink); }
.dcr-matrix tr.is-insight > * { background: var(--magenta-50, #FFF5FC); }
.dcr-matrix tr.is-insight .dcr-state--none { color: var(--magenta-700, #A6008A); }
.dcr-matrix tr.is-insight th .dcr-insight { display: inline-flex; margin-block-start: 6px; font: 600 var(--t-small)/1.3 var(--font-mono); letter-spacing: 0; color: var(--on-accent, #fff); background: var(--magenta, #FF00D4); padding: 4px 8px; border-radius: 6px; }
.dcr-legend { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 14px 0 0; padding: 0; list-style: none; font-size: var(--t-small); color: var(--dcr-muted); }
.dcr-legend b { color: var(--dcr-ink); font-weight: 600; }

/* ---------- small multiples: progress-to-floor meters ---------- */
.dcr-sm { display: grid; gap: var(--dcr-gap); }
.dcr-sm__head, .dcr-sm__row { display: grid; grid-template-columns: minmax(120px, 1.1fr) repeat(4, minmax(0, 1fr)) minmax(0, 1.15fr); gap: 12px; align-items: stretch; }
.dcr-sm__head { font: 500 var(--t-micro)/1.3 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--dcr-muted); }
.dcr-sm__head > span { padding-inline: 4px; }
.dcr-sm__role { font-weight: 600; align-self: center; }
.dcr-sm__cell { background: var(--dcr-card); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); padding: 12px 14px 10px; min-inline-size: 0; display: grid; gap: 4px; }
.dcr-sm__mk { display: none; font: 500 var(--t-micro)/1.3 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--dcr-muted); }
.dcr-meter { display: grid; gap: 2px; }
.dcr-meter svg { display: block; inline-size: 100%; block-size: 20px; overflow: visible; }
.dcr-meter__axis { position: relative; block-size: 14px; font: 500 var(--t-micro)/14px var(--font-mono); color: var(--dcr-muted); font-variant-numeric: tabular-nums; }
.dcr-meter__axis span { position: absolute; inset-block-start: 0; transform: translateX(-50%); }
.dcr-meter__axis span.is-start { inset-inline-start: 0; transform: none; }
.dcr-meter__axis span.is-end { inset-inline-end: 0; transform: none; }
.dcr-sm__lab { margin: 0; font: 500 var(--t-meta)/1.35 var(--font-mono); font-variant-numeric: tabular-nums; color: var(--dcr-ink); }
.dcr-sm__sub { margin: 0; font-size: var(--t-meta); line-height: 1.4; color: var(--dcr-muted); }
.dcr-sm__ref { background: var(--ghost-white, #F8F8FA); border-radius: var(--dcr-r); padding: 12px 14px; color: var(--dcr-muted); font-size: var(--t-meta); line-height: 1.4; display: grid; gap: 2px; align-content: start; }
.dcr-sm__ref b { color: var(--dcr-ink); font: 500 var(--t-small)/1.3 var(--font-mono); }
.dcr-sm--compact .dcr-sm__head, .dcr-sm--compact .dcr-sm__row { grid-template-columns: minmax(120px, 1.1fr) repeat(3, minmax(0, 1fr)); }
.dcr-sm--one .dcr-sm__head, .dcr-sm--one .dcr-sm__row { grid-template-columns: minmax(110px, 1fr) minmax(0, 2fr); }
.dcr-sm-title { margin: 0 0 6px; }
.dcr-sm-block + .dcr-sm-block { margin-block-start: clamp(28px, 3vw, 40px); }
.dcr-axis { fill: var(--dcr-muted); font: 500 10px var(--font-mono); }

/* ---------- the four parts / rules ---------- */
.dcr-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: var(--dcr-gap); }
.dcr-cards .dcr-card { display: flex; flex-direction: column; gap: 10px; }
.dcr-card .dcr-chip, .dcr-sig__card .dcr-chip { align-self: flex-start; }
.dcr-cards h3 { margin: 0; }
.dcr-cards p { margin: 0; }
.dcr-rules { counter-reset: r; list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.dcr-rules li { counter-increment: r; display: grid; grid-template-columns: 40px 1fr; gap: 12px; align-items: baseline; background: var(--dcr-card); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); padding: 16px 18px; }
.dcr-rules li::before { content: counter(r, decimal-leading-zero); font: 500 var(--t-small)/1 var(--font-mono); color: var(--purple, #3B06D4); }
.dcr-who { margin: 20px 0 0; padding: 16px 18px; border-radius: var(--dcr-r); background: var(--white, #fff); box-shadow: var(--dcr-shadow); }

/* ---------- example skills card ---------- */
.dcr-example { background: var(--dcr-card); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); padding: clamp(18px, 2.4vw, 28px); display: grid; gap: 14px; }
.dcr-example__tag { justify-self: start; }
.dcr-dots { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.dcr-dots li { display: grid; gap: 4px; }
.dcr-dots svg { inline-size: 100%; max-inline-size: 360px; block-size: auto; display: block; }
.dcr-dots__name { font-weight: 600; font-size: var(--t-small); }
.dcr-dots__fit { font-size: var(--t-small); color: var(--dcr-muted); }

/* ---------- guided insights: on-this-page ---------- */
.dcr-toc { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0 0; padding: 0; list-style: none; }
.dcr-toc a { display: inline-flex; padding: 8px 14px; border-radius: 999px; background: var(--white, #fff); box-shadow: var(--dcr-shadow); text-decoration: none; font-size: var(--t-small); font-weight: 500; }
.dcr-toc a:hover { background: var(--purple-subtle, #F6F8FF); }
.dcr-step { display: inline-block; font: 500 var(--t-meta)/1 var(--font-mono); color: var(--purple, #3B06D4); margin-inline-end: 6px; }
.dcr-prose { max-inline-size: 68ch; }
.dcr-prose p { margin: 0 0 14px; }
.dcr-gaps { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.dcr-gaps li { background: var(--dcr-card); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); padding: 14px 16px; display: grid; gap: 2px; }
.dcr-gaps li span { color: var(--dcr-muted); font-size: var(--t-small); }

/* ---------- signals ---------- */
.dcr-sig { display: grid; gap: var(--dcr-gap); grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.dcr-sig__card { background: var(--dcr-card); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); padding: 20px; display: flex; flex-direction: column; gap: 10px; }
.dcr-sig__meta { display: flex; flex-wrap: wrap; gap: 4px 10px; color: var(--dcr-muted); }
.dcr-sig__card h3 { margin: 0; }
.dcr-sig__card p { margin: 0; }
.dcr-sig__so { font-weight: 500; }
.dcr-sig__src { margin-block-start: auto !important; font-size: var(--t-small); color: var(--dcr-muted); }
.dcr-empty { background: var(--white, #fff); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); padding: clamp(20px, 3vw, 32px); display: grid; gap: 8px; }
.dcr-empty p { margin: 0; }
.dcr-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.dcr-filters button { font: 500 var(--t-small)/1 var(--font-sans); padding: 10px 14px; border-radius: 999px; border: 1px solid var(--dcr-line); background: var(--white, #fff); color: var(--dcr-ink); cursor: pointer; }
.dcr-filters button[aria-pressed="true"] { background: var(--ink, #000); color: var(--white, #fff); border-color: var(--ink, #000); }

/* ---------- subscribe block ---------- */
.dcr-subwrap { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.dcr-sub { background: var(--white, #fff); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); padding: clamp(18px, 2.4vw, 28px); --rf-ink: #000; --rf-muted: #4A4A68; --rf-focus: #3B06D4; --rf-ground: #fff; }
.dcr-sub .rf-grid { gap: 0 16px; }
.dcr-sub fieldset { border: 0; margin: 0 0 14px; padding: 0; min-inline-size: 0; }
.dcr-sub legend { padding: 0; margin: 0 0 8px; font: 500 14px/1.3 var(--font-sans); }
.dcr-checks { display: flex; flex-wrap: wrap; gap: 8px; }
.dcr-check { display: inline-flex; gap: 8px; align-items: center; padding: 10px 12px; border: 1px solid var(--dcr-line); border-radius: 10px; font-size: var(--t-small); cursor: pointer; min-block-size: 44px; }
.dcr-check input { inline-size: 18px; block-size: 18px; accent-color: var(--purple, #3B06D4); margin: 0; }
.dcr-check:has(input:checked) { border-color: var(--purple, #3B06D4); box-shadow: inset 0 0 0 1px var(--purple, #3B06D4); }
.dcr-consent { display: grid; grid-template-columns: 20px 1fr; gap: 10px; align-items: start; font-size: var(--t-small); line-height: 1.5; margin: 4px 0 16px; cursor: pointer; }
.dcr-consent input { inline-size: 18px; block-size: 18px; margin: 2px 0 0; accent-color: var(--purple, #3B06D4); }
.dcr-consent.is-err { color: var(--danger-text, #E12C05); }
.dcr-sub .btn { inline-size: 100%; min-block-size: 48px; }
.dcr-sub .form-note { margin: 12px 0 0; font-size: var(--t-small); }
.dcr-sub .form-note[data-state="success"] { color: var(--success-text, #00864F); font-weight: 600; }
.dcr-sub .form-note[data-state="error"] { color: var(--danger-text, #E12C05); }

/* ---------- FAQ ---------- */
.dcr-faq { display: grid; gap: 10px; }
.dcr-faq details { background: var(--white, #fff); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); padding: 4px 20px; }
.dcr-faq summary { cursor: pointer; padding-block: 16px; font-weight: 600; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.dcr-faq summary::-webkit-details-marker { display: none; }
.dcr-faq summary::after { content: "+"; font: 500 18px/1 var(--font-mono); }
.dcr-faq details[open] summary::after { content: "−"; }
.dcr-faq details p { margin: 0 0 16px; color: var(--dcr-muted); max-inline-size: 70ch; }

/* ---------- methodology ---------- */
.dcr-toc--side { position: sticky; inset-block-start: 96px; display: grid; gap: 4px; margin: 0; }
.dcr-toc--side a { box-shadow: none; background: transparent; padding: 6px 0; border-radius: 0; }
.dcr-toc--side a:hover { background: transparent; text-decoration: underline; }
.dcr-method-grid { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.dcr-msec + .dcr-msec { margin-block-start: clamp(40px, 5vw, 64px); }
.dcr-msec h2 { margin: 0 0 12px; }
.dcr-msec > p { max-inline-size: 72ch; }
.dcr-list { margin: 0; padding-inline-start: 20px; display: grid; gap: 6px; max-inline-size: 72ch; }
.dcr-tag { display: inline-block; font: 500 var(--t-micro)/1.3 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; padding: 3px 7px; border-radius: 6px; background: var(--ghost-white, #F8F8FA); white-space: nowrap; }
.dcr-tag--pub { background: var(--purple-subtle, #F6F8FF); color: var(--purple, #3B06D4); }
.dcr-tag--wait { background: var(--gold-subtle, #FFF7E8); color: var(--warning-text, #956F00); }
.dcr-tag--never { background: var(--ghost-white, #F8F8FA); color: var(--dcr-ink); }
.dcr-table .dcr-tag { white-space: normal; max-inline-size: 16ch; }

/* ---------- responsive ---------- */
@media (max-width: 1024px) {
  .dcr-hero__now { grid-template-columns: 1fr; }
  .dcr-hero__left { grid-template-columns: 1fr; }
  .dcr-hero__left .dcr-actions, .dcr-hero__left .dcr-note { grid-column: 1; grid-row: auto; }
  .dcr-hero .t-lead-hero { grid-row: auto; }
  .dcr-cols, .dcr-subwrap, .dcr-method-grid { grid-template-columns: minmax(0, 1fr); }
  .dcr-toc--side { position: static; display: flex; flex-wrap: wrap; gap: 8px; }
  .dcr-toc--side a { background: var(--white, #fff); padding: 8px 12px; border-radius: 999px; box-shadow: var(--dcr-shadow); }
}
@media (max-width: 860px) {
  /* small multiples: one role at a time, the markets stacked on the same axis */
  .dcr-sm__head { display: none; }
  .dcr-sm__row, .dcr-sm--compact .dcr-sm__row { grid-template-columns: 1fr; gap: 8px; }
  .dcr-sm__row + .dcr-sm__row { margin-block-start: 12px; }
  .dcr-sm__role { font-size: var(--t-h4); }
  .dcr-sm__mk { display: block; }
  /* the matrix becomes labelled cards */
  .dcr-matrix, .dcr-matrix tbody, .dcr-matrix tr, .dcr-matrix th, .dcr-matrix td { display: block; inline-size: auto; }
  .dcr-matrix { background: transparent; box-shadow: none; border-radius: 0; overflow: visible; }
  .dcr-matrix thead { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
  .dcr-matrix tbody tr { background: var(--dcr-card); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); margin-block-end: 12px; overflow: hidden; }
  .dcr-matrix tbody th { inline-size: auto; border-block-end: 1px solid var(--dcr-line); }
  .dcr-matrix tbody td { display: grid; grid-template-columns: 112px 1fr; gap: 8px; border-block-end: 1px solid var(--dcr-line); }
  .dcr-matrix tbody td::before { content: attr(data-label); font: 500 var(--t-micro)/1.4 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--dcr-muted); padding-block-start: 2px; }
  .dcr-matrix tbody tr > :last-child { border-block-end: 0; }
  .dcr-rules li { grid-template-columns: 32px 1fr; }
}
@media (max-width: 560px) {
  .dcr-hero__band { padding: 20px 18px 24px; border-radius: 20px; }
  .dcr-actions { flex-direction: column; align-items: stretch; }
  .dcr-actions .btn { inline-size: 100%; white-space: normal; text-align: center; }
  .dcr-actions .dcr-link { align-self: flex-start; }
  .dcr-sub .rf-grid { grid-template-columns: 1fr; }
  .dcr-table--cards thead { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
  .dcr-table--cards, .dcr-table--cards tbody, .dcr-table--cards tr, .dcr-table--cards td, .dcr-table--cards th { display: block; inline-size: auto; }
  .dcr-table--cards { background: transparent; }
  .dcr-table--cards caption { display: block; }
  .dcr-tag { white-space: normal; }
  .dcr-table--cards tbody tr { background: var(--dcr-card); border-radius: var(--dcr-r); box-shadow: var(--dcr-shadow); margin-block-end: 10px; padding: 6px 0; }
  .dcr-table--cards tbody td, .dcr-table--cards tbody th { border: 0; padding: 6px 14px; display: grid; grid-template-columns: 104px 1fr; gap: 8px; }
  .dcr-table--cards tbody td::before, .dcr-table--cards tbody th::before { content: attr(data-label); font: 500 var(--t-micro)/1.4 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--dcr-muted); padding-block-start: 2px; }
}

/* ---------- motion ---------- */
.dcr-meter rect.dcr-bar { transition: opacity var(--dur-quick, 200ms) var(--ease-standard, ease); }
@media (prefers-reduced-motion: reduce) {
  .dcr *, .dcr *::before, .dcr *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* ---------- print ---------- */
@media print {
  .dcr-hero__band { background: none; padding: 0; }
  .dcr-sub, .dcr-actions, .dcr-toc { display: none; }
  .dcr-more__body { display: block; }
}
.dcr-sig__meta span:not(:last-child)::after { content: "·"; margin-inline-start: 10px; }

/* ---------- one page with tabs (desert-camel-report/index.html, assets/dcr-tabs.js) ----------
   Seven tab panels, an audience switch in the hero, and a sticky tab row under the fixed site header.
   Without the script every panel shows, stacked. Selected states use ink, never magenta. */
.rp [hidden] { display: none !important; }
.rp [role="tabpanel"]:focus { outline: none; }
.rp .rp-h2:focus { outline: none; }

/* hero: the switch sits under the lead, on the Bright duo band (black ink) */
.rp-hero__copy { display: grid; gap: 20px; align-content: start; }
.rp-aud { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.rp-aud__k { margin: 0; color: var(--on-duo-ink-light, #000); }
.rp-seg { display: inline-flex; gap: 4px; padding: 4px; border-radius: 999px; background: rgba(255, 255, 255, .62); }
.rp-seg a { display: inline-flex; align-items: center; min-block-size: 40px; padding: 0 16px; border-radius: 999px; font-weight: 600; color: #000 !important; text-decoration: none; white-space: nowrap; }
.rp-seg a:hover { background: rgba(255, 255, 255, .8); }
.rp-seg a[aria-checked="true"] { background: #000; color: #fff !important; }
.rp-hero .dcr-hero__left > div:last-child { display: grid; gap: 12px; align-content: start; }
.rp-hero .dcr-note { margin: 0; }

/* the tab row */
.rp-tabs { position: sticky; top: 64px; z-index: 40; background: rgba(248, 248, 250, .92); -webkit-backdrop-filter: saturate(160%) blur(12px); backdrop-filter: saturate(160%) blur(12px); box-shadow: inset 0 -1px 0 var(--dcr-line); }
html.has-notif:not(.notif-up) .rp-tabs { top: 106px; }
.rp-tablist { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.rp-tablist::-webkit-scrollbar { display: none; }
.rp-tablist[data-fade~="end"] { -webkit-mask-image: linear-gradient(to right, #000 85%, transparent); mask-image: linear-gradient(to right, #000 85%, transparent); }
.rp-tablist[data-fade~="start"] { -webkit-mask-image: linear-gradient(to left, #000 85%, transparent); mask-image: linear-gradient(to left, #000 85%, transparent); }
.rp-tablist[data-fade~="start"][data-fade~="end"] { -webkit-mask-image: linear-gradient(to right, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(to right, transparent, #000 12%, #000 88%, transparent); }
.rp-tab { flex: none; display: inline-flex; align-items: center; min-block-size: 52px; padding: 0 14px; font-weight: 600; font-size: var(--t-small); color: var(--dcr-muted) !important; text-decoration: none; box-shadow: inset 0 -2px 0 transparent; white-space: nowrap; }
.rp-tab:hover { color: var(--dcr-ink) !important; }
.rp-tab[aria-selected="true"] { color: var(--dcr-ink) !important; box-shadow: inset 0 -3px 0 var(--dcr-ink); }
.rp-tab:focus-visible { outline-offset: -3px; }
.rp-tabnav { padding-inline: var(--gutter, 24px); }

/* panels */
.rp-panel__head { padding-block: clamp(32px, 4vw, 56px) 0; }
.rp-panel__head .wrap { max-inline-size: calc(1280px + 2 * var(--gutter)); }
.rp-panel__head .rp-h2 { margin: 0 0 12px; max-inline-size: 30ch; }
.rp-panel__head .t-lead { margin: 0; max-inline-size: 64ch; }
.rp-panel__head .dcr-stamp { margin-block-start: 12px; color: var(--dcr-muted); }
.rp-panel__head + .dcr-sec, .rp-panel__head + .dcr-sk, .rp-panel__head + section { margin-block-start: clamp(16px, 2vw, 24px); }
.rp-so { margin: 6px 0 0; font-size: var(--t-small); line-height: 1.5; color: var(--dcr-ink); }
.rp-panel__head .rp-so { max-inline-size: 64ch; }
.dcr-tile .rp-so { margin: 0; padding-block-start: 6px; }
.rp-muted { color: var(--dcr-muted); max-inline-size: 70ch; margin: 0 0 20px; }
.rp-block + .rp-block { margin-block-start: clamp(24px, 3vw, 40px); }
.rp-block > .t-row { margin: 0 0 8px; }
.rp-acts { margin-block-start: 24px; }

/* Overview: next steps */
.rp-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: var(--dcr-gap); }
.rp-step { display: grid; gap: 6px; align-content: start; color: var(--dcr-ink) !important; text-decoration: none; transition: box-shadow .2s ease, transform .2s ease; }
.rp-step:hover { transform: translateY(-2px); box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 14px 32px rgba(0,0,0,.10); }
.rp-step .t-meta { color: var(--dcr-muted); }
.rp-step > span:last-child { color: var(--dcr-muted); font-size: var(--t-small); line-height: 1.5; }

/* Companies with open roles: the view switch, the logos */
.rp-view { display: inline-flex; gap: 4px; padding: 4px; border-radius: 999px; background: var(--dcr-ground); margin-block-end: clamp(20px, 3vw, 32px); }
.rp-view button { min-block-size: 40px; padding: 0 18px; border: 0; border-radius: 999px; background: transparent; font: 600 var(--t-small)/1 var(--font-sans); color: var(--dcr-ink); cursor: pointer; }
.rp-view button[aria-pressed="true"] { background: var(--dcr-ink); color: #fff; }
.rp-logos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); gap: 12px; }
.rp-logo { display: grid; place-items: center; block-size: 92px; padding: 16px 20px; border-radius: var(--dcr-r); background: var(--dcr-ground); }
.rp-logo img { inline-size: auto; block-size: var(--h, 30px); max-inline-size: 100%; object-fit: contain; }

/* Voices: members' own words */
.rp-voices { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: var(--dcr-gap); }
.rp-voices > li.is-wide { grid-column: span 2; }
.rp-voice { margin: 0; block-size: 100%; display: flex; flex-direction: column; justify-content: space-between; gap: 20px; padding: clamp(20px, 2.4vw, 28px); border-radius: var(--dcr-r); background: var(--dcr-ground); }
.rp-voice blockquote { margin: 0; }
.rp-voice blockquote p { margin: 0; font-size: var(--t-lead, 1.125rem); line-height: 1.5; font-weight: 500; }
.rp-voice figcaption { display: flex; align-items: center; gap: 12px; }
.rp-voice figcaption img { inline-size: 44px; block-size: 44px; border-radius: 50%; object-fit: cover; flex: none; }
.rp-voice__who { display: grid; gap: 2px; font-size: var(--t-small); line-height: 1.35; min-inline-size: 0; }
.rp-voice__who span { color: var(--dcr-muted); }
.rp-voice__li { margin-inline-start: auto; display: inline-grid; place-items: center; inline-size: 40px; block-size: 40px; border-radius: 10px; color: var(--dcr-ink) !important; }
.rp-voice__li:hover { background: var(--white, #fff); }

@media (max-width: 1024px) {
  .rp-hero .dcr-hero__left { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .rp-voices > li.is-wide { grid-column: auto; }
  .rp-logos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rp-logo { block-size: 80px; }
}
@media (max-width: 560px) {
  .rp-tabs { top: 64px; }
  .rp-seg a { padding: 0 12px; }
}
@media print {
  .rp-tabs, .rp-aud { display: none; }
  .rp [role="tabpanel"][hidden] { display: block !important; }
}

/* the cookie banner (site.js): this page does not load visuals.css, so its rules are repeated here */
.cookie { position:fixed; left:50%; bottom:18px; transform:translate(-50%,140%); z-index:240; width:min(680px, calc(100vw - 28px));
  opacity:0; transition:transform .4s cubic-bezier(.2,.8,.2,1), opacity .4s ease; }
.cookie.in { transform:translateX(-50%); opacity:1; }
/* resting under the header when the bottom spot would cover the page's primary action (site.js sets top) */
.cookie.cookie--top { bottom:auto; transform:translate(-50%,-24px); }
.cookie.cookie--top.in { transform:translateX(-50%); }
html.cookie-low .rv-voice { bottom:calc(var(--cookie-lift, 0px) + env(safe-area-inset-bottom,0px)); transition:bottom .2s ease; }
.cookie__body { display:flex; align-items:center; gap:16px; padding:14px 16px;
  border-radius:16px; background:rgba(22,3,46,0.78); color:#fff;
  backdrop-filter:blur(20px) saturate(160%); -webkit-backdrop-filter:blur(20px) saturate(160%);
  border:1px solid rgba(255,255,255,0.16); box-shadow:0 24px 60px -20px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.18); }
.cookie__ico { font-size:1.5rem; line-height:1; flex:none; }
.cookie__txt { margin:0; font-size:0.85rem; color:rgba(255,255,255,0.78); line-height:1.45; flex:1; min-width:0; }
.cookie__txt a { color:var(--cyan-bright,#4CF3FE); text-decoration:none; }
.cookie__actions { display:flex; gap:9px; flex:none; }
.cookie__btn { font-family:inherit; font-weight:600; font-size:0.82rem; padding:9px 16px; border-radius:10px; cursor:pointer; white-space:nowrap; border:1px solid transparent; transition:all .2s ease; }
.cookie__btn--ghost { background:rgba(255,255,255,0.08); border-color:rgba(255,255,255,0.2); color:rgba(255,255,255,0.8); }
.cookie__btn--ghost:hover { background:rgba(255,255,255,0.14); color:#fff; }
.cookie__btn--accept { background:#3B06D4; color:#fff; box-shadow:none; } /* purple primary: magenta stays the page's own action */
.cookie__btn--accept:hover { transform:translateY(-1px); }
@media (max-width:560px){ .cookie__body{ flex-wrap:wrap; } .cookie__actions{ width:100%; } .cookie__btn{ flex:1; } }
