.exp{max-width:1340px;margin:0 auto;padding:8px 0 40px}
.exp-head{margin-bottom:18px}
.exp-count{color:var(--accent);font-weight:600}
.exp-loading{color:var(--muted);padding:40px 0;font-size:15px}
.exp-body{display:grid;grid-template-columns:288px 1fr;gap:28px;align-items:start}
@media(max-width:820px){.exp-body{grid-template-columns:1fr}}
/* filters get their own scroll so the long paper list on the right scrolls independently:
   pinned below the sticky header, capped to the viewport, with internal overflow. */
/* NB: overflow-y:auto also clips horizontally, so pad left a touch (4px) or the focus outline on
   the search input gets cut off at the column edge; 8px right leaves room for the scrollbar. */
.exp-filters{position:sticky;top:70px;max-height:calc(100vh - 86px);overflow-y:auto;overscroll-behavior:contain;
  display:flex;flex-direction:column;gap:16px;font-size:13px;padding:2px 16px 2px 4px;
  scrollbar-gutter:stable;scrollbar-width:thin}
/* the column's own scrollbar used to paint over the right edge of chips, hints and the author box
   (overlay scrollbars on macOS); the gutter above reserves its lane (Nate, 2026-09-17) */
@media(max-width:820px){.exp-filters{position:static;max-height:none;overflow:visible;padding:0}}
.fhint{margin:6px 0 0;font-size:11.5px;color:var(--muted);line-height:1.4}
.fgroup{border-bottom:1px solid var(--hairline);padding-bottom:14px}
.fgroup:last-child{border-bottom:0}
.fgroup h4{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 9px;font-weight:700}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--hairline);background:var(--card);color:var(--secondary);border-radius:999px;
  padding:4px 11px;font-size:12.5px;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:6px;
  max-width:100%;white-space:normal;text-align:left;line-height:1.25}
