/* Sharetru · Resource library (2026). Theme tokens only; own file, no Shared styles, no layer (module CSS wins for its internals). */

/* ---------- hero: white, two radial washes, masked dot grid (Playbook B2 #2) ---------- */
.rl26-hero { position: relative; isolation: isolate; overflow: clip; display: grid; gap: var(--st-gap-cols); align-items: center;
  padding-block: clamp(2.5rem, 1.5rem + 3.2vw, 4.75rem) clamp(2rem, 1.25rem + 2.2vw, 3.5rem); padding-inline: var(--st-inline); font-family: var(--st-font);
  background: radial-gradient(900px 420px at 88% -8%, color-mix(in srgb, var(--st-aqua) 18%, transparent), transparent 60%),
    radial-gradient(700px 380px at 0% 108%, color-mix(in srgb, var(--st-royal) 14%, transparent), transparent 60%), var(--st-bg); }
.rl26-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(color-mix(in srgb, var(--st-accent) 16%, transparent) 1px, transparent 1.4px); background-size: 24px 24px;
  -webkit-mask-image: radial-gradient(60% 75% at 72% 40%, #000 20%, transparent 72%); mask-image: radial-gradient(60% 75% at 72% 40%, #000 20%, transparent 72%); }
.rl26-hero > * { min-width: 0; }
/* Midnight hero (the default): Royal and Green washes, white dot grid, the one place on the page that carries gradient words */
.rl26-hero[data-ground="deep"] { background: radial-gradient(820px 460px at 92% -10%, color-mix(in srgb, var(--st-royal) 55%, transparent), transparent 62%),
    radial-gradient(640px 360px at -4% 112%, color-mix(in srgb, var(--st-green) 16%, transparent), transparent 64%), var(--st-midnight); }
.rl26-hero[data-ground="deep"]::before { background-image: radial-gradient(rgba(255, 255, 255, 0.12) 1px, transparent 1.4px); }
.rl26-hero[data-ground="deep"] h1 { color: var(--st-white); }
/* gradient words: the homepage's text gradient (Royal → Aqua → Electric Green, 135°). Midnight only: Royal alone is never type on
   Midnight, so the run starts already blended; on white the aqua and green ends would fail contrast. Aqua where clip is unsupported. */
.rl26-grad { color: var(--st-aqua); }
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  [data-ground="deep"] .rl26-grad { background-image: linear-gradient(135deg, color-mix(in srgb, var(--st-royal) 55%, var(--st-aqua)) 0%, var(--st-aqua) 45%, var(--st-green) 100%);
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
}
[data-ground="light"] .rl26-grad, .rl26-hero:not([data-ground="deep"]) .rl26-grad { color: inherit; }
/* counts on Midnight: translucent chips, green figures */
.rl26-hero[data-ground="deep"] .rl26-counts a { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.22); color: var(--st-white); }
.rl26-hero[data-ground="deep"] .rl26-counts a:hover { border-color: var(--st-green); }
.rl26-hero[data-ground="deep"] .rl26-counts b { background: var(--st-green); color: var(--st-midnight); }
/* the featured card on a Midnight hero: glass, so it reads as a layer above the band */
.rl26-hero[data-ground="deep"] .rl26-feature { background: linear-gradient(160deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.03)),
    radial-gradient(70% 80% at 100% 0%, color-mix(in srgb, var(--rl-wash) calc(var(--rl-amt) * 0.6), transparent), transparent 65%);
  border: 1px solid rgba(255, 255, 255, 0.18); box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.55); }
@supports (backdrop-filter: blur(8px)) { .rl26-hero[data-ground="deep"] .rl26-feature { -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); } }
@media (min-width: 1000px) { .rl26-hero--feature { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }
.rl26-hero h1 { margin: 0 0 1.25rem; max-width: 18ch; color: var(--st-heading); }
.rl26-hero__lead { margin: 0 0 1.75rem; }
.rl26-hero__lead a { color: var(--st-link); }

/* the two counts: chips that jump to their section */
.rl26-counts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.625rem 0.75rem; }
.rl26-counts li { max-width: none; margin: 0; }
.rl26-counts a { display: inline-flex; align-items: center; gap: 0.625rem; min-height: 44px; padding: 0.25rem 1.125rem 0.25rem 0.3125rem;
  border: 1px solid var(--st-line-strong); border-radius: var(--st-radius-chip); background: var(--st-surface); color: var(--st-heading);
  font-size: var(--st-fs-small); font-weight: 700; text-decoration: none;
  transition: border-color var(--st-dur-fast) var(--st-ease), background var(--st-dur-fast) var(--st-ease); }
