/* ForgeCRO Shortlist on the v3 system (2026-09-27). Loaded on /shortlist/ pages only.
 *
 * Built on the aso-v3.css tokens, so a section flips with .light the way the rest of the site
 * does: --white is the text colour (black on a light sheet), --grey/--grey-2 the quieter text,
 * --edge/--edge-2 the hairlines, --glass the tint. The accent colours are the only additions:
 * #ff7700 fails AA as text on white, so light sheets use #b54f00 for words and keep the orange
 * for fills.
 *
 * Every class is sl-*: aso-v3.css has bare .num / .sec-head / .chips rules that would reach
 * the v2 class names (pages3.js prefixes the report markup for the same reason).
 */
@scope (.aso-v3) {
  :scope { --sl-acc: #ff7700; --sl-up: #4ade80; --sl-down: #f87171; --sl-bg: #000; --sl-you: rgba(255, 119, 0, 0.12); }
  :scope.light { --sl-acc: #b54f00; --sl-up: #15803d; --sl-down: #b91c1c; --sl-bg: #fff; --sl-you: #fff1e4; }
  .sl-card { --sl-acc: #b54f00; --sl-bg: #fff; }

  .sl-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .sl-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }

  /* ---------- opener additions ---------- */
  /* the right column carries the search and the facts: top-align, or the H1 floats low */
  :scope.sl-op .opener-grid { align-items: start; }
  :scope.sl-op .opener-r { display: grid; gap: 1.5rem; align-content: start; }
  :scope.sl-op .opener-r > * { margin: 0; }
  :scope.sl-op .fc-facts dd small { font: 400 0.9rem/1 var(--font-body); letter-spacing: 0; color: var(--grey); }
  .sl-h1mark { display: flex; align-items: center; gap: clamp(0.9rem, 2vw, 1.4rem); }
  .sl-h1mark .sl-mark { width: clamp(44px, 5vw, 64px); height: clamp(44px, 5vw, 64px); border-radius: 14px; }
  .sl-note { font-size: var(--text-sm); color: var(--grey); max-width: 60ch; }

  .sl-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
  .sl-chips li { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.4rem 0.85rem; border: 1px solid var(--edge-2); border-radius: var(--pill); font-size: var(--text-xs); color: var(--grey); }
  .sl-chips li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--or); }

  /* ---------- brand search ---------- */
  .sl-find { display: grid; gap: 0.6rem; width: 100%; max-width: 36rem; }
  .sl-find label { font: 600 0.72rem/1.4 var(--font-body); letter-spacing: 0.14em; text-transform: uppercase; color: var(--grey); }
  .sl-find-field { position: relative; }
  .sl-find-box { display: flex; align-items: center; gap: 0.75rem; min-height: 56px; padding: 0 1.2rem; border: 1px solid var(--edge-2); border-radius: var(--pill); background: var(--glass); transition: border-color var(--dur) var(--ease); }
  .sl-find-box:focus-within { border-color: var(--white); }
  .sl-find-box svg { width: 20px; height: 20px; flex: none; color: var(--grey); }
  .sl-find-box input { flex: 1; min-width: 0; height: 54px; border: 0; background: none; color: var(--white); font: 400 var(--text-base) var(--font-body); outline: 0; -webkit-appearance: none; appearance: none; }
  .sl-find-box input::placeholder { color: var(--grey-2); opacity: 1; }
  .sl-find-box input::-webkit-search-cancel-button { filter: invert(1); }
  .sl-find-out { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 30; margin: 0; padding: 0.4rem; list-style: none; background: #fff; color: #000; border-radius: 16px; box-shadow: 0 24px 48px rgba(0, 0, 0, 0.45); max-height: 22rem; overflow: auto; }
  .sl-find-out[hidden] { display: none; }
  .sl-find-out a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 48px; padding: 0.6rem 0.9rem; border-radius: 10px; color: #000; text-decoration: none; }
  .sl-find-out a:hover, .sl-find-out a:focus-visible { background: #f2f2ef; outline: 0; }
  .sl-find-out b { font-weight: 600; }
  .sl-find-out span { font-size: var(--text-xs); color: #5c5c57; text-align: right; }
  .sl-find-none { padding: 0.8rem 0.9rem; font-size: var(--text-sm); color: #3d3d39; }
  .sl-find-none a { color: #000; text-decoration: underline; text-underline-offset: 3px; }
  .sl-find-alt { margin: 0; font-size: var(--text-sm); color: var(--grey); }
  .sl-find-alt a { color: var(--white); text-decoration: underline; text-decoration-color: var(--edge-2); text-underline-offset: 3px; }
  .sl-find-alt a:hover { text-decoration-color: currentColor; }

  /* ---------- brand marks ---------- */
  .sl-mark { display: inline-block; flex: none; width: 28px; height: 28px; border-radius: 8px; object-fit: contain; background: #fff; border: 1px solid var(--edge); vertical-align: middle; }
  .sl-mark-txt { display: inline-grid; place-items: center; background: var(--glass-2); color: var(--white); font-family: var(--font-display); font-weight: 600; line-height: 1; }

  /* ---------- industry index rows ---------- */
  .sl-inds { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--edge-2); }
  .sl-inds li { border-bottom: 1px solid var(--edge); }
  .sl-inds a { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) 7rem 1.25rem; gap: 1.5rem; align-items: center; padding: 1.6rem 0; color: inherit; text-decoration: none; }
  .sl-inds h3 { margin: 0; font: 500 var(--text-xl)/1.2 var(--font-display); letter-spacing: -0.02em; color: var(--white); }
  .sl-inds p { margin: 0.4rem 0 0; font-size: var(--text-sm); line-height: 1.5; color: var(--grey); max-width: 52ch; }
  .sl-inds-lead { display: flex; align-items: center; gap: 0.75rem; font-size: var(--text-sm); color: var(--grey); }
  .sl-inds-lead b { font-weight: 600; color: var(--white); }
  .sl-inds-meta { display: grid; gap: 0.15rem; font-size: var(--text-xs); line-height: 1.5; color: var(--grey-2); font-variant-numeric: tabular-nums; }
  .sl-inds .i { width: 1.25rem; height: 1.25rem; color: var(--white); transition: transform var(--dur) var(--ease); }
  .sl-inds a:hover h3, .sl-inds a:focus-visible h3 { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
  .sl-inds a:hover .i { transform: translateX(3px); }

  /* ---------- leaders wall: hairline grid, like the stack logos ---------- */
  .sl-wall { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--edge-2); border-left: 1px solid var(--edge-2); }
  .sl-wall li { border-right: 1px solid var(--edge-2); border-bottom: 1px solid var(--edge-2); }
  .sl-wall a { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 1rem; align-items: center; height: 100%; padding: 1.4rem 1.25rem; color: inherit; text-decoration: none; transition: background-color var(--dur) var(--ease); }
  .sl-wall a:hover, .sl-wall a:focus-visible { background: var(--glass-2); }
  .sl-wall .sl-mark { grid-row: 1 / span 2; width: 44px; height: 44px; border-radius: 12px; }
  .sl-wall b { font-weight: 600; font-size: var(--text-base); color: var(--white); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-wall span { font-size: var(--text-xs); color: var(--grey); font-variant-numeric: tabular-nums; }

  /* ---------- findings ---------- */
  .sl-finds { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
  .sl-find-card { display: grid; align-content: start; gap: 1rem; padding: clamp(1.5rem, 1rem + 1.5vw, 2.25rem); border: 1px solid var(--edge); border-radius: var(--card); background: var(--glass); }
  .sl-find-card > * { margin: 0; }
  .sl-find-card h3 { font: 500 var(--text-2xl)/1.15 var(--font-display); letter-spacing: -0.025em; color: var(--white); text-wrap: balance; }
  .sl-find-card p:not(.eyebrow) { font-size: var(--text-base); line-height: 1.55; color: var(--grey); }
  .sl-find-card p b { font-weight: 600; color: var(--white); }
  .sl-find-card .textlink { justify-self: start; }
  .sl-big { display: flex; align-items: baseline; gap: 0.6rem; font: 400 var(--text-figure)/1 var(--font-display) !important; letter-spacing: -0.04em; color: var(--white) !important; }
  .sl-big small { font: 400 var(--text-sm)/1 var(--font-body); letter-spacing: 0; color: var(--grey); }

  .sl-mini { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--edge-2); }
  .sl-mini li { display: grid; grid-template-columns: 1.75rem minmax(0, 1fr) auto; gap: 0.75rem; align-items: center; min-height: 44px; border-bottom: 1px solid var(--edge); font-size: var(--text-sm); }
  .sl-mini .n, .sl-mini .sl-mono { color: var(--grey-2); font-variant-numeric: tabular-nums; }
  .sl-mini a { color: var(--white); font-weight: 500; text-decoration: none; }
  .sl-mini a:hover { text-decoration: underline; text-underline-offset: 3px; }
  .sl-mini b { font-weight: 600; color: var(--white); font-variant-numeric: tabular-nums; }
  .sl-mini .you, .sl-mini .sl-mini-you { color: var(--grey); font-style: italic; }
  .sl-mini .you b, .sl-mini .sl-mini-you b { font-style: normal; color: var(--sl-acc); }

  .sl-pb, .sl-pb-list { display: grid; gap: 0.75rem; }
  .sl-pb div, .sl-pb-list div { display: grid; grid-template-columns: minmax(6rem, 9rem) minmax(0, 1fr) 3rem; gap: 0.9rem; align-items: center; font-size: var(--text-sm); }
  .sl-pb span, .sl-pb-list span { color: var(--grey); line-height: 1.3; }
  .sl-pb i, .sl-pb-list i { display: block; height: 8px; min-width: 4px; border-radius: 4px; background: var(--or); }
  .sl-pb i.is-avg, .sl-pb-list i.is-avg { background: var(--grey-2); }
  .sl-pb b, .sl-pb-list b { text-align: right; font-weight: 600; color: var(--white); font-variant-numeric: tabular-nums; }

  .sl-chat { display: grid; gap: 0.9rem; padding: 1.1rem 1.2rem; border: 1px solid var(--edge); border-radius: 14px; background: var(--sl-bg); font-size: var(--text-sm); }
  .sl-chat > * { margin: 0; }
  .sl-chat span { display: block; margin-bottom: 0.3rem; font: 600 0.7rem/1.3 var(--font-body); letter-spacing: 0.14em; text-transform: uppercase; color: var(--grey-2); }
  .sl-chat-q { color: var(--white) !important; font-size: var(--text-sm) !important; }
  .sl-chat-a ol { margin: 0; padding-left: 1.25rem; list-style: decimal; color: var(--white); line-height: 1.7; }
  .sl-chat-a .you { color: var(--grey); }
  .sl-chat-a .you em { font-style: normal; color: var(--sl-acc); }

  .sl-reads { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 4vw, 4rem); }
  .sl-reads > div { display: grid; gap: 1rem; align-content: start; }
  .sl-reads > div > * { margin: 0; }
  .sl-reads h3 { font: 500 var(--text-xl)/1.2 var(--font-display); letter-spacing: -0.02em; color: var(--white); }
  .sl-reads p { color: var(--grey); }

  .sl-note-box { margin-top: 1.5rem; padding: 1.1rem 1.25rem; border: 1px dashed var(--edge-2); border-radius: 14px; }
  .sl-note-box > * { margin: 0; }
  .sl-note-box p:not(.eyebrow) { margin-top: 0.4rem; font-size: var(--text-sm); color: var(--grey); max-width: 90ch; }
  .sl-note-box a { color: var(--white); text-decoration: underline; text-underline-offset: 3px; }

  .sl-more { margin-top: clamp(2.5rem, 4vw, 3.5rem); }
  .sl-more ul { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0.9rem 0 0; padding: 0; list-style: none; }
  .sl-more a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 1.1rem; border: 1px solid var(--edge-2); border-radius: var(--pill); font-size: var(--text-sm); color: var(--white); text-decoration: none; transition: border-color var(--dur) var(--ease); }
  .sl-more a:hover, .sl-more a:focus-visible { border-color: var(--white); }
  .sl-after { margin: 2rem 0 0; }

  /* ---------- leaderboard ---------- */
  .sl-lbw, .sl-lb-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-top: 1px solid var(--edge-2); }
  .sl-lb { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }
  .sl-lb th { padding: 0.85rem 0.75rem; text-align: left; font: 600 0.7rem/1.3 var(--font-body); letter-spacing: 0.14em; text-transform: uppercase; color: var(--grey-2); border-bottom: 1px solid var(--edge-2); white-space: nowrap; }
  .sl-lb td { padding: 0.35rem 0.75rem; border-bottom: 1px solid var(--edge); vertical-align: middle; color: var(--white); }
  .sl-lb th:first-child, .sl-lb td:first-child { padding-left: 0.25rem; }
  .sl-lb .sl-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .sl-lb .sl-rank { width: 3.5rem; color: var(--grey-2); font-variant-numeric: tabular-nums; }
  .sl-lb .sl-score { font: 500 1.05rem/1 var(--font-display); letter-spacing: -0.01em; }
  .sl-brand { display: inline-flex; align-items: center; gap: 0.75rem; min-height: 48px; color: var(--white); font-weight: 500; text-decoration: none; }
  .sl-brand:hover span, .sl-brand:focus-visible span { text-decoration: underline; text-underline-offset: 3px; }
  .sl-lb tr.is-you td { background: var(--sl-you); }
  .sl-lb tr.is-you td:first-child { box-shadow: inset 3px 0 0 var(--or); }
  .sl-mv { font-size: var(--text-xs); color: var(--grey-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
  .sl-mv-up { color: var(--sl-up); }
  .sl-mv-down { color: var(--sl-down); }
  .sl-mv-new { color: var(--sl-acc); font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
  .sl-pbars { display: flex; align-items: flex-end; gap: 4px; width: 5.5rem; height: 1.5rem; }
  .sl-pbars span { flex: 1; height: 100%; display: flex; align-items: flex-end; background: var(--glass-2); border-radius: 3px; overflow: hidden; }
  .sl-pbars i { display: block; width: 100%; background: var(--or); }

  /* report tables: question rows and the named-instead tags */
  .sl-lb-q td { padding-block: 0.9rem; line-height: 1.5; }
  .sl-lb-q td:first-child { min-width: 16rem; }
  .sl-qtag { display: inline-flex; align-items: center; gap: 0.4rem; margin: 0.15rem 0.2rem 0.15rem 0; padding: 0.25rem 0.65rem; border: 1px solid var(--edge-2); border-radius: var(--pill); font-size: var(--text-xs); color: var(--white); white-space: nowrap; }
  .sl-qtag i { font-style: normal; color: var(--grey-2); font-variant-numeric: tabular-nums; }
  .sl-qtag-off { color: var(--grey); border-style: dashed; }
  .sl-qtag-none { color: var(--grey-2); border-style: dashed; }

  /* ---------- the report unlock: dark intro, the aqsashahzad white card ---------- */
  /* phones get the card straight after the heading, the list after the card */
  .sl-unlock-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 36rem); grid-template-areas: "l card" "list card"; grid-template-rows: auto 1fr; gap: 1.5rem clamp(2rem, 5vw, 5rem); align-items: start; }
  .sl-unlock-l { grid-area: l; }
  .sl-unlock-grid > .sl-card { grid-area: card; }
  .sl-unlock-grid > .sl-ticks { grid-area: list; }
  .sl-unlock-l { display: grid; gap: 1.25rem; align-content: start; }
  .sl-unlock-l > * { margin: 0; }
  .sl-unlock-l h2 { font: 400 var(--text-3xl)/1.05 var(--font-display); letter-spacing: -0.03em; color: var(--white); max-width: 18ch; text-wrap: balance; }
  .sl-unlock-l .sub { font-size: var(--text-lg); line-height: 1.55; color: var(--grey); max-width: 46ch; }
  .sl-ticks { display: grid; gap: 0; margin: 0.5rem 0 0; padding: 0; list-style: none; border-top: 1px solid var(--edge); }
  .sl-ticks li { display: grid; grid-template-columns: 1.1rem minmax(0, 1fr); gap: 0.8rem; align-items: baseline; padding: 0.85rem 0; border-bottom: 1px solid var(--edge); color: var(--white); }
  .sl-ticks li::before { content: ""; width: 0.55rem; height: 0.55rem; border-radius: 50%; background: var(--or); transform: translateY(-0.05rem); }
  .sl-card.aso-contact-card { position: static; margin: 0 !important; max-width: none !important; }
  .sl-form .cform__send { margin-top: 0.25rem; }

  .sl-badge { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 36rem); gap: clamp(2rem, 5vw, 5rem); align-items: center; margin-top: clamp(3rem, 5vw, 4.5rem); padding-top: clamp(2rem, 4vw, 3rem); border-top: 1px solid var(--edge); }
  .sl-badge > div { display: grid; gap: 0.75rem; }
  .sl-badge > div > * { margin: 0; }
  .sl-badge h3 { font: 500 var(--text-2xl)/1.15 var(--font-display); letter-spacing: -0.025em; color: var(--white); }
  .sl-badge p:not(.eyebrow) { color: var(--grey); max-width: 46ch; }
  .sl-badge-demo { justify-items: start; }
  .sl-badge-demo img { display: block; max-width: 100%; height: auto; }
  .sl-badge-demo label { display: grid; gap: 0.45rem; width: 100%; }
  .sl-badge-demo label span { font: 600 0.7rem/1.3 var(--font-body); letter-spacing: 0.14em; text-transform: uppercase; color: var(--grey-2); }
  .sl-badge-demo textarea { width: 100%; box-sizing: border-box; padding: 0.75rem 0.9rem; border: 1px solid var(--edge-2); border-radius: 10px; background: var(--glass); color: var(--grey); font: 400 0.78rem/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; resize: vertical; }
  .sl-badge-demo textarea:focus-visible { outline: 2px solid var(--white); outline-offset: 1px; }

  /* ---------- gated reports: the v2 markup, prefixed by pages3.js ---------- */
  .sl-sec-head { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 1rem clamp(2rem, 4vw, 4rem); align-items: end; margin: 0 0 2rem !important; }
  .sl-sec-head > div > * { margin: 0; }
  .sl-sec-head h2 { margin-top: 0.5rem; font: 400 var(--text-3xl)/1.05 var(--font-display); letter-spacing: -0.03em; color: var(--white); text-wrap: balance; }
  .sl-sec-head > p { margin: 0; color: var(--grey); max-width: 50ch; }
  .sl-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--edge-2); border-left: 1px solid var(--edge-2); }
  .sl-tile { display: grid; gap: 0.5rem; align-content: start; padding: 1.4rem 1.25rem; border-right: 1px solid var(--edge-2); border-bottom: 1px solid var(--edge-2); }
  .sl-tile b { font: 400 clamp(1.6rem, 1.2rem + 1.4vw, 2.4rem)/1 var(--font-display); letter-spacing: -0.03em; color: var(--white); overflow-wrap: anywhere; }
  .sl-tile small { font-size: var(--text-xs); color: var(--grey); }
  .sl-aside-note { margin-top: 1.25rem; padding: 1.1rem 1.25rem; border: 1px dashed var(--edge-2); border-radius: 14px; color: var(--grey); }
  .sl-reads p[style], .sl-reads [style*="color"] { color: var(--grey) !important; }
  .sl-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--edge-2); }
  .sl-step { display: grid; gap: 0.6rem; align-content: start; padding: 1.5rem 1.25rem 1.5rem 0; }
  .sl-step + .sl-step { padding-left: 1.25rem; border-left: 1px solid var(--edge); }
  .sl-step > * { margin: 0; }
  .sl-step-n { font: 400 var(--text-2xl)/1 var(--font-display); color: var(--sl-acc); }
  .sl-step-t { font: 500 var(--text-lg)/1.25 var(--font-display); color: var(--white); }
  .sl-step p { font-size: var(--text-sm); line-height: 1.55; color: var(--grey); }
  .sl-mono { font-variant-numeric: tabular-nums; }

  /* ---------- responsive ---------- */
  @media (max-width: 1100px) {
    .sl-wall { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }
  @media (max-width: 960px) {
    .sl-unlock-grid { grid-template-columns: 1fr; grid-template-areas: "l" "card" "list"; grid-template-rows: auto; }
    .sl-badge { grid-template-columns: 1fr; }
    .sl-reads { grid-template-columns: 1fr; }
    .sl-finds { grid-template-columns: 1fr; }
    .sl-tiles, .sl-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sl-step + .sl-step { border-left: 0; padding-left: 0; }
    .sl-steps .sl-step:nth-child(even) { padding-left: 1.25rem; border-left: 1px solid var(--edge); }
    .sl-sec-head { grid-template-columns: 1fr; align-items: start; }
  }
  @media (max-width: 760px) {
    .sl-inds a { grid-template-columns: minmax(0, 1fr) 1.25rem; gap: 0.75rem 1rem; padding: 1.4rem 0; }
    .sl-inds-name { grid-column: 1; }
    .sl-inds .i { grid-column: 2; grid-row: 1; align-self: start; margin-top: 0.3rem; }
    .sl-inds-lead, .sl-inds-meta { grid-column: 1 / -1; }
    .sl-inds-meta { display: flex; gap: 1rem; }
    .sl-wall { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sl-wall a { grid-template-columns: 1fr; grid-template-rows: auto; row-gap: 0.4rem; padding: 1.1rem; }
    .sl-wall .sl-mark { grid-row: auto; width: 40px; height: 40px; }
    .sl-hide-sm { display: none; }
    .sl-lb td, .sl-lb th { padding-inline: 0.5rem; }
    .sl-lb .sl-rank { width: 2.5rem; }
    .sl-pb div, .sl-pb-list div { grid-template-columns: minmax(5rem, 7rem) minmax(0, 1fr) 2.75rem; gap: 0.6rem; }
  }
  /* report question tables stack on phones; the two numeric columns get their labels back */
  @media (max-width: 640px) {
    .sl-lb-q { min-width: 0 !important; }
    .sl-lb-q thead { display: none; }
    .sl-lb-q tr { display: block; padding: 0.9rem 0; border-bottom: 1px solid var(--edge); }
    .sl-lb-q td { display: block; padding: 0.15rem 0 !important; border: 0; text-align: left !important; }
    .sl-lb-q td:first-child { min-width: 0; padding-bottom: 0.5rem !important; font-weight: 500; }
    .sl-lb-q td:nth-child(2):not(:last-child)::before { content: "Answers "; color: var(--grey-2); }
    .sl-lb-q td:nth-child(3)::before { content: "Avg position "; color: var(--grey-2); }
  }
  @media (max-width: 480px) {
    .sl-tiles, .sl-steps { grid-template-columns: 1fr; }
    .sl-steps .sl-step:nth-child(even) { padding-left: 0; border-left: 0; }
    .sl-step { border-bottom: 1px solid var(--edge); }
  }
}

/* The report tables stay readable when a question is long: the question column wraps, the tag
   column scrolls with the table. Outside @scope because it keys on the element alone. */
.sl-lb-q { min-width: 36rem; }
@media (prefers-reduced-motion: reduce) {
  .sl-inds .i, .sl-wall a, .sl-more a, .sl-find-box { transition: none !important; }
}