.chip:hover{border-color:var(--axis);color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.chip.zero{opacity:.4}.chip.zero[aria-pressed="true"]{opacity:1}
.chip .cn{font-variant-numeric:tabular-nums;opacity:.7;font-size:11px}
.chip[aria-pressed="true"] .cn{opacity:.85}
.seg{display:inline-flex;background:var(--card);border:1px solid var(--hairline);border-radius:999px;padding:3px}
.seg button{border:0;background:none;font:inherit;font-size:13px;color:var(--secondary);padding:5px 12px;border-radius:999px;cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--accent);color:#fff;font-weight:600}
.finput{width:100%;padding:7px 14px;border:1px solid var(--hairline);border-radius:999px;background:var(--card);
  color:var(--ink);font:inherit;font-size:13px}
.finput:focus{outline:2px solid var(--ink);outline-offset:1px}
.yrow{display:flex;align-items:center;gap:8px}
.yrow input{width:72px}
.freset{background:none;border:0;color:var(--accent);font:inherit;font-size:12.5px;cursor:pointer;padding:0;text-align:left}
.freset:hover{text-decoration:underline}
.fbefore{background:none;border:0;color:var(--accent);font:inherit;font-size:12.5px;cursor:pointer;padding:0;margin-top:6px;text-align:left}
.fbefore[aria-pressed="true"]{font-weight:600}
.fbefore:hover{text-decoration:underline}
.exp-search{position:relative;margin-bottom:14px}
.bigsearch{width:100%;padding:13px 22px;border:1px solid var(--hairline);border-radius:999px;
  background:var(--card);color:var(--ink);font:inherit;font-size:15px;box-shadow:var(--shadow)}
.bigsearch:focus{outline:2px solid var(--ink);outline-offset:1px}
.bigsearch::placeholder{color:var(--muted)}
.sug{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:40;background:var(--card);
  border:1px solid var(--hairline);border-radius:var(--r-md);box-shadow:var(--shadow-lift);
  max-height:340px;overflow-y:auto;padding:5px}
.sug-row{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;font:inherit;
  text-align:left;padding:8px 10px;border-radius:8px;cursor:pointer;color:var(--ink);font-size:14px}
.sug-row:hover,.sug-row[aria-selected="true"]{background:var(--accent-soft)}
.sug-cat{flex:none;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:700;
  padding:3px 8px;border-radius:5px;border:1px solid transparent}
.sug-val{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sug-n{flex:none;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.sug-row.on .sug-val{font-weight:600}
.sug-row.on .sug-n:after{content:" \2713";color:var(--accent)}
.sug-free{border-top:1px solid var(--hairline);margin-top:4px;padding-top:8px;color:var(--secondary)}
.sug-free .sug-cat{background:none;border-color:var(--hairline);color:var(--muted)}
/* Status is a record-STATE axis, not a subject axis, so it takes neutral ink rather than a fifth
   hue -- adding one would have pushed the palette back past the separation limit for no gain. */
.fam-status{background:var(--accent-soft);color:var(--secondary);border-color:var(--hairline)}
.sug-empty{padding:12px 12px;color:var(--muted);font-size:13.5px}
/* FOUR colour families, not six. A validated check (OKLab dE, all pairs, both themes) showed no set
   of six site-appropriate hues is mutually distinguishable -- red/orange came out at dE 5.1 for
   NORMAL vision, and the mathematically optimal six still only reached the colourblind floor. So
   related facets share a hue and the exact category is always spelled out in text: colour is a
   redundant cue here, never the only one. */
.fam-analyte{background:rgba(215,87,75,.13);color:#a33a30}
.fam-application{background:rgba(63,157,95,.15);color:#2c7044}
.fam-disease{background:rgba(47,111,208,.13);color:#255aa8}
.fam-source{background:rgba(168,54,138,.13);color:#83296c}
.exp-active{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 10px;padding:6px 8px 6px 14px;border:1px solid var(--hairline);border-radius:var(--r-lg);background:var(--card)}
.exp-active .alab{font-size:12px;color:var(--muted);margin-right:4px}
.exp-active .achip{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:12px;font-weight:600;padding:3px 9px;border:0;border-radius:999px;background:var(--accent-soft);color:var(--accent);cursor:pointer}
.exp-active .achip .x{font-size:15px;line-height:1;opacity:.75}
.exp-active .achip:hover .x{opacity:1}
.exp-active .aclear{font:inherit;font-size:12px;color:var(--secondary);background:none;border:0;padding:3px 4px;text-decoration:underline;cursor:pointer;margin-left:auto}
.exp-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:12px;flex-wrap:wrap}
.exp-showing{font-size:13px;color:var(--secondary);font-variant-numeric:tabular-nums}
.eout{font-size:11.5px;font-weight:400;color:var(--muted);margin-left:6px;white-space:nowrap}
.exp-tlink button{font:inherit;color:var(--accent);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline}
.exp-sortl{font-size:12px;color:var(--muted)}
.exp-sort{font:inherit;font-size:13px;padding:5px 12px;border:1px solid var(--hairline);border-radius:999px;background:var(--card);color:var(--ink);margin-left:6px}
.exp-table{display:flex;flex-direction:column;gap:0}
.erow{display:grid;grid-template-columns:1fr auto;gap:4px 14px;padding:14px 2px;border-bottom:1px solid var(--hairline)}
.erow .etitle{font-size:14.5px;line-height:1.35;font-weight:500}
.erow .etitle a{color:var(--ink)} .erow .etitle a:hover{color:var(--accent)}
.emeta{display:flex;flex-wrap:wrap;gap:6px 10px;font-size:12px;color:var(--muted);align-items:center}
.emeta .badge{font-size:10.5px;font-weight:700;letter-spacing:.04em;padding:1px 8px;border-radius:999px;text-transform:uppercase}
/* the record's track, in its series colour (data, so never the accent); the text darkened toward ink to read */
.badge.a{background:color-mix(in srgb,var(--s1) 14%,transparent);color:color-mix(in srgb,var(--s1) 80%,var(--ink))}
.badge.b{background:color-mix(in srgb,var(--s2) 16%,transparent);color:color-mix(in srgb,var(--s2) 70%,var(--ink))}
.badge.c{background:color-mix(in srgb,var(--s3) 18%,transparent);color:color-mix(in srgb,var(--s3) 60%,var(--ink))}
.emeta .tag{background:var(--accent-soft);color:var(--secondary);border-radius:12px;padding:1px 8px;font-size:11.5px}
.emeta .owner{color:var(--secondary)}
/* provenance: a muted dagger on the row, explained once in .exp-note at the foot of the page.
   Kept deliberately quiet -- it should be findable, not attention-grabbing. */
.prov{color:var(--muted);font-size:.85em;margin-left:2px;cursor:help}
.exp-note{max-width:78ch;margin:30px 2px 0;color:var(--muted);font-size:12px;line-height:1.6;
  border-top:1px solid var(--hairline);padding-top:12px}
.eright{text-align:right;font-size:12px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.eright .yr{font-size:15px;color:var(--ink);font-weight:600;display:block}
.exp-pager{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:22px;font-size:13px}
.exp-pager button{border:1px solid var(--hairline);background:var(--card);color:var(--ink);border-radius:999px;padding:6px 16px;font:inherit;cursor:pointer}
.exp-pager button:disabled{opacity:.4;cursor:default}
.exp-empty{color:var(--muted);padding:40px 0;text-align:center}
.auwrap{position:relative}
.ausug{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:30;background:var(--card);border:1px solid var(--hairline);
  border-radius:8px;box-shadow:var(--shadow);max-height:280px;overflow:auto;padding:4px}
.ausug .sug-row{padding:6px 8px;border-radius:6px}
.ausug .sug-n{margin-left:auto;font-variant-numeric:tabular-nums;color:var(--muted);font-size:11px}
.seg.aurole{margin-top:8px}