.rl26-counts b { display: inline-grid; place-items: center; min-width: 2.125rem; height: 2.125rem; padding: 0 0.5rem; border-radius: var(--st-radius-chip);
  background: var(--st-heading); color: var(--st-bg); font-weight: 900; font-size: 0.9375rem; }
.rl26-counts a:hover { border-color: var(--st-heading); }
.rl26-counts a:focus-visible { outline: 3px solid var(--st-focus); outline-offset: 2px; }

/* ---------- featured resource: a Midnight card ---------- */
.rl26-feature { position: relative; isolation: isolate; overflow: clip; margin: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start;
  column-gap: 1rem; padding: clamp(1.5rem, 1rem + 2vw, 2.25rem); border-radius: var(--st-radius-panel); color: var(--st-white); box-shadow: var(--st-shadow-lift);
  --rl-wash: var(--st-royal); --rl-amt: 62%;
  background: radial-gradient(70% 80% at 100% 0%, color-mix(in srgb, var(--rl-wash) var(--rl-amt), transparent), transparent 65%),
    radial-gradient(60% 70% at 0% 100%, color-mix(in srgb, var(--st-green) 18%, transparent), transparent 70%), var(--st-midnight);
  transition: transform var(--st-dur) var(--st-ease), box-shadow var(--st-dur) var(--st-ease); }
.rl26-feature::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: radial-gradient(rgba(255, 255, 255, 0.13) 1px, transparent 1.4px);
  background-size: 22px 22px; -webkit-mask-image: linear-gradient(135deg, transparent 35%, #000 90%); mask-image: linear-gradient(135deg, transparent 35%, #000 90%); }
.rl26-feature > * { min-width: 0; }
.rl26-feature p { max-width: none; }
.rl26-feature__k { grid-column: 1; margin: 0 0 1.5rem; font-size: var(--st-fs-eyebrow); font-weight: 800; letter-spacing: var(--st-tracking-eyebrow); text-transform: uppercase; color: var(--st-aqua); }
.rl26-feature__ic { grid-column: 2; grid-row: 1 / span 2; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px;
  background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.18); }
