/* =====================================================================
   Ref Nav (References Navigator) — standalone styles.
   Everything is scoped to .rn-root (the panel + export pop-up, appended to <body>) and .rn-btn
   (the trigger). Light and dark: data-rn-theme on .rn-root (set from <html data-theme> or the OS).
   Customize with the tokens below, or RefNav.config({accent:'#…'}).
   ===================================================================== */
.rn-root, .rn-btn {
  --rn-acc: #2f63e0;
  --rn-fs-3xs: 10px; --rn-fs-2xs: 11px; --rn-fs-xs: 12.5px; --rn-fs-sm: 14px; --rn-fs-md: 15.5px; --rn-fs-lg: 19px;
  --rn-font: var(--f-body, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
  --rn-font-head: var(--f-head, var(--rn-font));
  --rn-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.rn-root {
  --rn-ground: #f3f5f9;     /* panel chrome */
  --rn-paper: #ffffff;      /* the list surface */
  --rn-ink: #172033;
  --rn-mut: #5d6679;
  --rn-faint: #8a93a6;
  --rn-line: #e1e6ef;
  --rn-line2: #cfd6e3;
  --rn-chip: #e8ecf3;
  --rn-hover: color-mix(in srgb, var(--rn-acc) 6%, transparent);
  --rn-sel: color-mix(in srgb, var(--rn-acc) 9%, transparent);
  --rn-shadow: 0 30px 80px -20px rgba(8, 14, 30, .45), 0 2px 10px rgba(8, 14, 30, .18);
  --rn-free-bg: #dcfce7; --rn-free: #166534; --rn-paid-bg: #fee2e2; --rn-paid: #991b1b;
  --rn-against: #c0262d;
  --rn-z: 300; --rn-z-fp: 1000; --rn-z-x: 1100;
  font-family: var(--rn-font);
  color: var(--rn-ink);
  color-scheme: light;
}
.rn-root[data-rn-theme="dark"] {
  --rn-ground: #161a24;
  --rn-paper: #1c212d;
  --rn-ink: #e9ecf4;
  --rn-mut: #a7afc2;
  --rn-faint: #7d869b;
  --rn-line: rgba(255, 255, 255, .09);
  --rn-line2: rgba(255, 255, 255, .16);
  --rn-chip: rgba(255, 255, 255, .08);
  --rn-hover: color-mix(in srgb, var(--rn-acc) 12%, transparent);
  --rn-sel: color-mix(in srgb, var(--rn-acc) 18%, transparent);
  --rn-shadow: 0 30px 90px -20px rgba(0, 0, 0, .8), 0 0 0 1px rgba(255, 255, 255, .06);
  --rn-free-bg: rgba(34, 197, 94, .16); --rn-free: #86efac; --rn-paid-bg: rgba(248, 113, 113, .16); --rn-paid: #fca5a5;
  --rn-against: #f87171;
  --rn-acc: #6f9bff;
  color-scheme: dark;
}
.rn-root *, .rn-root *::before, .rn-root *::after { box-sizing: border-box; }
.rn-root svg { width: 1em; height: 1em; fill: currentColor; flex: none; }
.rn-root [hidden] { display: none !important; }
.rn-root button { font-family: inherit; }

/* ── Panel (floating) ─────────────────────────────────────────────── */
.rn-panel {
  display: none;
  position: fixed;
  z-index: var(--rn-z);
  flex-direction: column;
  min-width: 380px; min-height: 340px; max-width: 96vw; max-height: 96vh;
  background: var(--rn-ground);
  border: 1px solid var(--rn-line2);
  border-radius: 12px;
  box-shadow: var(--rn-shadow);
  overflow: hidden;
  resize: both;
  outline: none;
  text-align: left;
  line-height: 1.4;
}
.rn-root.is-open .rn-panel { display: flex; }
.rn-panel.rn-anim { animation: rn-in .18s cubic-bezier(.2, .85, .25, 1); }
@keyframes rn-in { from { opacity: 0; transform: translateY(10px) scale(.985); } }
.rn--dragging .rn-panel { user-select: none; }
.rn--dragging .rn-body { pointer-events: none; }

/* header: controls row on top, title below; doubles as the drag handle */
.rn-head { flex: none; padding: 6px 10px 10px 14px; cursor: move; user-select: none; touch-action: none; }
.rn-ctrls { display: flex; justify-content: flex-end; gap: 2px; min-height: 28px; }
.rn-ib {
  display: inline-grid; place-items: center; width: 32px; height: 28px; padding: 0;
  border: 0; border-radius: 7px; background: transparent; color: var(--rn-mut);
  font-size: 15px; cursor: pointer; transition: background .12s, color .12s;
}
.rn-ib:hover { background: var(--rn-chip); color: var(--rn-ink); }
.rn-ib:focus-visible { outline: 2px solid var(--rn-acc); outline-offset: 1px; }
.rn-ib[aria-pressed="true"] { color: var(--rn-acc); background: var(--rn-sel); }
.rn-close { font-size: 16px; }
.rn-title {
  display: flex; align-items: center; gap: 9px; margin: 0; padding: 0 2px;
  font: 700 var(--rn-fs-lg)/1.25 var(--rn-font-head); letter-spacing: -.01em; color: var(--rn-ink);
}
.rn-title-ic { display: inline-flex; color: var(--rn-acc); font-size: 1.05em; }

/* For / Against tabs */
.rn-tabs { display: flex; flex: none; border-bottom: 1px solid var(--rn-line); }
.rn-tab {
  flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 9px 10px; border: 0; border-bottom: 2px solid transparent; background: transparent;
  font-size: var(--rn-fs-sm); font-weight: 600; color: var(--rn-mut); cursor: pointer;
  transition: color .12s, background .12s, border-color .12s;
}
.rn-tab svg { font-size: .95em; opacity: .8; }
.rn-tab:hover { background: var(--rn-hover); }
.rn-tab.is-active { color: var(--rn-acc); border-bottom-color: var(--rn-acc); background: var(--rn-paper); }
.rn-tab[data-stance="against"].is-active { color: var(--rn-against); border-bottom-color: var(--rn-against); }
.rn-tab-n {
  display: inline-grid; place-items: center; min-width: 1.5em; height: 1.5em; padding: 0 .35em;
  font-size: var(--rn-fs-3xs); border-radius: 99px; background: var(--rn-chip); color: var(--rn-ink);
  font-variant-numeric: tabular-nums;
}
.rn-tab.is-active .rn-tab-n { background: var(--rn-acc); color: #fff; }
.rn-tab[data-stance="against"].is-active .rn-tab-n { background: var(--rn-against); }

/* ── Year range ──────────────────────────────────────────────────── */
.rn-year {
  --rn-bar-h: 16px; --rn-thumb-h: 22px; --rn-thumb-w: 10px;
  display: flex; align-items: center; gap: 10px; flex: none; margin: 10px 14px 0;
  font-size: var(--rn-fs-xs); color: var(--rn-mut);
}
.rn-year-lbl { font-weight: 600; }
.rn-year-track { position: relative; flex: 1 1 160px; min-width: 120px; max-width: 260px; height: var(--rn-bar-h); }
.rn-year-hist {
  position: absolute; inset: 0; z-index: 1; display: flex; align-items: flex-end; gap: 1px;
  border: 1px solid var(--rn-line2); border-radius: 4px; background: var(--rn-chip); overflow: hidden;
}
.rn-bar {
  flex: 1 1 0; min-width: 1px; border-radius: 2px 2px 0 0;
  background: linear-gradient(180deg, color-mix(in srgb, var(--rn-acc) 70%, #fff), var(--rn-acc));
  opacity: .8; transition: opacity .12s;
}
.rn-bar.is-out { opacity: .14; }
.rn-year-sel {
  position: absolute; top: 0; bottom: 0; z-index: 2; pointer-events: none;
  background: color-mix(in srgb, var(--rn-acc) 10%, transparent);
  border-left: 1px solid color-mix(in srgb, var(--rn-acc) 50%, transparent);
  border-right: 1px solid color-mix(in srgb, var(--rn-acc) 50%, transparent);
}
.rn-year-in {
  position: absolute; z-index: 3; top: 50%; left: calc(var(--rn-thumb-w) / -2); width: calc(100% + var(--rn-thumb-w));
  height: var(--rn-thumb-h); margin: 0; transform: translateY(-50%);
  background: transparent; -webkit-appearance: none; appearance: none; pointer-events: none;
}
.rn-year-in:focus { outline: none; }
.rn-year-in::-webkit-slider-runnable-track { background: transparent; height: var(--rn-thumb-h); }
.rn-year-in::-moz-range-track { background: transparent; height: var(--rn-thumb-h); }
.rn-year-in::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; pointer-events: auto; cursor: ew-resize;
  width: var(--rn-thumb-w); height: var(--rn-thumb-h); border-radius: 3px;
  border: 1.5px solid var(--rn-acc); background: var(--rn-paper); box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
}
.rn-year-in::-moz-range-thumb {
  pointer-events: auto; cursor: ew-resize; box-sizing: border-box;
  width: var(--rn-thumb-w); height: var(--rn-thumb-h); border-radius: 3px;
  border: 1.5px solid var(--rn-acc); background: var(--rn-paper); box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
}
.rn-year-in:focus-visible::-webkit-slider-thumb { outline: 2px solid var(--rn-acc); outline-offset: 1px; }
.rn-year-in:focus-visible::-moz-range-thumb { outline: 2px solid var(--rn-acc); outline-offset: 1px; }
/* a handle that is narrowing the list is coloured, so "this filter is on" reads without the numbers */
.rn-year.is-min-active .rn-year-lo-in::-webkit-slider-thumb,
.rn-year.is-max-active .rn-year-hi-in::-webkit-slider-thumb { border-color: var(--rn-against); background: var(--rn-paid-bg); }
.rn-year.is-min-active .rn-year-lo-in::-moz-range-thumb,
.rn-year.is-max-active .rn-year-hi-in::-moz-range-thumb { border-color: var(--rn-against); background: var(--rn-paid-bg); }
.rn-year.is-min-active .rn-year-lo, .rn-year.is-max-active .rn-year-hi { color: var(--rn-against); }
.rn-year-val { white-space: nowrap; font-weight: 700; color: var(--rn-ink); font-variant-numeric: tabular-nums; }
.rn-year-dash { opacity: .55; padding: 0 .15em; }
.rn-year-reset {
  padding: 3px 8px; font-size: var(--rn-fs-3xs); font-weight: 700; color: var(--rn-mut);
  background: var(--rn-paper); border: 1px solid var(--rn-line2); border-radius: 5px; cursor: pointer;
}
.rn-year-reset:hover { color: var(--rn-acc); border-color: var(--rn-acc); }

/* ── Study-type chips (segmented) ────────────────────────────────── */
/* pills that wrap, so every type stays visible however many there are */
.rn-types { display: flex; flex-wrap: wrap; gap: 5px; flex: none; margin: 10px 14px 0; max-height: 7.5em; overflow-y: auto; scrollbar-width: thin; }
.rn-chip {
  display: inline-flex; align-items: center; gap: 5px; flex: none; padding: 3px 10px;
  border: 1px solid var(--rn-line2); border-radius: 99px; background: var(--rn-paper); white-space: nowrap;
  font-size: var(--rn-fs-xs); font-weight: 600; color: var(--rn-mut); cursor: pointer;
  transition: background .12s, color .12s, border-color .12s;
}
.rn-chip:hover { border-color: var(--rn-acc); color: var(--rn-ink); }
.rn-chip:focus-visible { outline: 2px solid var(--rn-acc); outline-offset: 1px; }
.rn-chip.is-active { background: var(--rn-acc); border-color: var(--rn-acc); color: #fff; }
.rn-chip-n { font-size: var(--rn-fs-3xs); opacity: .78; font-variant-numeric: tabular-nums; }

/* ── Sort row ────────────────────────────────────────────────────── */
.rn-sort { display: flex; align-items: center; gap: 8px; flex: none; margin: 9px 14px 8px; font-size: var(--rn-fs-xs); color: var(--rn-mut); }
.rn-sort-lbl { font-weight: 600; }
.rn-select {
  padding: 4px 8px; font: inherit; font-size: var(--rn-fs-xs); color: var(--rn-ink);
  background: var(--rn-paper); border: 1px solid var(--rn-line2); border-radius: 6px; cursor: pointer;
}
.rn-select:focus-visible { outline: 2px solid var(--rn-acc); outline-offset: 1px; }
.rn-shown { margin-left: auto; font-size: var(--rn-fs-2xs); color: var(--rn-faint); font-variant-numeric: tabular-nums; }

/* ── The list ────────────────────────────────────────────────────── */
.rn-body { flex: 1 1 auto; min-height: 0; overflow: hidden; display: flex; border-top: 1px solid var(--rn-line); background: var(--rn-paper); }
.rn-split { flex: 1 1 auto; min-width: 0; display: flex; }
.rn-list-wrap { flex: 1 1 auto; min-width: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.rn-list { display: flex; flex-direction: column; }
.rn-ref { position: relative; padding: 11px 16px 11px; border-bottom: 1px solid var(--rn-line); transition: background .12s; }
.rn-ref:hover { background: var(--rn-hover); }
.rn-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-bottom: 5px; }
.rn-year-pill, .rn-type, .rn-acc {
  font-size: var(--rn-fs-2xs); font-weight: 700; line-height: 1.45; padding: 1px 6px; border-radius: 4px; white-space: nowrap;
}
.rn-year-pill { background: var(--rn-chip); color: var(--rn-ink); font-variant-numeric: tabular-nums; }
.rn-type { font-weight: 600; background: var(--rn-chip); color: var(--rn-ink); text-transform: capitalize; }
.rn-acc.is-free { background: var(--rn-free-bg); color: var(--rn-free); }
.rn-acc.is-paid { background: var(--rn-paid-bg); color: var(--rn-paid); min-width: 1.6em; text-align: center; }
.rn-journal { font-size: var(--rn-fs-xs); font-style: italic; color: var(--rn-mut); }
/* study-type colours (light) */
.rn-type[data-t="rct"], .rn-type[data-t="clinical-trial"], .rn-type[data-t="randomized-controlled-trial"] { background: #dcfce7; color: #166534; }
.rn-type[data-t="meta-analysis"], .rn-type[data-t="systematic-review"] { background: #dbeafe; color: #1e40af; }
.rn-type[data-t="review"] { background: #ede9fe; color: #5b21b6; }
.rn-type[data-t="animal-study"], .rn-type[data-t="animal"], .rn-type[data-t="in-vivo"] { background: #fef3c7; color: #92400e; }
.rn-type[data-t="in-vitro"] { background: #fae8ff; color: #86198f; }
.rn-type[data-t="observational"], .rn-type[data-t="cohort-study"] { background: #ffedd5; color: #9a3412; }
.rn-type[data-t="research-article"] { background: #e0f2fe; color: #075985; }
/* …and dark */
[data-rn-theme="dark"] .rn-type[data-t="rct"], [data-rn-theme="dark"] .rn-type[data-t="clinical-trial"], [data-rn-theme="dark"] .rn-type[data-t="randomized-controlled-trial"] { background: rgba(34,197,94,.16); color: #86efac; }
[data-rn-theme="dark"] .rn-type[data-t="meta-analysis"], [data-rn-theme="dark"] .rn-type[data-t="systematic-review"] { background: rgba(59,130,246,.18); color: #93c5fd; }
[data-rn-theme="dark"] .rn-type[data-t="review"] { background: rgba(139,92,246,.2); color: #c4b5fd; }
[data-rn-theme="dark"] .rn-type[data-t="animal-study"], [data-rn-theme="dark"] .rn-type[data-t="animal"], [data-rn-theme="dark"] .rn-type[data-t="in-vivo"] { background: rgba(245,158,11,.17); color: #fcd34d; }
[data-rn-theme="dark"] .rn-type[data-t="in-vitro"] { background: rgba(217,70,239,.17); color: #f0abfc; }
[data-rn-theme="dark"] .rn-type[data-t="observational"], [data-rn-theme="dark"] .rn-type[data-t="cohort-study"] { background: rgba(249,115,22,.17); color: #fdba74; }
[data-rn-theme="dark"] .rn-type[data-t="research-article"] { background: rgba(14,165,233,.17); color: #7dd3fc; }

.rn-ref-title { font-size: var(--rn-fs-sm); line-height: 1.4; color: var(--rn-ink); margin-bottom: 3px; }
.rn-authors { font-size: var(--rn-fs-2xs); color: var(--rn-faint); margin-bottom: 6px; }
.rn-note {
  margin: 2px 0 7px; padding: 5px 8px; border-left: 3px solid var(--rn-against); border-radius: 0 5px 5px 0;
  font-size: var(--rn-fs-xs); line-height: 1.4; color: var(--rn-against); background: var(--rn-paid-bg);
}
.rn-strength { font-size: var(--rn-fs-3xs); font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.rn-links { display: flex; flex-wrap: wrap; gap: 12px; }
.rn-link { font-size: var(--rn-fs-2xs); font-weight: 700; color: var(--rn-mut); text-decoration: none; padding: 1px 0; }
.rn-link:hover, .rn-link:focus-visible { color: var(--rn-acc); text-decoration: underline; text-underline-offset: 2px; }
.rn-link.is-free { color: var(--rn-free); }
.rn-empty { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 34px 16px; font-size: var(--rn-fs-sm); font-style: italic; color: var(--rn-mut); }

/* ── Full page ───────────────────────────────────────────────────── */
html.rn-fullpage, html.rn-fullpage body { overflow: hidden !important; }
.rn--fp .rn-panel {
  inset: 0 !important; width: auto !important; height: auto !important;
  max-width: none; max-height: none; min-width: 0; min-height: 0;
  z-index: var(--rn-z-fp); border: 0; border-radius: 0; box-shadow: none; resize: none;
}
.rn--fp .rn-panel.rn-anim { animation: rn-fp-in .16s ease-out; }
@keyframes rn-fp-in { from { opacity: 0; } }
.rn--fp .rn-head { cursor: default; padding: 8px 18px 12px 22px; }
.rn--fp .rn-title { font-size: calc(var(--rn-fs-lg) + 3px); }
.rn--fp .rn-ib { width: 36px; height: 32px; font-size: 16px; }
.rn-root { --rn-fp-left: 44%; }
.rn--fp .rn-tabs, .rn--fp .rn-body { width: var(--rn-fp-left); }
.rn--fp .rn-year, .rn--fp .rn-sort { width: calc(var(--rn-fp-left) - 44px); margin-left: 22px; margin-right: 22px; }
.rn--fp .rn-types { margin-left: 22px; max-width: calc(var(--rn-fp-left) - 44px); }
.rn--fp .rn-year-track { max-width: none; }
.rn--fp .rn-ref { padding-left: 22px; padding-right: 22px; }
.rn--fp .rn-ref[data-id] { cursor: pointer; }
.rn--fp .rn-ref[data-id]:hover .rn-ref-title { color: var(--rn-acc); }
.rn--fp .rn-ref.is-selected { background: var(--rn-sel); box-shadow: inset 3px 0 0 var(--rn-acc); }

/* the abstract pane: full page only, starts under the header so the divider runs full height */
.rn-abs { display: none; }
.rn--fp .rn-abs {
  display: block; position: absolute; top: var(--rn-fp-head, 80px); right: 0; bottom: 0;
  width: calc(100% - var(--rn-fp-left)); overflow-y: auto; overscroll-behavior: contain;
  border-left: 1px solid var(--rn-line);
}
.rn-abs-in { padding: 18px 28px 40px; max-width: 74ch; }
.rn-abs-head { padding-bottom: 12px; margin-bottom: 14px; border-bottom: 1px solid var(--rn-line); }
.rn-abs-title { margin: 8px 0 6px; font: 700 calc(var(--rn-fs-lg) + 1px)/1.3 var(--rn-font-head); letter-spacing: -.01em; color: var(--rn-ink); }
.rn-abs-au { font-size: var(--rn-fs-xs); color: var(--rn-mut); margin-bottom: 8px; }
.rn-abs-sec { margin: 16px 0 4px; font-size: var(--rn-fs-2xs); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--rn-acc); }
.rn-abs-sec:first-child { margin-top: 0; }
.rn-abs-text p { margin: 0 0 11px; font-size: var(--rn-fs-md); line-height: 1.62; color: var(--rn-ink); }
.rn-abs-idle, .rn-abs-loading, .rn-abs-none { display: flex; align-items: center; gap: 8px; padding: 22px 0; font-size: var(--rn-fs-sm); color: var(--rn-mut); }
.rn-abs-idle { font-style: italic; }
.rn-spin { width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--rn-line2); border-top-color: var(--rn-acc); animation: rn-spin .7s linear infinite; }
@keyframes rn-spin { to { transform: rotate(360deg); } }

/* ── Export pop-up ───────────────────────────────────────────────── */
.rn-xp { position: fixed; inset: 0; z-index: var(--rn-z-x); display: flex; align-items: center; justify-content: center; padding: 24px; }
.rn-xp-bk { position: absolute; inset: 0; background: rgba(6, 10, 22, .5); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.rn-xp-card {
  position: relative; width: min(820px, 100%); max-height: calc(100vh - 48px); display: flex; flex-direction: column;
  background: var(--rn-ground); border: 1px solid var(--rn-line2); border-radius: 14px; box-shadow: var(--rn-shadow);
  animation: rn-in .16s ease-out; overflow: hidden;
}
.rn-xp-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 12px 12px 20px; border-bottom: 1px solid var(--rn-line); }
.rn-xp-body { padding: 16px 20px 20px; overflow: auto; }
.rn-x-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 11px; }
.rn-x-lbl { min-width: 4.6rem; font-size: var(--rn-fs-sm); font-weight: 600; color: var(--rn-mut); }
.rn-x-count { margin-left: auto; font-size: var(--rn-fs-xs); color: var(--rn-mut); font-variant-numeric: tabular-nums; }
.rn-seg { display: flex; border: 1px solid var(--rn-line2); border-radius: 8px; background: var(--rn-chip); overflow: hidden; }
.rn-seg-b {
  padding: 6px 15px; border: 0; border-right: 1px solid var(--rn-line2); background: transparent;
  font-size: var(--rn-fs-xs); font-weight: 600; color: var(--rn-mut); cursor: pointer;
}
.rn-seg-b:last-child { border-right: 0; }
.rn-seg-b:hover { background: var(--rn-hover); color: var(--rn-ink); }
.rn-seg-b.is-active { background: var(--rn-acc); color: #fff; }
.rn-seg-b:focus-visible { outline: 2px solid var(--rn-acc); outline-offset: -2px; }
.rn-x-bar { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin: 4px 0 7px; }
.rn-x-status { margin-right: auto; font-size: var(--rn-fs-sm); color: var(--rn-free); }
.rn-pbtn {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; font-size: var(--rn-fs-xs); font-weight: 700;
  color: var(--rn-ink); background: var(--rn-paper); border: 1px solid var(--rn-line2); border-radius: 7px; cursor: pointer;
}
.rn-pbtn:hover:not(:disabled) { border-color: var(--rn-acc); color: var(--rn-acc); }
.rn-pbtn:disabled { opacity: .45; cursor: default; }
.rn-x-out {
  display: block; width: 100%; min-height: 260px; height: 46vh; margin: 0; padding: 12px;
  font: var(--rn-fs-xs)/1.5 var(--rn-mono); white-space: pre; overflow: auto; resize: vertical;
  color: var(--rn-ink); background: var(--rn-paper); border: 1px solid var(--rn-line2); border-radius: 8px;
}
.rn-x-out.is-wrap { white-space: pre-wrap; }

/* ── Trigger button ──────────────────────────────────────────────── */
.rn-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px;
  font: 700 var(--rn-fs-xs)/1.3 var(--rn-font); color: var(--rn-acc); text-decoration: none;
  background: color-mix(in srgb, var(--rn-acc) 7%, transparent);
  border: 1px solid color-mix(in srgb, var(--rn-acc) 35%, transparent); border-radius: 6px;
  cursor: pointer; white-space: nowrap; vertical-align: 1px; transition: background .12s, border-color .12s, transform .12s;
}
.rn-btn:hover { background: color-mix(in srgb, var(--rn-acc) 14%, transparent); border-color: var(--rn-acc); }
.rn-btn:focus-visible { outline: 2px solid var(--rn-acc); outline-offset: 2px; }
.rn-btn svg { width: 1.05em; height: 1.05em; fill: currentColor; }
.rn-btn.is-loading { opacity: .6; cursor: progress; }
[data-theme="dark"] .rn-btn { --rn-acc: #7aa2ff; }

/* ── Phones: the panel is a full-width drawer; full page drops the abstract pane ── */
@media (max-width: 560px) {
  .rn-panel { inset: auto 0 0 0 !important; top: 8vh !important; width: auto !important; height: auto !important;
    min-width: 0; max-width: none; border-radius: 14px 14px 0 0; resize: none; }
  .rn--fp .rn-panel { inset: 0 !important; border-radius: 0; }
  .rn-head { cursor: default; }
  .rn-xp { padding: 10px; }
}
@media (max-width: 760px) {
  .rn--fp .rn-abs { display: none; }
  .rn--fp .rn-tabs, .rn--fp .rn-body { width: auto; }
  .rn--fp .rn-year, .rn--fp .rn-sort { width: auto; }
  .rn--fp .rn-types { max-width: calc(100% - 44px); }
}
@media (prefers-reduced-motion: reduce) { .rn-panel.rn-anim, .rn-xp-card { animation: none; } }