/* Self-hosted IBM Plex (no CDN). */
@font-face { font-family: "IBM Plex Serif"; src: url("../fonts/IBMPlexSerif-Regular.6f6567fbc3ef.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Serif"; src: url("../fonts/IBMPlexSerif-Italic.3a44c9c048e2.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "IBM Plex Serif"; src: url("../fonts/IBMPlexSerif-SemiBold.7ca51e8b65c6.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Serif"; src: url("../fonts/IBMPlexSerif-Bold.3c469ee48099.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("../fonts/IBMPlexSans-Regular.5aaadb685d3c.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("../fonts/IBMPlexSans-SemiBold.51d76d33ef85.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("../fonts/IBMPlexSans-Bold.ea5f696de389.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

/* phds.io — per DESIGN.md: white cards on MQ sand, maroon masthead,
   blue links as the clickable cue, serif titles. */

:root {
  --page: #F4F3EF;            /* light warm canvas (sand, modernized) */
  --card: #FFFFFF;
  --ink: #373A36;             /* MQ charcoal */
  --ink-soft: #5B5F61;
  --rule: #DAD6CB;
  --sand: #EDEBE5;
  --sand-deep: #D6D2C4;       /* MQ sand (buttons) */
  --link: #3048BF;            /* clickable blue */
  --maroon: #76232F;          /* MQ deep red: masthead, primary buttons */
  --maroon-bright: #A6192E;   /* hover/active of the maroon */
  --red-bright: #D6001C;
  --badge-green: #009174;     /* ranking / verified */
  --badge-rust: #BC4700;      /* open access */
  --mark: #CBE7CF;              /* pale green highlight (phds.io) */
  --hl-bg: #90ee90; --hl-fg: #196808;
  --shadow: 0 1px 3px rgba(0, 0, 0, .07);
  --card-border: 1px solid #E4E2DA;
  --radius: 8px;
  --serif: "IBM Plex Serif", Charter, Cambria, Georgia, serif;
  --sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) {
    --page: #191A1C; --card: #232527;
    --ink: #E8E6E1; --ink-soft: #A5A29B;
    --maroon: #8A3542; --maroon-bright: #D9848E;

    --rule: #3A3B3D; --sand: #2A2B2D; --sand-deep: #343538;
    --link: #94A6FF;
    --mark: #4A4224;
    --hl-bg: #2C5C33; --hl-fg: #A5E8AB;
    --badge-green: #16A085; --badge-rust: #C65D24;
    --shadow: 0 1px 3px rgba(0, 0, 0, .5);
    --card-border: 1px solid #35363A;
  }
}
html[data-theme="dark"] {
    --page: #191A1C; --card: #232527;
    --ink: #E8E6E1; --ink-soft: #A5A29B;
    --maroon: #8A3542; --maroon-bright: #D9848E;

    --rule: #3A3B3D; --sand: #2A2B2D; --sand-deep: #343538;
    --link: #94A6FF;
    --mark: #4A4224;
    --hl-bg: #2C5C33; --hl-fg: #A5E8AB;
    --badge-green: #16A085; --badge-rust: #C65D24;
    --shadow: 0 1px 3px rgba(0, 0, 0, .5);
    --card-border: 1px solid #35363A;
}

* { box-sizing: border-box; }
html { height: 100%; }
body { margin: 0; background: var(--page); color: var(--ink);
       font: 16px/1.6 var(--sans);
       min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1 0 auto; width: 100%; }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
mark { background-color: var(--hl-bg); color: var(--hl-fg);
  font: inherit; padding: 0.125rem 0.25rem; border-radius: 0.25rem; }
:focus-visible { outline: 2px solid var(--maroon-bright); outline-offset: 2px; }

/* Masthead: maroon band, sand-white nav blocks (old-site style). */
header.site { background: #76232F; padding: .35rem 1.25rem;
  display: flex; gap: 1rem; align-items: stretch;
  border-bottom: 3px solid rgba(0, 0, 0, .18);
  position: sticky; top: 0; z-index: 60; }
header.site .logo { font-family: var(--serif); font-weight: 700;
  font-size: 1.55rem; color: #EDEBE5; padding: .5rem .4rem; align-self: center;
  letter-spacing: .01em; }
header.site .logo:hover { text-decoration: none; color: #fff; }
header.site nav.nav-site { display: flex; gap: 0; font-size: .92rem;
  margin-left: 1.2rem; }
header.site nav.nav-user { display: flex; gap: .1rem; font-size: .92rem;
  margin-left: auto; align-items: stretch; }
header.site nav > a {
  color: #EDEBE5; display: flex; align-items: center; padding: .7rem .9rem;
  transition: background-color .2s ease; }
header.site nav > a:hover {
  background: #A6192E; text-decoration: none; color: #fff; }

main { max-width: 1240px; margin: 0 auto; padding: 1.4rem 1.2rem 3rem; }

/* Footer: charcoal band, sand text; layout mirrors phds.io — centered brand,
   three link columns, bordered bottom bar with copyright + attribution. */
footer.site { background: #373A36; color: #D6D2C4; margin-top: 3rem;
  padding: 2rem 1.2rem 1.4rem; font-size: .85rem; }
footer.site a { color: #EDEBE5; }
footer.site a:hover { color: #fff; }
footer.site .foot-inner { max-width: 1240px; margin: 0 auto; display: flex;
  flex-wrap: wrap; gap: 2rem 3rem; justify-content: space-between;
  align-items: flex-start; }
footer.site .foot-brand { max-width: 26rem; }
footer.site .foot-brand p { margin: .7rem 0 0; color: #D6D2C4; }
footer.site .foot-mark { display: inline-block; width: 56px; height: 56px;
  background: #EDEBE5;
  -webkit-mask: url("../safari-pinned-tab.b97df55029c3.svg") no-repeat center / contain;
  mask: url("../safari-pinned-tab.b97df55029c3.svg") no-repeat center / contain; }
footer.site .foot-cols { display: flex; flex-wrap: wrap; gap: 2rem 3.5rem;
  justify-content: flex-end; }
footer.site .foot-col { display: flex; flex-direction: column; gap: .35rem;
  min-width: 9rem; }
footer.site .foot-col h3 { margin: 0 0 .3rem; font-family: var(--sans);
  font-size: .72rem; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: #A5A29B; }
footer.site .foot-bottom { max-width: 1240px; margin: 1.8rem auto 0;
  padding-top: 1rem; border-top: 1px solid rgba(214, 210, 196, .25);
  display: flex; flex-wrap: wrap; gap: .6rem 2rem; justify-content: space-between; }
footer.site .foot-note { color: #A5A29B; text-align: right; }
footer.site .foot-heart { color: #A6192E; }
@media (max-width: 640px) {
  footer.site .foot-bottom { justify-content: center; text-align: center; }
  footer.site .foot-note { text-align: center; }
}

h1, h2 { font-family: var(--serif); font-weight: 700; line-height: 1.3; }
h1 { font-size: 1.5rem; }
h2 { font-size: 1.2rem; }

/* Cards: white panels on the sand canvas, squared, soft shadow. */
.facets, .detail, .content-panel {
  background: var(--card); box-shadow: var(--shadow); border: var(--card-border);
  border-radius: var(--radius); padding: 1.1rem 1.25rem; }
.ico { width: 14px; height: 14px; vertical-align: -2px; margin-right: .35rem; }
.search-field { position: relative; flex: 1; display: flex; }
.search-field .ico-search { position: absolute; left: .8rem; top: 50%;
  transform: translateY(-50%); width: 16px; height: 16px; color: var(--ink-soft);
  pointer-events: none; margin: 0; }
.search-field input[type=search] { width: 100%; padding-left: 2.4rem; }

/* Search controls. */
.search-box { display: flex; gap: .6rem; margin: .4rem 0 1.15rem; align-items: center; }
.search-box input[type=search] { flex: 1; padding: .6rem .8rem; font-size: 1.02rem;
  font-family: var(--sans); border: 1px solid var(--sand-deep); border-radius: var(--radius);
  background: var(--card); color: var(--ink); box-shadow: var(--shadow); }
.search-box input[type=search]:focus { outline: 2px solid var(--maroon-bright); }
.search-box select { border: 1px solid var(--sand-deep); border-radius: 4px;
  background: var(--card); color: var(--ink); padding: .55rem .4rem;
  font-family: var(--sans); font-size: .9rem; cursor: pointer; }
button, input[type=submit], .search-box button {
  font-family: var(--sans); font-size: .9rem; padding: .5rem .95rem;
  border: 1px solid var(--sand-deep); border-radius: 4px;
  background: var(--sand-deep); color: var(--ink); cursor: pointer;
  transition: background-color .2s ease; }
button:hover, input[type=submit]:hover { background: var(--sand); }
.btn-primary, form button[type=submit].primary {
  background: var(--maroon); color: #fff; border: none; }
.btn-primary:hover { background: var(--maroon-bright); }

.layout { display: grid; grid-template-columns: 380px 1fr; gap: 1.5rem;
  align-items: start; }
@media (max-width: 800px) { .layout { grid-template-columns: 1fr; } }

/* Facet rail (white card): blue value links, tabular counts, hover rows. */
details.facet { margin: 0 0 .9rem; }
details.facet > summary { list-style: none; cursor: pointer; user-select: none;
  font-family: var(--sans); font-size: .72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em; color: var(--ink-soft);
  display: flex; justify-content: space-between; align-items: center;
  padding: .2rem 0; }
details.facet > summary::-webkit-details-marker { display: none; }
details.facet > summary::after { content: ""; width: .5em; height: .5em;
  border: solid var(--ink-soft); border-width: 0 2px 2px 0;
  transform: rotate(45deg); transition: transform .15s ease; margin-right: .2em; }
details.facet[open] > summary::after { transform: rotate(225deg); margin-top: .3em; }
details.facet > summary:hover { color: var(--ink); }
details.more { margin-top: .1rem; }
details.more > summary { list-style: none; cursor: pointer; font-size: .82rem;
  color: var(--link); padding: .2rem .4rem; }
details.more > summary::-webkit-details-marker { display: none; }
details.more > summary:hover { text-decoration: underline; }
details.more[open] > summary { display: none; }

.facets .fsort { text-transform: none; letter-spacing: 0; font-size: .74rem;
  font-weight: 400; color: var(--ink-soft); padding: 0 .1rem .25rem; }
.facets .fsort a { color: var(--ink-soft); }
.facets .fsort a.active { color: var(--maroon-bright); font-weight: 700; }
.facets ul { list-style: none; margin: 0 -.4rem; padding: 0; font-size: .84rem; }
.facets li { display: flex; justify-content: space-between; align-items: flex-start;
  gap: .5rem; padding: .18rem .4rem; transition: background-color .15s ease; }
.facets li a { flex: 1; min-width: 0; display: flex; align-items: center; }
.facets li a .val { min-width: 0; white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; }
.facets li .n { flex: none; }
.facets li:hover { background: var(--sand); }
.facets li a { color: var(--link); }
.facets li.active a { color: var(--maroon-bright); font-weight: 700; }
.facets li .n { color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.facets .cb { display: inline-block; width: .85em; height: .85em; flex: none;
  border: 1.5px solid var(--sand-deep); border-radius: 4px; margin-right: .45em;
  vertical-align: -.09em; background: var(--card); position: relative;
  transition: background-color .15s ease, border-color .15s ease; }
.facets li:hover .cb { border-color: var(--maroon-bright); }
.facets li.active .cb { background: var(--maroon); border-color: var(--maroon); }
.facets li.active .cb::after { content: ""; position: absolute; left: .22em;
  top: .04em; width: .22em; height: .45em; border: solid #fff; border-width: 0 2px 2px 0;
  transform: rotate(45deg); }

/* Results (white card): ruled catalogue rows, blue serif titles. */
.stats-strip { display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: .5rem; padding: .1rem .2rem; margin-bottom: .9rem;
  color: var(--ink); }
.stats-strip.bottom { margin: .2rem 0 0; justify-content: flex-end; }
.stats-strip strong { font-variant-numeric: tabular-nums; }
.stats-strip .pager { padding: 0; margin-left: auto; }
.meta { color: var(--ink-soft); font-size: .875rem; }
.result { background: var(--card); border: var(--card-border);
  border-radius: var(--radius); box-shadow: var(--shadow);
  padding: 1rem 1.25rem; margin-bottom: 1rem;
  transition: box-shadow .15s ease; }
.result:hover { box-shadow: 0 2px 6px rgba(0, 0, 0, .12); }
.result h3 { margin: 0 0 .25rem; font-family: var(--serif); font-size: 1.2rem;
  font-weight: 600; line-height: 1.35; }
.result h3 a { color: var(--link); }
.result h3 a:hover { text-decoration: underline; }
.result .abstract, .result .snippet { font-family: var(--serif);
  font-size: .95rem; line-height: 1.55; margin-top: .5rem; color: var(--ink-soft); }
.result .meta em { font-family: var(--serif); }
.result .publine { margin-top: .1rem; }
.result .publine em { font-family: var(--serif); font-weight: 700;
  color: var(--ink); font-size: .95rem; }
.result .publine .yr { color: var(--ink); font-weight: 600; font-size: .95rem;
  font-variant-numeric: tabular-nums; margin-left: .35rem; }
.result .publine .vol { color: var(--ink-soft); font-size: .9rem;
  font-variant-numeric: tabular-nums; margin-left: .35rem; }
.result .publine .chip { margin-left: .45rem; vertical-align: .08em; }
.authors a { color: var(--link); }
.authors a strong { font-weight: 700; }
.pager { display: flex; flex-wrap: wrap; gap: .25rem; align-items: baseline;
  padding: .7rem 0; font-size: .9rem; }
.pager a, .pager .current, .pager .gap { min-width: 1.9em; text-align: center;
  padding: .15rem .35rem; border-radius: 3px; }
.pager a:hover { background: var(--sand); text-decoration: none; }
.pager .current { background: var(--maroon); color: #fff; font-weight: 700; }
.pager .gap { color: var(--ink-soft); }
.htmx-indicator { opacity: 0; transition: opacity .15s; color: var(--ink-soft);
  font-size: .85rem; }
.htmx-request .htmx-indicator, .htmx-request.htmx-indicator { opacity: 1; }

/* Chips & badges: sand default; semantic colors for verified / open access. */
.chips { display: flex; flex-wrap: wrap; gap: .35rem; margin: .6rem 0; }
.chip { background: var(--sand-deep); border-radius: 3px; padding: .12rem .55rem;
  font-family: var(--sans); font-size: .75rem; color: var(--ink); }
a.chip { color: var(--link); }
.chip-verified { background: var(--badge-green); color: #fff; }
.chip-oa { background: var(--badge-rust); color: #fff; }

/* Paper detail (white card). */
.detail h1 { margin: 0 0 .25rem; max-width: 72ch; }
.detail p { font-family: var(--serif); max-width: 72ch; }
.detail p.meta, .detail p.authors { font-family: var(--sans); }
.detail dl { display: grid; grid-template-columns: 9rem 1fr; row-gap: .4rem;
  font-size: .92rem; }
.detail dt { font-family: var(--sans); font-size: .72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em; color: var(--ink-soft);
  padding-top: .15rem; }
.detail dd { margin: 0; }

/* Tables: sand header, ruled rows. */
table.plain { border-collapse: collapse; width: 100%; font-size: .92rem;
  background: var(--card); border: var(--card-border); box-shadow: var(--shadow); }
table.plain th { background: var(--sand-deep); font-family: var(--sans);
  font-size: .72rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink); text-align: left;
  padding: .5rem .7rem; }
table.plain td { text-align: left; padding: .5rem .7rem;
  border-bottom: 1px solid var(--rule);
  font-variant-numeric: tabular-nums; }
table.plain tr:hover td { background: var(--sand); }

/* Forms (auth, library). */
form label { font-family: var(--sans); }
input[type=text], input[type=email], input[type=password], textarea, select {
  border: 1px solid var(--sand-deep); border-radius: 4px; background: var(--card);
  color: var(--ink); padding: .45rem .6rem; font: inherit; }

/* Search field icon clearance (specificity: after .search-box input rule). */
.search-box .search-field input[type=search] { padding-left: 2.5rem; }

/* Criteria panel (phds.io-style). */
[x-cloak] { display: none !important; }
.search-box { position: relative; }
.crit-btn { display: inline-flex; align-items: center; gap: .35rem; white-space: nowrap; }
.crit-badge { background: var(--maroon); color: #fff; border-radius: 999px;
  font-size: .72rem; min-width: 1.3em; height: 1.3em; line-height: 1.3em;
  text-align: center; padding: 0 .25em; }
.crit-panel { position: absolute; top: calc(100% + .5rem); right: 0; z-index: 30;
  background: var(--card); border: var(--card-border); border-radius: var(--radius);
  box-shadow: 0 6px 24px rgba(0, 0, 0, .14); padding: 1rem 1.2rem;
  min-width: 460px; }
@media (max-width: 640px) { .crit-panel { min-width: 0; left: 0; } }
.crit-head { display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: .7rem; }
.crit-head h4 { margin: 0; font-size: .95rem; }
.crit-head a { font-size: .82rem; }
.crit-groups { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
@media (max-width: 640px) { .crit-groups { grid-template-columns: 1fr; } }
.crit-groups fieldset { border: none; margin: 0; padding: 0; }
.crit-groups legend { font-family: var(--sans); font-size: .72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em; color: var(--ink-soft);
  padding: 0 0 .35rem; }
.crit-groups label { display: flex; align-items: center; gap: .4rem;
  font-size: .88rem; padding: .12rem 0; cursor: pointer; }
.crit-groups input[type=radio] { accent-color: var(--maroon); }

.totop { position: fixed; right: 1.3rem; bottom: 1.5rem; z-index: 40;
  width: 2.7rem; height: 2.7rem; border-radius: 999px; border: none;
  background: var(--maroon); color: #fff; cursor: pointer; padding: .55rem;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .25);
  transition: background-color .15s ease; }
.totop:hover { background: var(--maroon-bright); }
.totop svg { width: 100%; height: 100%; }

/* Tagline under the masthead. */
.tagline { margin: .1rem 0 .8rem; color: var(--ink-soft); font-size: .95rem;
  font-family: var(--serif); }

/* Small clear-filters next to the result count. */
.clear-sm { margin-left: .7rem; font-size: .82rem; padding: .12rem .5rem;
  border: 1px solid var(--maroon); border-radius: 5px; color: var(--maroon);
  transition: background-color .15s ease, color .15s ease; }
.clear-sm:hover { background: var(--maroon); color: #fff; text-decoration: none; }

/* Prose pages (guide/about). */
.prose { max-width: 860px; margin: 0 auto; }
.prose h2 { margin-top: 1.6rem; }
.prose .lead { font-family: var(--serif); font-size: 1.05rem; }
.prose table { margin: .6rem 0 1rem; }
.prose li { margin: .3rem 0; }

/* Spinner inside the search field, not in the row. */
.search-field .htmx-indicator { position: absolute; right: 2.4rem; top: 50%;
  transform: translateY(-50%); }
.search-field input[type=search] { padding-right: 2.4rem; }
/* Kill the browser's native search-cancel cross — we provide exactly one. */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; appearance: none; display: none; }
input[type="search"] { appearance: textfield; }

.search-box .search-field .clear-q { position: absolute; right: .6rem; top: 50%;
  transform: translateY(-50%); display: inline-flex; align-items: center;
  justify-content: center; width: 1.6rem; height: 1.6rem;
  padding: 0; margin: 0; background: transparent; border: none;
  border-radius: 50%; box-shadow: none; color: var(--ink-soft); cursor: pointer;
  transition: background-color .15s ease, color .15s ease; }
.search-box .search-field .clear-q:hover { color: var(--ink); background: var(--sand); }
.search-box .search-field .clear-q svg { width: 13px; height: 13px; display: block; }

/* Auth pages: centered card, styled allauth forms. */
.auth-wrap { display: flex; justify-content: center; padding: 1.5rem 0; }
.auth-card { width: 100%; max-width: 440px; }
.auth-card-wide { max-width: 560px; }
.auth-card h1 { font-size: 1.35rem; margin: 0 0 .8rem; }
.auth-card form p, .auth-card form > div { margin: .7rem 0; }
.auth-card label { display: block; font-size: .85rem; font-weight: 600;
  margin-bottom: .25rem; color: var(--ink); }
.auth-card input[type=text], .auth-card input[type=email],
.auth-card input[type=password], .auth-card input[type=url],
.auth-card textarea, .auth-card select { width: 100%; }
.auth-card button[type=submit] { width: 100%; margin-top: .6rem;
  background: var(--maroon); color: #fff; border: none; padding: .6rem; }
.auth-card button[type=submit]:hover { background: var(--maroon-bright); }
.auth-card .helptext { display: block; font-size: .78rem; color: var(--ink-soft);
  margin-top: .2rem; }
.auth-card .errorlist, .field-err { color: var(--maroon-bright); font-size: .82rem;
  list-style: none; margin: .2rem 0 0; padding: 0; }
.auth-card a { font-size: .9rem; }
.flash-ok { color: var(--badge-green); font-weight: 600; }

/* Landing hero. */
.hero { text-align: center; padding: 1.6rem 0 .8rem; }
.hero h1 { font-size: 2.1rem; margin: 0 0 .35rem; color: var(--maroon-bright); }
.hero p { color: var(--ink-soft); font-family: var(--serif); font-size: 1.05rem;
  margin: 0 auto; max-width: 46rem; }

/* Sortable table headers + list-create form. */
table.plain th a { color: inherit; }
table.plain th a:hover { color: var(--maroon); text-decoration: none; }
table.plain th .arr { color: var(--maroon); }
.chip-ft50 { background: var(--maroon); color: #fff; }

/* Results area: no collapse during HTMX swaps; styled empty state. */
#results { min-height: 320px; }
.empty-state { background: var(--card); border: var(--card-border);
  border-radius: var(--radius); box-shadow: var(--shadow);
  padding: 2rem 1.5rem; text-align: center; color: var(--ink-soft); }
.empty-state strong { color: var(--ink); }

/* Theme toggle in the masthead. */
.theme-toggle { background: none; border: none; cursor: pointer; color: #EDEBE5;
  display: flex; align-items: center; padding: .7rem .7rem; }
.theme-toggle:hover { background: #A6192E; }
.theme-toggle svg { width: 16px; height: 16px; }
.theme-toggle .ico-sun { display: none; }
html[data-theme="dark"] .theme-toggle .ico-sun { display: block; }
html[data-theme="dark"] .theme-toggle .ico-moon { display: none; }
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) .theme-toggle .ico-sun { display: block; }
  html:not([data-theme="light"]) .theme-toggle .ico-moon { display: none; }
}

/* Sign-up emphasis for anonymous visitors. */
header.site .nav-cta { border: 1.5px solid rgba(237, 235, 229, .7);
  border-radius: 6px; margin: .55rem 0 .55rem .4rem; padding: 0 .8rem !important;
  align-self: center; height: 2rem; }
header.site .nav-cta:hover { background: #EDEBE5; color: var(--maroon); }

/* Account dropdown. */
.user-menu { position: relative; display: flex; align-items: stretch; }
.user-btn { display: flex; align-items: center; gap: .4rem; padding: .7rem .9rem;
  background: none; border: none; border-radius: 0; cursor: pointer;
  color: #EDEBE5; font: inherit; font-size: .92rem;
  transition: background-color .2s ease; }
.user-btn:hover, .user-menu[x-data] .user-btn[aria-expanded="true"] {
  background: #A6192E; color: #fff; }
.user-btn .chev { width: 12px; height: 12px; margin: 0; }
.user-panel { position: absolute; top: 100%; right: 0; z-index: 40;
  min-width: 240px; background: var(--card); border: var(--card-border);
  border-radius: 0 0 var(--radius) var(--radius);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .18); padding: .4rem 0; }
.user-panel .user-id { padding: .5rem 1rem .6rem; border-bottom: 1px solid var(--rule);
  margin-bottom: .35rem; display: flex; flex-direction: column; }
.user-panel .user-id strong { color: var(--ink); font-size: .95rem; }
.user-panel .user-id span { color: var(--ink-soft); font-size: .8rem; }
.user-panel a { display: block; padding: .45rem 1rem; color: var(--ink);
  font-size: .9rem; }
.user-panel a:hover { background: var(--sand); color: var(--maroon);
  text-decoration: none; }
.user-panel hr { border: none; border-top: 1px solid var(--rule); margin: .35rem 0; }

/* Page heads: title left, actions right. */
.page-head { display: flex; justify-content: space-between; align-items: flex-start;
  gap: 1rem; margin-bottom: .75rem; }
.page-head h1 { margin: 0 0 .2rem; }
.page-head-actions { position: relative; flex: none; }
.create-panel { right: 0; left: auto; min-width: 380px; }
.create-panel label { display: block; font-size: .85rem; font-weight: 600;
  margin-bottom: .25rem; }
.create-panel input[type=text], .create-panel textarea, .create-panel select {
  width: 100%; }
.btn-quiet { display: inline-block; padding: .5rem .95rem; font-size: .9rem;
  border: 1px solid var(--sand-deep); border-radius: 4px; color: var(--ink);
  background: var(--sand-deep); transition: background-color .15s ease; }
.btn-quiet:hover { background: var(--sand); text-decoration: none; }
.btn-danger { background: transparent; color: var(--maroon-bright);
  border: 1.5px solid var(--maroon-bright); border-radius: 4px; }
.btn-danger:hover { background: var(--maroon-bright); color: #fff; }

/* Visibility badges. */
.chip-vis-private { background: var(--sand-deep); }
.chip-vis-unlisted { background: var(--badge-rust); color: #fff; }
.chip-vis-public { background: var(--badge-green); color: #fff; }

/* List display page. */
.list-desc { font-family: var(--serif); max-width: 72ch; color: var(--ink);
  margin: 0 0 1rem; }
.item-note { font-style: italic; margin-top: .3rem; }
.row-actions { text-align: right; }

/* Manage page. */
.manage-details { max-width: 720px; margin-bottom: 1.5rem; }
.manage-details label { display: block; font-size: .85rem; font-weight: 600;
  margin-bottom: .25rem; }
.manage-details input[type=text], .manage-details textarea,
.manage-details select { width: 100%; }
.manage-actions { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.manage-actions .btn-primary { width: auto; }
.manage-row { display: flex; gap: .8rem; align-items: flex-start;
  background: var(--card); border: var(--card-border); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: .7rem .9rem; margin-bottom: .6rem; }
.manage-order { display: flex; flex-direction: column; gap: .15rem; flex: none; }
.manage-order button { padding: .05rem .45rem; font-size: .7rem; line-height: 1.4;
  border-radius: 3px; }
.manage-order button:disabled { opacity: .35; cursor: default; }
.manage-body { flex: 1; min-width: 0; }
.manage-body > a { font-family: var(--serif); font-weight: 600; }
.manage-tools { display: flex; gap: .3rem; flex: none; }
.manage-tools button { padding: .2rem .55rem; font-size: .85rem; border-radius: 4px; }
.manage-tools .tool-danger { color: var(--maroon-bright);
  border-color: var(--maroon-bright); background: transparent; }
.manage-tools .tool-danger:hover { background: var(--maroon-bright); color: #fff; }
.note-form { display: flex; gap: .5rem; margin-top: .5rem; }
.note-form input { flex: 1; }
.danger-zone { display: flex; justify-content: space-between; align-items: center;
  gap: 1rem; margin-top: 1.5rem; border-color: var(--maroon-bright); }
.danger-zone p { margin: .2rem 0 0; }

/* Heart / save popover. */
.result { position: relative; }
.result-tools { position: absolute; top: .65rem; right: .7rem; display: flex;
  align-items: center; gap: .45rem; }
.result-tools .selbox { width: 15px; height: 15px; accent-color: var(--maroon);
  cursor: pointer; }
.result h3, .result .publine { padding-right: 4.2rem; }
.save-wrap { position: relative; display: inline-flex; }
.heart { display: inline-flex; align-items: center; justify-content: center;
  width: 1.8rem; height: 1.8rem; padding: 0; margin: 0; border: none;
  border-radius: 50%; background: transparent; color: var(--ink-soft);
  cursor: pointer; transition: color .15s ease, background-color .15s ease; }
.heart:hover { color: var(--maroon-bright); background: var(--sand); }
.heart.on { color: var(--maroon-bright); }
.heart svg { width: 17px; height: 17px; }
.save-pop { position: absolute; top: calc(100% + .3rem); left: 0; z-index: 35;
  min-width: 230px; background: var(--card); border: var(--card-border);
  border-radius: var(--radius); box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
  padding: .3rem 0; }
.save-pop-head { font-size: .72rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink-soft); padding: .4rem 1rem .3rem; }
.save-pop button { display: flex; align-items: center; gap: .5rem; width: 100%;
  text-align: left; padding: .4rem 1rem; background: none; border: none;
  border-radius: 0; font-size: .88rem; color: var(--ink); cursor: pointer; }
.save-pop button:hover { background: var(--sand); }
.save-pop .cb { display: inline-block; width: .85em; height: .85em; flex: none;
  border: 1.5px solid var(--sand-deep); border-radius: 4px; background: var(--card);
  position: relative; }
.save-pop .cb.checked { background: var(--maroon); border-color: var(--maroon); }
.save-pop .cb.checked::after { content: ""; position: absolute; left: .22em;
  top: .04em; width: .22em; height: .45em; border: solid #fff;
  border-width: 0 2px 2px 0; transform: rotate(45deg); }
.save-pop .save-title { flex: 1; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.save-pop .save-new { display: block; padding: .4rem 1rem; font-size: .85rem;
  border-top: 1px solid var(--rule); margin-top: .25rem; }
.save-empty { padding: .3rem 1rem; }
.result-tools .save-pop { left: auto; right: 0; }
.btn-select { margin-left: .7rem; font-size: .82rem; padding: .12rem .55rem;
  border: 1px solid var(--sand-deep); border-radius: 5px; background: var(--card);
  color: var(--ink-soft); }
.btn-select:hover { background: var(--sand); color: var(--ink); }
.detail-save { display: flex; align-items: center; gap: .5rem; margin: .6rem 0; }

/* Batch selection bar (Gmail/Drive pattern). */
.batch-bar { position: sticky; bottom: 1rem; z-index: 30; display: flex;
  align-items: center; gap: .8rem; background: var(--card);
  border: var(--card-border); border-radius: 999px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, .2); padding: .5rem 1.1rem;
  margin: .8rem auto 0; width: fit-content; }
.batch-bar .btn-primary { width: auto; padding: .4rem .9rem; }
.batch-bar select { max-width: 220px; }
.batch-ok { color: var(--badge-green); font-weight: 700; }

/* Modal (proper dialog, not a system confirm). */
.modal-overlay { position: fixed; inset: 0; z-index: 100;
  background: rgba(20, 20, 22, .55); display: flex; align-items: center;
  justify-content: center; padding: 1rem; }
.modal { background: var(--card); border-radius: var(--radius);
  box-shadow: 0 16px 48px rgba(0, 0, 0, .35); max-width: 460px; width: 100%;
  padding: 1.3rem 1.5rem; }
.modal h3 { font-family: var(--serif); margin: 0 0 .5rem; }
.modal p { margin: 0 0 1rem; color: var(--ink-soft); font-size: .92rem; }
.modal-actions { display: flex; justify-content: flex-end; gap: .6rem; }
.btn-danger-solid { background: #A6192E; color: #fff; border: none; }
.btn-danger-solid:hover { background: #D6001C; }

/* Manage page extras. */
.manage-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 640px) { .manage-grid { grid-template-columns: 1fr; } }
.slug-field { display: flex; align-items: center; gap: .15rem; color: var(--ink-soft);
  font-variant-numeric: tabular-nums; }
.slug-field input { flex: 1; min-width: 0; }
.manage-toolbar { display: flex; align-items: center; gap: .8rem;
  background: var(--sand); border-radius: var(--radius); padding: .45rem .9rem;
  margin-bottom: .6rem; }
.manage-row .selm { width: 15px; height: 15px; margin-top: .35rem;
  accent-color: var(--maroon); flex: none; cursor: pointer; }
.collab-list { list-style: none; margin: 0 0 .8rem; padding: 0; }
.collab-list li { display: flex; align-items: center; gap: .6rem;
  padding: .3rem 0; border-bottom: 1px solid var(--rule); }
.collab-list li form { margin-left: auto; }
.collab-add { display: flex; gap: .5rem; max-width: 460px; }
.collab-add input { flex: 1; }
.flash-err { color: var(--maroon-bright); font-weight: 600; }

/* Brand mark: monochrome logo SVG masked in sand, beside the wordmark. */
.logo-mark { display: inline-block; width: 1.5rem; height: 1.5rem;
  margin-right: .5rem; vertical-align: -0.28rem; background: #EDEBE5;
  -webkit-mask: url("../safari-pinned-tab.b97df55029c3.svg") no-repeat center / contain;
  mask: url("../safari-pinned-tab.b97df55029c3.svg") no-repeat center / contain; }
header.site .logo:hover .logo-mark { background: #fff; }

/* Profile: account section rows. */
.account-h { margin-top: 1.6rem; font-size: 1.05rem; }
.account-rows { display: flex; flex-direction: column; gap: .5rem; margin-top: .5rem; }
.account-row { display: flex; justify-content: space-between; align-items: center;
  gap: 1rem; padding: .7rem .9rem; border: 1px solid var(--rule);
  border-radius: var(--radius); color: var(--ink);
  transition: background-color .15s ease; }
.account-row:hover { background: var(--sand); text-decoration: none; }
.account-row .meta { display: block; font-size: .82rem; }
.account-row .arrow { color: var(--ink-soft); }

.detail .affiliations { font-size: .85em; opacity: .85; margin-top: -.35rem; }
.detail .affiliations .aff { white-space: nowrap; }

/* Long abstracts clamp to 8 lines on result cards; Alpine reveals the toggle
   only when actually overflowing (scrollHeight probe in _results.html). */
.result .abstract.clamped { display: -webkit-box; -webkit-line-clamp: 8; line-clamp: 8; -webkit-box-orient: vertical; overflow: hidden; }
.ab-more { background: none; border: none; padding: 0; font: inherit; font-size: .8rem; color: var(--link); cursor: pointer; }
.ab-more:hover { text-decoration: underline; }

/* Guide table of contents */
.toc { font-family: var(--sans); font-size: .9rem; border: 1px solid var(--rule, #d6d2c4); border-radius: 6px; padding: .75rem 1.25rem; margin: 1rem 0 1.5rem; max-width: 32rem; }
.toc ol { margin: .25rem 0 .25rem 1.1rem; padding: 0; }
.toc li { margin: .15rem 0; }

/* Prose page polish: journal-like section headings, feature/team cards. */
.prose h2 { position: relative; padding-bottom: .35rem; margin-top: 2.2rem; }
.prose h2::after { content: ""; position: absolute; left: 0; bottom: 0;
  width: 2.4rem; height: 3px; background: var(--maroon); border-radius: 2px; }
.prose .lede { font-family: var(--serif); font-size: 1.12rem; line-height: 1.6; }
.feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
  gap: .9rem; margin: 1rem 0 1.4rem; }
.feature-card { border: 1px solid var(--rule); border-radius: 8px;
  padding: .9rem 1.1rem; background: var(--sand); }
.feature-card h3 { margin: 0 0 .4rem; font-size: 1rem; }
.feature-card p { margin: 0; font-size: .93rem; }
.prose table.plain tbody tr:nth-child(odd) { background: color-mix(in srgb, var(--sand) 55%, transparent); }

/* Social sign-in buttons (login/signup). */
.sso-buttons { display: flex; flex-direction: column; gap: .55rem; margin: .8rem 0 .3rem; }
.sso-btn { display: flex; align-items: center; justify-content: center; gap: .55rem;
  border: 1px solid var(--rule); border-radius: 6px; padding: .55rem .9rem;
  background: var(--card); color: var(--ink); font-family: var(--sans);
  font-size: .95rem; box-shadow: var(--shadow); }
.sso-btn:hover { text-decoration: none; border-color: var(--sand-deep);
  background: var(--sand); }
.sso-mark { width: 18px; height: 18px; }

/* Mobile: facets fold behind a Filters toggle; results come fast. */
.facets-toggle { display: none; }
@media (min-width: 801px) {
  .facets .facets-body { display: block !important; } /* always open on desktop */
}
@media (max-width: 800px) {
  .facets-toggle { display: flex; align-items: center; gap: .45rem; width: 100%;
    background: none; border: none; padding: .1rem 0 .3rem; font-family: var(--sans);
    font-size: .95rem; font-weight: 600; color: var(--ink); cursor: pointer; }
  .facets-toggle .chev { margin-left: auto; transition: transform .15s ease; }
  .facets .facets-body { margin-top: .5rem; }
  .search-box { flex-wrap: wrap; }
  main table.plain { display: block; overflow-x: auto; }
}

/* Header: never wrap link text; compact + wrappable rows on small screens. */
header.site .logo { display: flex; align-items: center; white-space: nowrap; }
header.site nav > a { white-space: nowrap; }
header.site .nav-cta { white-space: nowrap; }
@media (max-width: 920px) {
  header.site { flex-wrap: wrap; padding: .3rem .7rem; gap: .2rem .6rem; }
  header.site .logo { font-size: 1.3rem; padding: .35rem .2rem; }
  header.site nav.nav-site { margin-left: 0; font-size: .88rem;
    overflow-x: auto; scrollbar-width: none; }
  header.site nav.nav-site::-webkit-scrollbar { display: none; }
  header.site nav > a { padding: .55rem .6rem; }
  header.site nav.nav-user { font-size: .88rem; }
  header.site .nav-cta { margin: .3rem 0 .3rem .3rem; padding: 0 .6rem !important; }
}

/* Very small screens: nav collapses into burger + account icon; hero shrinks. */
.nav-burger, .nav-auth-burger, .show-sm { display: none; }
@media (max-width: 640px) {
  header.site nav.nav-site { display: none; }
  .nav-burger { display: flex; }
  .show-sm { display: block; }
  .hide-sm { display: none !important; }
  .user-btn .uname, .user-btn .chev { display: none; }
  .nav-auth-burger { display: flex; }
  .hero { padding: 1rem 0 .5rem; }
  .hero h1 { font-size: 1.45rem; }
  .hero p { font-size: .92rem; }
}

/* Profile page: two-column cards, typeahead picker, danger zone. */
.profile-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 1.2rem;
  align-items: start; max-width: 980px; }
@media (max-width: 800px) { .profile-grid { grid-template-columns: 1fr; } }
.pcol { display: flex; flex-direction: column; gap: 1.2rem; }
.pcard h2 { margin-top: 0; }
.pcard label { display: block; font-family: var(--sans); font-size: .78rem;
  font-weight: 700; margin-bottom: .25rem; }
.pcard input[type=text], .pcard input[type=email], .pcard select {
  width: 100%; padding: .5rem .65rem; border: 1px solid var(--sand-deep);
  border-radius: 6px; background: var(--card); color: var(--ink);
  font-family: var(--sans); font-size: .95rem; }
.typeahead { position: relative; display: block; }
.ta-list { position: absolute; top: 100%; left: 0; right: 0; z-index: 30;
  background: var(--card); border: var(--card-border); border-radius: 0 0 6px 6px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .18); display: block; max-height: 16rem;
  overflow-y: auto; }
.ta-list button { display: flex; justify-content: space-between; gap: 1rem;
  width: 100%; text-align: left; background: none; border: none;
  padding: .5rem .7rem; font-size: .9rem; cursor: pointer; color: var(--ink); }
.ta-list button:hover { background: var(--sand); }
.linklike { background: none; border: none; padding: 0; color: var(--link);
  font-size: .82rem; cursor: pointer; }
.linklike:hover { text-decoration: underline; background: none; }
.danger-zone { border-left: 3px solid var(--red-bright); }
.btn-danger { background: var(--red-bright); border: none; color: #fff; }
.btn-danger:hover { background: #A6192E; }
.danger-actions { display: flex; gap: .6rem; margin-top: .6rem; }
.sso-sm { padding: .3rem .7rem; font-size: .82rem; }

/* Profile refinements: name grid, institution chips, full-width danger zone. */
.name-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 .8rem; }
.chips-row { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .4rem; }
.inst-chip { display: inline-flex; align-items: center; gap: .3rem; }
.inst-chip button { background: none; border: none; padding: 0 .1rem; cursor: pointer;
  font-size: 1rem; line-height: 1; color: inherit; }
.danger-wide { max-width: 980px; margin-top: 1.2rem; display: flex;
  flex-wrap: wrap; gap: 1rem 2.5rem; align-items: center;
  justify-content: space-between; }
.danger-wide .dz-text { max-width: 34rem; }
.danger-wide .dz-text h2 { margin: 0 0 .3rem; }
.danger-wide .dz-text p { margin: 0; }

/* Secondary affiliations: quiet rows, not chips. */
.sec-affs { display: flex; flex-direction: column; gap: .25rem; margin: .3rem 0 .5rem; }
.sec-aff { display: flex; justify-content: space-between; gap: 1rem;
  align-items: baseline; font-size: .92rem; padding: .25rem .5rem;
  background: var(--sand); border-radius: 4px; }

/* Search submits on Enter or this button (typing no longer fires requests). */
.search-btn { background: var(--maroon); color: #fff; border: 0;
  font-weight: 600; cursor: pointer; white-space: nowrap; }
.search-btn:hover { background: var(--maroon-bright); }

/* Field chips: discipline scoping under the search box. Selected =
   maroon fill (maroon = state); unselected = muted outline. Persisted
   via cookie (visitors) or profile (accounts). */
.field-chips { display: flex; flex-wrap: wrap; align-items: center;
  gap: .45rem; margin: .6rem 0 .2rem; min-width: 0; max-width: 100%; }
.fchips-label { font-size: .82rem; color: var(--ink-soft); }
.fchip { border: 1.5px solid var(--sand-deep); background: var(--card);
  border-radius: 999px; padding: .3rem .95rem; font: inherit;
  font-size: .85rem; color: var(--ink-soft); cursor: pointer;
  transition: background .12s, color .12s, border-color .12s; }
.fchip.on { background: var(--maroon); border-color: var(--maroon);
  color: #fff; font-weight: 600; }
.fchip:not(.on):hover { border-color: var(--maroon);
  color: var(--ink); }
@media (max-width: 800px) {
  .field-chips { flex-wrap: nowrap; overflow-x: auto; width: 100%;
    margin: .5rem 0 0; padding-bottom: .35rem;
    -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .field-chips::-webkit-scrollbar { display: none; }
  .fchips-label { display: none; }
  .fchip { flex: 0 0 auto; font-size: .8rem; padding: .26rem .8rem; }
}

/* Search-box controls: buttons stretch to the input row's height so all
   three controls are always exactly equal. */
.search-box .search-btn, .search-box .crit-btn {
  align-self: stretch; display: inline-flex; align-items: center;
  gap: .35rem; padding: 0 1rem; font-size: 1.02rem; border-radius: 8px; }
.search-box .crit-btn { border: 1.5px solid var(--sand-deep);
  background: var(--card); color: var(--ink); cursor: pointer;
  font: inherit; }