.rl26-feature__ic svg { width: 36px; height: 36px; fill: none; stroke: var(--st-white); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.rl26-feature__title { grid-column: 1 / -1; margin: 0 0 0.75rem; font-size: clamp(1.5rem, 1.15rem + 1.3vw, 2.125rem); font-weight: 900; line-height: 1.12; letter-spacing: -0.02em; color: var(--st-white); text-wrap: balance; }
.rl26-feature__title a { color: inherit; text-decoration: none; }
.rl26-feature__sum { grid-column: 1 / -1; margin: 0 0 1.5rem; font-size: 1rem; line-height: 1.6; color: #d6d3f7; }
.rl26-feature__foot { grid-column: 1 / -1; margin: 0; padding-top: 1.125rem; border-top: 1px solid rgba(255, 255, 255, 0.18); display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; }
.rl26-feature .rl26-tag { background: rgba(255, 255, 255, 0.12); color: var(--st-white); }
.rl26-feature .rl26-tag::before { background: var(--st-green); }
.rl26-feature .rl26-card__detail { color: var(--st-cloud); }
.rl26-feature .rl26-card__go { color: var(--st-white); }
.rl26-feature:hover { transform: translateY(-3px); }
.rl26-feature:hover .st-chev { background: var(--st-white); }
.rl26-feature:hover .st-chev svg { stroke: var(--st-midnight); }
.rl26-feature .rl26-card__link:focus-visible { outline-color: var(--st-aqua); }
.rl26-feature[data-tone="aqua"] { --rl-wash: var(--st-aqua); --rl-amt: 34%; }
.rl26-feature[data-tone="green"] { --rl-wash: var(--st-green); --rl-amt: 28%; }
.rl26-feature[data-tone="watermelon"] { --rl-wash: var(--st-watermelon); --rl-amt: 40%; }
.rl26-feature[data-tone="midnight"] { --rl-wash: var(--st-royal); --rl-amt: 36%; }

/* ---------- filter bar: shown by module.js; sticky under the site header on wide screens ---------- */
.rl26-filters { position: relative; z-index: 4; display: grid; gap: 0.75rem; padding-block: 1rem; padding-inline: var(--st-inline); font-family: var(--st-font);
  background: color-mix(in srgb, var(--st-bg) 94%, transparent); border-block: 1px solid var(--st-line); }
@supports (backdrop-filter: blur(8px)) { .rl26-filters { -webkit-backdrop-filter: saturate(1.4) blur(10px); backdrop-filter: saturate(1.4) blur(10px); } }
@media (min-width: 1000px) { .rl26-filters { position: sticky; top: var(--st-header-h, 0px); } }
.rl26-filters fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.rl26-filters__legend { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.rl26-filters ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.rl26-filters li { max-width: none; margin: 0; }
.rl26-chip { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; padding: 0 1rem; border: 1px solid var(--st-line-strong); border-radius: var(--st-radius-chip);
  background: var(--st-surface); color: var(--st-heading); font: 700 var(--st-fs-small)/1.2 var(--st-font); cursor: pointer;
  transition: background var(--st-dur-fast) var(--st-ease), color var(--st-dur-fast) var(--st-ease), border-color var(--st-dur-fast) var(--st-ease); }
.rl26-chip:hover { border-color: var(--st-heading); }
.rl26-chip[data-tone]::before { content: ""; width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--rl-dot, var(--st-royal)); }
.rl26-chip[data-tone="midnight"] { --rl-dot: var(--st-midnight); }
.rl26-chip[data-tone="aqua"] { --rl-dot: var(--st-aqua); }
.rl26-chip[data-tone="green"] { --rl-dot: var(--st-green); }
.rl26-chip[data-tone="watermelon"] { --rl-dot: var(--st-watermelon); }
.rl26-chip[aria-pressed="true"] { background: var(--st-midnight); border-color: var(--st-midnight); color: var(--st-white);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--st-green) 45%, transparent); }
.rl26-chip[aria-pressed="true"][data-tone="midnight"] { --rl-dot: var(--st-white); }
.rl26-chip__n { font-size: 0.75rem; font-weight: 800; color: var(--st-muted); font-variant-numeric: tabular-nums; }
.rl26-chip[aria-pressed="true"] .rl26-chip__n { color: var(--st-green); }
.rl26-chip:focus-visible, .rl26-clear:focus-visible { outline: 3px solid var(--st-focus); outline-offset: 2px; }
.rl26-filters__row { margin: 0; max-width: none; display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1rem; }
.rl26-field { position: relative; display: inline-flex; align-items: center; gap: 0.5rem; margin: 0; }
.rl26-field__l { font-size: var(--st-fs-small); font-weight: 700; color: var(--st-ink-soft); }
.rl26-field select, .rl26-field input { min-height: 44px; border: 1px solid var(--st-line-strong); border-radius: 8px; background: var(--st-surface); color: var(--st-ink);
  font: 400 0.9375rem/1.3 var(--st-font); padding: 0.5rem 0.75rem; }
.rl26-field select { padding-right: 2rem; max-width: 100%; }
.rl26-field--q { flex: 1 1 15rem; max-width: 26rem; }
.rl26-field--q input { width: 100%; padding-left: 2.5rem; -webkit-appearance: none; appearance: none; }
.rl26-field__ic { position: absolute; left: 0.8rem; top: 50%; width: 18px; height: 18px; translate: 0 -50%; fill: none; stroke: var(--st-muted); stroke-width: 2.2; stroke-linecap: round; pointer-events: none; }
.rl26-field select:focus-visible, .rl26-field input:focus-visible { outline: 3px solid var(--st-focus); outline-offset: 1px; border-color: transparent; }
.rl26-status { margin: 0; max-width: none; display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; min-height: 44px; }
.rl26-active { display: contents; }
.rl26-token { display: inline-flex; align-items: center; gap: 0.375rem; min-height: 32px; padding: 0 0.5rem 0 0.75rem; border: 1px solid var(--st-line-strong); border-radius: var(--st-radius-chip);
  background: color-mix(in srgb, var(--st-royal) 10%, var(--st-surface)); color: var(--st-heading); font: 700 0.8125rem/1.2 var(--st-font); cursor: pointer; position: relative; }
.rl26-token::after { content: ""; position: absolute; inset: -6px -2px; } /* 44 px tall hit area */
.rl26-token svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; }
.rl26-token:hover { border-color: var(--st-heading); }
.rl26-token:focus-visible { outline: 3px solid var(--st-focus); outline-offset: 2px; }
.rl26-count { font-size: var(--st-fs-small); font-weight: 700; color: var(--st-ink-soft); font-variant-numeric: tabular-nums; }
.rl26-clear { min-height: 44px; padding: 0 0.25rem; border: 0; background: none; color: var(--st-accent-ink); font: 800 var(--st-fs-small)/1.2 var(--st-font);
  text-decoration: underline; text-underline-offset: 0.2em; cursor: pointer; }
.rl26-clear:hover { color: var(--st-heading); }
@media (max-width: 639px) { .rl26-field--q { max-width: none; } }
.rl26-filters__tools { margin: 0; max-width: none; display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1.5rem; }
.rl26-filters__tools .rl26-filters__row { flex: 1 1 auto; }
.rl26-filters__tools .rl26-status { flex: 0 1 auto; }
/* Desktop: the bar shrink-wraps to the topic chips, so the format menu and search end exactly where the chips end
   (when the chips wrap, the bar is full width and the search stretches to the edge). The count and active filters
   sit on their own line underneath, so the search box never changes width while someone types. */
@media (min-width: 1000px) { .rl26-filters { grid-template-columns: fit-content(100%); }
  .rl26-filters__tools .rl26-filters__row { flex: 1 1 100%; flex-wrap: nowrap; }
  .rl26-field--q { max-width: none; }
  .rl26-filters__tools .rl26-status { flex: 1 1 100%; } }

/* ---------- sections and the card grid ---------- */
.rl26-sec { padding-block: var(--st-section); padding-inline: var(--st-inline); font-family: var(--st-font); }
.rl26-sec--download { background: var(--st-surface-2); }
@media (min-width: 1000px) { .rl26-sec .st-shead > hgroup, .rl26-sec .st-shead > .st-answer { grid-row: 1; } }
.rl26-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--st-gap-card); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .rl26-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .rl26-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rl26-grid > li { display: flex; max-width: none; margin: 0; }

.rl26-card { position: relative; flex: 1; display: flex; flex-direction: column; min-width: 0; background: var(--st-surface); border: 1px solid var(--st-line);
  border-radius: var(--st-radius-card); overflow: hidden; box-shadow: var(--st-shadow-card);
  transition: transform var(--st-dur) var(--st-ease), box-shadow var(--st-dur) var(--st-ease), border-color var(--st-dur) var(--st-ease); }
.rl26-card:hover { transform: translateY(-3px); box-shadow: var(--st-shadow-lift); border-color: var(--st-line-strong); }
.rl26-card > p, .rl26-card > h3 { max-width: none; }
/* the title link covers the card; one focus ring, on the card */
.rl26-card__link::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
@supports selector(:has(*)) {
  .rl26-card:has(.rl26-card__link:focus-visible), .rl26-feature:has(.rl26-card__link:focus-visible) { outline: 3px solid var(--st-focus); outline-offset: 3px; }
  .rl26-card__link:focus-visible { outline: none; }
  .rl26-list .rl26-card:has(.rl26-card__link:focus-visible) { outline-offset: -3px; }
}

/* the plate: drawn, not an image. Downloads on Midnight with the topic's wash; e-guides on the light ground. */
.rl26-plate { position: relative; isolation: isolate; overflow: hidden; margin: 0; display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem;
  min-height: 0; padding: 0.875rem clamp(1.25rem, 1rem + 0.6vw, 1.5rem); color: var(--st-white);
  --rl-wash: var(--st-royal); --rl-amt: 70%;
  background: radial-gradient(120% 150% at 100% 0%, color-mix(in srgb, var(--rl-wash) var(--rl-amt), transparent), transparent 62%), var(--st-midnight); }
.rl26-plate::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: radial-gradient(rgba(255, 255, 255, 0.14) 1px, transparent 1.4px);
  background-size: 18px 18px; -webkit-mask-image: linear-gradient(120deg, transparent 30%, #000 95%); mask-image: linear-gradient(120deg, transparent 30%, #000 95%); }
.rl26-plate__ic { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.18); }
.rl26-plate__ic svg { width: 30px; height: 30px; fill: none; stroke: var(--st-white); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.rl26-plate__ic svg .dot, .rl26-feature__ic svg .dot { fill: currentColor; stroke: none; }
.rl26-plate__ic, .rl26-feature__ic { color: var(--st-white); }
@media (max-width: 639px) { .rl26-plate { min-height: 0; padding-block: 0.875rem; } .rl26-plate__ic { width: 44px; height: 44px; border-radius: 12px; } .rl26-plate__ic svg { width: 26px; height: 26px; } }
[data-tone="aqua"] .rl26-plate { --rl-wash: var(--st-aqua); --rl-amt: 40%; }
[data-tone="green"] .rl26-plate { --rl-wash: var(--st-green); --rl-amt: 32%; }
[data-tone="watermelon"] .rl26-plate { --rl-wash: var(--st-watermelon); --rl-amt: 46%; }
[data-tone="midnight"] .rl26-plate { --rl-wash: var(--st-royal); --rl-amt: 30%; }
/* e-guides: a light plate, the same composition in reverse */
.rl26-card--read .rl26-plate { color: var(--st-heading); --rl-amt: 22%;
  background: radial-gradient(120% 150% at 100% 0%, color-mix(in srgb, var(--rl-wash) var(--rl-amt), transparent), transparent 62%), var(--st-surface-2); border-bottom: 1px solid var(--st-line); }
.rl26-card--read[data-tone="green"] .rl26-plate { --rl-amt: 26%; }
.rl26-card--read[data-tone="midnight"] .rl26-plate { --rl-amt: 16%; }
.rl26-card--read .rl26-plate::after { background-image: radial-gradient(color-mix(in srgb, var(--st-accent) 22%, transparent) 1px, transparent 1.4px); }
.rl26-card--read .rl26-plate__ic { background: var(--st-surface); border-color: var(--st-line); color: var(--st-accent); }
.rl26-card--read .rl26-plate__ic svg { stroke: var(--st-accent); }
/* the kind line: format, then topics */
.rl26-card__kind { margin: 1.125rem 0 0.5rem; padding-inline: clamp(1.25rem, 1rem + 0.6vw, 1.5rem); display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 0.625rem;
  font-size: 0.75rem; font-weight: 800; line-height: 1.4; letter-spacing: 0.05em; text-transform: uppercase; }
.rl26-card__type { color: var(--st-accent-ink); }
.rl26-card__topics { color: var(--st-muted); font-weight: 700; }
.rl26-card__title { margin: 0 0 0.5rem; padding-inline: clamp(1.25rem, 1rem + 0.6vw, 1.5rem); font-size: 1.125rem; font-weight: 800; line-height: 1.3; letter-spacing: -0.01em; text-wrap: balance; }
.rl26-card__title a { color: var(--st-heading); text-decoration: none; }
.rl26-card:hover .rl26-card__title a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
.rl26-card__sum { margin: 0 0 1.25rem; padding-inline: clamp(1.25rem, 1rem + 0.6vw, 1.5rem); font-size: 0.9375rem; line-height: 1.6; color: var(--st-ink-soft); }
.rl26-card__foot { margin: auto 0 0; padding: 0.875rem clamp(1.25rem, 1rem + 0.6vw, 1.5rem) 1rem; border-top: 1px solid var(--st-line);
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; }

/* access tag, fact, action */
.rl26-tag { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.25rem 0.625rem; border-radius: var(--st-radius-chip);
  font-size: 0.6875rem; font-weight: 800; line-height: 1.2; letter-spacing: 0.06em; text-transform: uppercase; color: var(--st-heading);
  background: color-mix(in srgb, var(--st-royal) 12%, transparent); }
.rl26-tag::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--st-royal); }
.rl26-tag--read { background: color-mix(in srgb, var(--st-green) 20%, transparent); }
.rl26-tag--read::before { background: color-mix(in srgb, var(--st-green) 70%, var(--st-midnight)); }
.rl26-tag--nda { background: color-mix(in srgb, var(--st-watermelon) 16%, transparent); }
.rl26-tag--nda::before { background: var(--st-watermelon); }
.rl26-card__detail { font-size: 0.8125rem; font-weight: 600; color: var(--st-muted); }
.rl26-card__go { margin-left: auto; display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; font-weight: 800; color: var(--st-accent-ink); white-space: nowrap; }
.rl26-card__go .st-chev { width: 26px; height: 26px; border-radius: 50%; background: var(--st-green); display: grid; place-items: center; flex: none; transition: background var(--st-dur-fast) var(--st-ease); }
.rl26-card__go .st-chev svg { width: 12px; height: 12px; stroke: var(--st-white); fill: none; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.rl26-card:hover .rl26-card__go .st-chev { background: var(--st-midnight); }

/* no results: one quiet panel under the bar */
.rl26-nores { padding-block: var(--st-section-half); padding-inline: var(--st-inline); font-family: var(--st-font); text-align: center; }
.rl26-nores h2 { margin: 0 0 0.5rem; font-size: var(--st-fs-h3); }
.rl26-nores p { margin: 0 auto 1.25rem; max-width: 46ch; color: var(--st-ink-soft); }
.rl26-nores .st-btn-row { justify-content: center; margin: 0 auto; }
/* ---------- downloads: an index of rows, not a wall of cards ---------- */
.rl26-list { grid-template-columns: minmax(0, 1fr) !important; gap: 0; border: 1px solid var(--st-line); border-radius: var(--st-radius-card); background: var(--st-surface);
  box-shadow: var(--st-shadow-card); overflow: hidden; }
.rl26-list > li + li { border-top: 1px solid var(--st-line); }
.rl26-row { border: 0; border-radius: 0; box-shadow: none; overflow: visible; display: grid; align-items: start;
  grid-template-columns: 2.75rem minmax(0, 1fr); grid-template-areas: "ic meta" "ic title" "ic sum" "ic foot"; column-gap: 1rem;
  padding: 1.125rem clamp(1rem, 0.75rem + 0.8vw, 1.5rem); transition: background var(--st-dur-fast) var(--st-ease); }
.rl26-row:hover { transform: none; box-shadow: none; background: color-mix(in srgb, var(--st-royal) 5%, var(--st-surface)); }
.rl26-row > * { padding-inline: 0 !important; margin-inline: 0; }
.rl26-row__ic { grid-area: ic; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 12px; color: var(--st-white);
  --rl-wash: var(--st-royal); --rl-amt: 70%;
  background: radial-gradient(120% 120% at 100% 0%, color-mix(in srgb, var(--rl-wash) var(--rl-amt), transparent), transparent 70%), var(--st-midnight); }
.rl26-row[data-tone="aqua"] .rl26-row__ic { --rl-wash: var(--st-aqua); --rl-amt: 50%; }
.rl26-row[data-tone="green"] .rl26-row__ic { --rl-wash: var(--st-green); --rl-amt: 40%; }
.rl26-row[data-tone="watermelon"] .rl26-row__ic { --rl-wash: var(--st-watermelon); --rl-amt: 55%; }
.rl26-row[data-tone="midnight"] .rl26-row__ic { --rl-wash: var(--st-royal); --rl-amt: 35%; }
.rl26-row__ic svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.rl26-row__ic svg .dot { fill: currentColor; stroke: none; }
.rl26-row .rl26-row__meta { grid-area: meta; margin: 0 0 0.25rem; }
.rl26-row .rl26-card__title { grid-area: title; margin: 0 0 0.25rem; }
.rl26-row .rl26-card__sum { grid-area: sum; margin: 0 0 0.75rem; }
.rl26-row .rl26-row__foot { grid-area: foot; margin: 0; padding: 0; border: 0; }
@media (min-width: 1000px) {
  .rl26-row { grid-template-columns: 2.75rem minmax(0, 1fr) minmax(0, 14rem) 12.5rem; grid-template-areas: "ic title meta foot" "ic sum meta foot"; column-gap: 1.5rem; padding-block: 1.25rem; }
  .rl26-row .rl26-row__meta { flex-direction: column; gap: 0.25rem; margin: 0.125rem 0 0; }
  .rl26-row .rl26-card__sum { margin: 0; }
  .rl26-row .rl26-row__foot { flex-direction: column; align-items: flex-end; justify-content: center; gap: 0.5rem; align-self: center; }
  .rl26-row .rl26-card__go { margin-left: 0; }
}

/* below 1000 px the featured card would push the library a screen down; it is the first e-guide card anyway */
@media (max-width: 999px) { .rl26-feature { display: none; } }
@media (prefers-reduced-motion: reduce) { .rl26-card:hover, .rl26-feature:hover { transform: none; } }
html[data-motion="off"] .rl26-card:hover, html[data-motion="off"] .rl26-feature:hover { transform: none; }
@media print { .rl26-filters { display: none !important; } .rl26-card, .rl26-feature { box-shadow: none; break-inside: avoid; } }