/* ================================================================
   PublishScience Preprints — modern.css v7
   Mobile-first · Clean · Accessible
   ================================================================ */

/* ── Tokens ──────────────────────────────────────────────────── */
:root {
  --blue:      #2563eb;
  --blue-h:    #1d4ed8;
  --blue-pale: #eff6ff;
  --blue-tint: #dbeafe;
  --navy:      #0f172a;
  --navy-2:    #1e293b;
  --ink:       #111827;
  --ink-2:     #374151;
  --muted:     #6b7280;
  --muted-2:   #9ca3af;
  --surface:   #ffffff;
  --bg:        #f8fafc;
  --bg-2:      #f1f5f9;
  --border:    #e2e8f0;
  --border-2:  #cbd5e1;
  --shadow-xs: 0 1px 2px rgba(0,0,0,.06);
  --shadow-sm: 0 1px 3px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.06);
  --shadow:    0 4px 16px rgba(0,0,0,.08), 0 2px 4px rgba(0,0,0,.04);
  --r-sm: 8px;
  --r:    12px;
  --r-lg: 16px;
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', Consolas, monospace;
  --wrap: 1160px;
}

/* ── Reset ───────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; overflow-x: hidden; }
body {
  font-family: var(--font); font-size: 16px; line-height: 1.65;
  color: var(--ink); background: var(--bg);
  -webkit-font-smoothing: antialiased; min-height: 100vh;
}
img, video { max-width: 100%; height: auto; display: block; }
a { color: var(--blue); text-decoration: none; }
a:hover { color: var(--blue-h); }
ul, ol { list-style: none; }

/* ── Typography ──────────────────────────────────────────────── */
h1, h2, h3, h4 { font-weight: 700; color: var(--ink); line-height: 1.25; }
h1 { font-size: clamp(1.4rem, 4vw, 1.9rem); }
h2 { font-size: clamp(1.1rem, 3vw, 1.35rem); }
h3 { font-size: clamp(1rem, 2.5vw, 1.1rem); }
p  { line-height: 1.7; }

h1#page-title, .ep_tm_pagetitle {
  font-size: clamp(1.1rem, 3vw, 1.5rem);
  font-weight: 700; color: var(--ink);
  margin: 1.25rem 0 1rem; line-height: 1.3;
}

/* ── Layout ──────────────────────────────────────────────────── */
#wrapper {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 1.5rem 1rem 4rem;
}
@media (min-width: 640px) { #wrapper { padding: 2rem 1.25rem 4rem; } }
#main_content, .ep_tm_page_content { width: 100%; background: transparent; }

/* ════════════════════════════════════════════════════════════════
   HEADER
   ════════════════════════════════════════════════════════════════ */
#ep_header {
  background: var(--navy);
  position: sticky; top: 0; z-index: 1000;
  height: 56px;                    /* fixed — mobile nav is absolute below */
  box-shadow: 0 2px 20px rgba(0,0,0,.4);
}
#ep_header_bar {
  display: flex; align-items: center;
  height: 100%;
  max-width: var(--wrap); margin: 0 auto;
  padding: 0 1rem; gap: .5rem;
}

/* Logo — ID selector beats any auto-CSS class/element rule */
#ep_logo_header {
  display: flex; align-items: center;
  flex-shrink: 0; text-decoration: none;
}
#ep_logo_header img {
  display: block;
  height: 30px;
  width: auto;
  max-width: 180px;
}
/* keep old .site-logo as alias */
.site-logo { height: 30px; width: auto; max-width: 180px; display: block; }

/* Desktop nav */
#ep_header_nav {
  display: flex; align-items: center; gap: 0;
  flex-shrink: 0; margin-right: .25rem;
}
#ep_header_nav a {
  color: rgba(255,255,255,.65); font-size: .8rem; font-weight: 500;
  padding: .4rem .65rem; border-radius: var(--r-sm);
  white-space: nowrap; transition: color .15s, background .15s;
}
#ep_header_nav a:hover { color: #fff; background: rgba(255,255,255,.1); }

/* Search bar — hidden on mobile, push to right */
#ep_search_bar {
  display: flex; align-items: center;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: var(--r-sm); overflow: hidden;
  width: 220px; flex-shrink: 0;
  margin-left: auto;
  transition: background .2s, border-color .2s;
}
#ep_search_bar:focus-within {
  background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.28);
}
#ep_search_bar input[type="text"] {
  flex: 1; min-width: 0; background: none; border: none; outline: none;
  padding: .4rem .65rem; font-size: .82rem; font-family: var(--font); color: #fff;
}
#ep_search_bar input[type="text"]::placeholder { color: rgba(255,255,255,.35); }
#ep_search_bar button {
  background: var(--blue)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E")
    center/14px no-repeat;
  border: none; width: 34px; height: 34px; min-width: 34px;
  padding: 0; font-size: 0; cursor: pointer;
  transition: background-color .15s;
}
#ep_search_bar button:hover { background-color: var(--blue-h); }

/* Login / lang — show on wide screens */
#ep_user_login_bar { display: flex; align-items: center; }
.ep_tm_key_tools { display: flex; align-items: center; gap: .2rem; list-style: none; }
.ep_tm_key_tools_item { display: flex; }
.ep_tm_key_tools_item_link, .ep_tm_key_tools a {
  display: inline-flex; align-items: center;
  font-size: .75rem; font-weight: 600;
  padding: .3rem .6rem; border-radius: var(--r-sm);
  white-space: nowrap; color: rgba(255,255,255,.7);
  border: 1.5px solid transparent; transition: all .15s;
}
.ep_tm_key_tools_item_link:hover, .ep_tm_key_tools a:hover { color: #fff; background: rgba(255,255,255,.1); }
.ep_tm_key_tools_item:first-child .ep_tm_key_tools_item_link { border-color: rgba(255,255,255,.22); }
.ep_tm_key_tools_item:last-child  .ep_tm_key_tools_item_link {
  background: var(--blue); color: #fff; border-color: var(--blue);
}
.ep_tm_key_tools_item:last-child .ep_tm_key_tools_item_link:hover { background: var(--blue-h); }

#ep_lang_switcher { display: flex; align-items: center; gap: .15rem; flex-shrink: 0; }
#ep_lang_switcher a {
  color: rgba(255,255,255,.45); font-size: .65rem; font-weight: 700;
  letter-spacing: .06em; padding: .18rem .28rem; border-radius: 4px;
  transition: color .15s, background .15s;
}
#ep_lang_switcher a:hover { color: #fff; background: rgba(255,255,255,.1); }

/* Hamburger — mobile only */
#ep_mobile_menu_toggle {
  display: none; background: none;
  border: 1.5px solid rgba(255,255,255,.22);
  color: rgba(255,255,255,.75); border-radius: var(--r-sm);
  width: 36px; height: 36px; font-size: 1rem; cursor: pointer;
  align-items: center; justify-content: center; flex-shrink: 0;
  transition: background .15s;
}
#ep_mobile_menu_toggle:hover { background: rgba(255,255,255,.1); color: #fff; }

/* ── Mobile nav dropdown — absolute so header stays 56px ────── */
#ep_mobile_nav {
  position: absolute; top: 56px; left: 0; right: 0;
  background: var(--navy-2);
  border-top: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
  padding: .5rem .75rem 1rem;
  display: none; flex-direction: column; gap: 0;
  z-index: 999;
}
#ep_mobile_nav a {
  display: flex; align-items: center;
  color: rgba(255,255,255,.72); font-size: .88rem; font-weight: 500;
  padding: .55rem .75rem; border-radius: var(--r-sm);
  min-height: 44px; transition: background .15s, color .15s;
}
#ep_mobile_nav a:hover { background: rgba(255,255,255,.09); color: #fff; }
.ep-mobile-divider { border: none; border-top: 1px solid rgba(255,255,255,.09); margin: .35rem 0; }
.ep-mobile-auth { display: flex; gap: .5rem; padding: .3rem 0; }
.ep-mobile-btn-login, .ep-mobile-btn-register {
  flex: 1; text-align: center; padding: .55rem !important;
  border-radius: var(--r-sm) !important; font-size: .82rem !important;
  font-weight: 600 !important; min-height: 42px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
}
.ep-mobile-btn-login  { border: 1.5px solid rgba(255,255,255,.22) !important; color: rgba(255,255,255,.8) !important; }
.ep-mobile-btn-register { background: var(--blue) !important; color: #fff !important; border: 1.5px solid var(--blue) !important; }
.ep-mobile-lang { display: flex; gap: .3rem; flex-wrap: wrap; padding: .3rem 0; }
.ep-mobile-lang a {
  font-size: .7rem !important; font-weight: 700 !important; letter-spacing: .06em !important;
  padding: .3rem .55rem !important; border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 4px !important; color: rgba(255,255,255,.55) !important;
  min-height: 34px !important; display: inline-flex !important; align-items: center !important;
}
.ep-mobile-lang a:hover { color: #fff !important; border-color: rgba(255,255,255,.45) !important; }

/* ════════════════════════════════════════════════════════════════
   FOOTER
   ════════════════════════════════════════════════════════════════ */
#ep_footer { background: var(--navy); margin-top: 4rem; }
.ep_footer_top {
  display: grid; grid-template-columns: 1.5fr repeat(3, 1fr);
  gap: 2rem; max-width: var(--wrap); margin: 0 auto;
  padding: 2.5rem 1.25rem 2rem;
}
.ep_footer_brand { display: flex; flex-direction: column; gap: .6rem; }
.footer-logo { height: 28px; width: auto; }
.ep_footer_brand p { font-size: .78rem; color: rgba(255,255,255,.35); line-height: 1.6; max-width: 200px; }
.ep_footer_section h4 {
  font-size: .65rem; font-weight: 700; letter-spacing: .09em;
  text-transform: uppercase; color: rgba(255,255,255,.26); margin-bottom: .65rem;
}
.ep_footer_section ul { display: flex; flex-direction: column; gap: .28rem; }
.ep_footer_section a { font-size: .78rem; color: rgba(255,255,255,.42); transition: color .15s; }
.ep_footer_section a:hover { color: rgba(255,255,255,.82); }
.ep_footer_bottom {
  border-top: 1px solid rgba(255,255,255,.07);
  max-width: var(--wrap); margin: 0 auto; padding: .9rem 1.25rem;
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
.ep_footer_bottom p, .ep_footer_bottom a { font-size: .73rem; color: rgba(255,255,255,.25); }
.ep_footer_bottom a:hover { color: rgba(255,255,255,.5); }
.ep_tm_eprints_logo a { font-size: .7rem; color: rgba(255,255,255,.18); }

/* ════════════════════════════════════════════════════════════════
   HOMEPAGE — HERO
   ════════════════════════════════════════════════════════════════ */
.ps-hero {
  background: linear-gradient(135deg, #0f172a 0%, #1e3a8a 100%);
  border-radius: var(--r-lg); padding: 2rem 1.5rem 2rem;
  margin-bottom: 1.25rem; position: relative; overflow: hidden;
  display: flex; flex-direction: column; gap: 1.25rem;
}
.ps-hero::after {
  content: ''; position: absolute; top: -80px; right: -80px;
  width: 300px; height: 300px;
  background: radial-gradient(circle, rgba(96,165,250,.18) 0%, transparent 65%);
  pointer-events: none;
}
.ps-hero-content { position: relative; z-index: 1; }

.ps-hero-badge {
  display: inline-flex; align-items: center; gap: .35rem;
  background: rgba(96,165,250,.12); border: 1px solid rgba(96,165,250,.2);
  color: #93c5fd; font-size: .7rem; font-weight: 600; letter-spacing: .05em;
  padding: .22rem .6rem; border-radius: 100px; margin-bottom: .875rem;
}
.ps-hero-dot {
  width: 5px; height: 5px; background: #60a5fa; border-radius: 50%;
  animation: ps-pulse 2s ease-in-out infinite;
}
@keyframes ps-pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.35; transform:scale(.75); } }

.ps-hero-title {
  font-size: clamp(1.5rem, 6vw, 2.25rem); font-weight: 800;
  color: #fff; letter-spacing: -.03em; line-height: 1.15; margin-bottom: .75rem;
}
.ps-hero-desc {
  font-size: clamp(.85rem, 2.5vw, .97rem); color: rgba(255,255,255,.55);
  line-height: 1.7; margin-bottom: 1.25rem; max-width: 50ch;
}
.ps-hero-actions { display: flex; gap: .65rem; flex-wrap: wrap; }

.ps-btn-primary {
  display: inline-flex; align-items: center; gap: .35rem;
  background: var(--blue); color: #fff;
  font-size: .875rem; font-weight: 700;
  padding: .65rem 1.375rem; border-radius: var(--r-sm);
  box-shadow: 0 2px 12px rgba(37,99,235,.4);
  transition: background .15s, box-shadow .15s, transform .1s;
  white-space: nowrap; min-height: 42px;
}
.ps-btn-primary:hover {
  background: var(--blue-h); color: #fff;
  box-shadow: 0 4px 18px rgba(37,99,235,.5); transform: translateY(-1px);
}
.ps-btn-ghost {
  display: inline-flex; align-items: center; gap: .35rem;
  background: rgba(255,255,255,.08); color: rgba(255,255,255,.82);
  font-size: .875rem; font-weight: 600;
  padding: .65rem 1.25rem; border-radius: var(--r-sm);
  border: 1.5px solid rgba(255,255,255,.18);
  transition: background .15s, color .15s; white-space: nowrap; min-height: 42px;
}
.ps-btn-ghost:hover { background: rgba(255,255,255,.14); color: #fff; border-color: rgba(255,255,255,.32); }

/* Hero stats — compact horizontal bar */
.ps-hero-stats {
  display: flex; flex-wrap: nowrap; width: fit-content; max-width: 100%;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--r-sm); overflow: hidden; position: relative; z-index: 1;
}
.ps-hero-stat {
  display: flex; flex-direction: column; align-items: center;
  padding: .7rem 1.125rem; gap: .1rem; text-align: center; flex: 1;
}
.ps-hero-stat + .ps-hero-stat { border-left: 1px solid rgba(255,255,255,.1); }
.ps-hero-stat-num {
  display: block; font-size: 1.35rem; font-weight: 800;
  color: #fff; letter-spacing: -.04em; line-height: 1;
}
.ps-hero-stat-label {
  display: block; font-size: .6rem; font-weight: 600;
  color: rgba(255,255,255,.4); letter-spacing: .08em; text-transform: uppercase;
}

/* ── Journal bar ─────────────────────────────────────────────── */
.ps-journal-bar {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-lg); padding: 1rem 1.25rem;
  margin-bottom: 1.75rem; box-shadow: var(--shadow-xs);
  display: flex; align-items: center; gap: 1.125rem; flex-wrap: wrap;
}
.ps-journal-name {
  font-size: .875rem; font-weight: 600; color: var(--ink-2);
  flex: 1 1 160px; line-height: 1.45;
}
.ps-journal-divider {
  width: 1px; height: 32px; background: var(--border); flex-shrink: 0;
}
.ps-journal-meta { display: flex; gap: 1rem; flex-wrap: wrap; align-items: center; }
.ps-journal-meta-item {
  display: flex; flex-direction: column; align-items: center; gap: .08rem; min-width: 44px;
}
.ps-journal-meta-val {
  font-size: .875rem; font-weight: 800; color: var(--blue); letter-spacing: -.02em; line-height: 1;
}
.ps-journal-meta-key {
  font-size: .58rem; font-weight: 600; color: var(--muted-2);
  text-transform: uppercase; letter-spacing: .07em;
}

/* ── Section header ──────────────────────────────────────────── */
.ps-section-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: .875rem; gap: 1rem;
}
.ps-section-header h2 { font-size: 1.1rem; font-weight: 700; }
.ps-section-link {
  font-size: .8rem; font-weight: 600; color: var(--blue); white-space: nowrap;
}
.ps-section-link:hover { color: var(--blue-h); text-decoration: underline; }

/* ── Article cards ───────────────────────────────────────────── */
.ps-article-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
  gap: .875rem; margin-bottom: 2rem;
}

.ps-article-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-lg); padding: 1.125rem 1.125rem .875rem;
  box-shadow: var(--shadow-xs);
  display: flex; flex-direction: column; gap: .45rem;
  position: relative; overflow: hidden;
  transition: box-shadow .2s, border-color .2s, transform .18s;
  text-decoration: none;
}
.ps-article-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--blue), #60a5fa);
  opacity: 0; transition: opacity .2s;
}
.ps-article-card:hover { box-shadow: var(--shadow); border-color: var(--blue-tint); transform: translateY(-2px); }
.ps-article-card:hover::before { opacity: 1; }

.ps-card-title {
  font-size: .9rem; font-weight: 700; color: var(--ink); line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.ps-card-title:hover { color: var(--blue); }

.ps-card-authors {
  font-size: .76rem; color: var(--muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ps-card-abstract {
  font-size: .78rem; color: var(--ink-2); line-height: 1.62;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  flex: 1;
}
.ps-card-footer {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: .5rem; margin-top: auto;
  border-top: 1px solid var(--border); gap: .4rem;
}
.ps-card-date { font-size: .7rem; font-weight: 500; color: var(--muted-2); }
.ps-card-pdf {
  font-size: .7rem; font-weight: 700; color: var(--blue);
  background: var(--blue-pale); border: 1px solid var(--blue-tint);
  border-radius: 100px; padding: .18rem .55rem;
  transition: background .15s;
}
.ps-card-pdf:hover { background: var(--blue-tint); }

/* Skeleton */
.ps-card-skeleton {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-lg); padding: 1.125rem 1.125rem; box-shadow: var(--shadow-xs);
}
.ps-skeleton-line {
  height: 11px; background: var(--bg-2); border-radius: 4px; margin-bottom: .55rem;
  animation: ps-shimmer 1.5s ease-in-out infinite;
}
.ps-skeleton-line.wide  { width: 88%; }
.ps-skeleton-line.mid   { width: 62%; }
.ps-skeleton-line.short { width: 38%; height: 9px; }
@keyframes ps-shimmer { 0%,100%{opacity:.45;} 50%{opacity:1;} }

.ps-articles-error {
  grid-column: 1/-1; text-align: center; padding: 2.5rem;
  color: var(--muted); font-size: .875rem;
  background: var(--surface); border: 1.5px dashed var(--border-2);
  border-radius: var(--r-lg);
}

/* ── Quick nav ───────────────────────────────────────────────── */
.ps-quick-nav {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr));
  gap: .875rem; margin-bottom: 2rem;
}
.ps-quick-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-lg); padding: 1.125rem 1.25rem;
  box-shadow: var(--shadow-xs);
  display: flex; flex-direction: column; gap: .45rem; text-decoration: none;
  transition: box-shadow .2s, border-color .2s, transform .18s;
}
.ps-quick-card:hover { box-shadow: var(--shadow); border-color: var(--blue-tint); transform: translateY(-2px); }
.ps-quick-card-icon {
  width: 38px; height: 38px; border-radius: var(--r-sm);
  background: var(--blue-pale); border: 1px solid var(--blue-tint);
  display: flex; align-items: center; justify-content: center; margin-bottom: .2rem;
}
.ps-quick-card-icon svg { width: 17px; height: 17px; }
.ps-quick-card-title { font-size: .92rem; font-weight: 700; color: var(--ink); }
.ps-quick-card-desc  { font-size: .78rem; color: var(--muted); line-height: 1.5; }
.ps-quick-card:hover .ps-quick-card-title { color: var(--blue); }

/* ── OAI bar ─────────────────────────────────────────────────── */
.ps-oai-bar {
  display: flex; align-items: center; gap: .65rem; flex-wrap: wrap;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-sm); padding: .6rem .875rem; margin-top: 1.25rem; font-size: .78rem;
}
.ps-oai-label { font-weight: 700; color: var(--ink-2); white-space: nowrap; }
.ps-oai-url {
  font-family: var(--font-mono); font-size: .7rem; color: var(--muted);
  background: var(--bg); padding: .14rem .38rem; border-radius: 4px;
  border: 1px solid var(--border); word-break: break-all;
}
.ps-oai-feeds { display: flex; gap: .25rem; }
.ps-feed-link {
  font-size: .7rem; font-weight: 600; color: var(--blue);
  background: var(--blue-pale); border: 1px solid var(--blue-tint);
  border-radius: 100px; padding: .18rem .55rem; transition: background .15s;
}
.ps-feed-link:hover { background: var(--blue-tint); }

/* ════════════════════════════════════════════════════════════════
   FORMS & EPRINTS UI
   ════════════════════════════════════════════════════════════════ */
input[type="text"], input[type="email"], input[type="password"],
input[type="search"], input[type="url"], input[type="tel"],
input[type="number"], input.ep_form_text, textarea, select {
  padding: .55rem .8rem; border: 1.5px solid var(--border-2);
  border-radius: var(--r-sm); font-size: .875rem; font-family: var(--font);
  background: var(--surface); color: var(--ink);
  width: 100%; transition: border-color .18s, box-shadow .18s;
  -webkit-appearance: none; appearance: none;
}
input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus,
input.ep_form_text:focus, textarea:focus, select:focus {
  outline: none; border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}
textarea { resize: vertical; min-height: 100px; }
label { display: block; font-size: .8rem; font-weight: 600; color: var(--ink-2); margin-bottom: .28rem; }

.ep_block {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-lg); padding: 1.375rem;
  box-shadow: var(--shadow-xs); margin-bottom: 1.5rem;
}
.ep_block input[type="submit"], .ep_block input[type="button"], .ep_block input.ep_form_action_button {
  padding: .5rem 1.1rem; background: var(--blue); color: #fff;
  border: 1.5px solid var(--blue); border-radius: var(--r-sm);
  font-size: .85rem; font-weight: 600; font-family: var(--font);
  cursor: pointer; -webkit-appearance: none; transition: background .15s;
}
.ep_block input[type="submit"]:hover, .ep_block input.ep_form_action_button:hover {
  background: var(--blue-h); border-color: var(--blue-h);
}

.ep_summary_box { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); margin-bottom: 1rem; overflow: hidden; box-shadow: var(--shadow-xs); }
.ep_summary_box_title { background: var(--bg-2); color: var(--ink-2); font-size: .78rem; font-weight: 700; padding: .55rem 1rem; }
.ep_summary_box_body  { background: var(--surface); padding: .875rem 1rem; }

.ep_record, .citation_default, p.citation_default {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg);
  padding: 1.125rem 1.375rem; margin-bottom: .875rem;
  box-shadow: var(--shadow-xs); font-size: .875rem; line-height: 1.7;
  transition: box-shadow .2s, border-color .2s;
}
.ep_record:hover, .citation_default:hover { box-shadow: var(--shadow-sm); }
.ep_record_title a, .citation_default a:first-of-type { font-weight: 700; color: var(--ink); }
.ep_record_title a:hover, .citation_default a:first-of-type:hover { color: var(--blue); }
.ep_record_abstract, .ep_abstract { color: var(--ink-2); font-size: .875rem; line-height: 1.7; }
.ep_record_creators, span.ep_name_str { font-size: .82rem; color: var(--muted); }

.ep_sr_component { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); margin-bottom: .875rem; overflow: hidden; }
.ep_sr_title_bar { background: var(--bg-2); color: var(--ink-2); font-size: .78rem; font-weight: 700; padding: .5rem 1rem; }
.ep_sr_content, .ep_sr_collapse_bar { background: var(--surface); padding: .875rem 1rem; }

.ep_view_browse_list li a {
  display: block; padding: .55rem 1rem; background: var(--surface);
  border: 1px solid var(--border); border-radius: var(--r-sm); margin-bottom: .2rem;
  color: var(--blue); font-weight: 600; font-size: .875rem;
  transition: background .15s, border-color .15s;
}
.ep_view_browse_list li a:hover { background: var(--blue-pale); border-color: var(--blue); }

.ep_nodocs, p.ep_nodocs { text-align: center; padding: 3rem 1.5rem; color: var(--muted); background: var(--surface); border: 2px dashed var(--border); border-radius: var(--r-lg); margin: 1.5rem 0; }

.ep_login_form_table { display: flex; flex-direction: column; gap: .8rem; max-width: 380px; margin: 1rem 0; }
.ep_login_form_table > div { display: grid; grid-template-columns: 110px 1fr; align-items: center; gap: .5rem; }
.ep_login_form_table label { margin-bottom: 0; }
.ep_login_form_table input.ep_form_text { max-width: 240px; }

/* ── Admin tables ────────────────────────────────────────────── */
.ep_toolbox { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-xs); margin-bottom: 1rem; overflow: hidden; }
.ep_toolbox_title { background: var(--navy); color: rgba(255,255,255,.85); font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; padding: .5rem 1rem; }
.ep_toolbox_content { padding: .875rem 1rem; }
.ep_toolbox_content ul { display: flex; flex-direction: column; }
.ep_toolbox_content li { padding: .28rem 0; border-bottom: 1px solid var(--border); font-size: .85rem; }
.ep_toolbox_content li:last-child { border-bottom: none; }
.ep_toolbox_content a { color: var(--blue); }
.ep_toolbox_content a:hover { text-decoration: underline; }

.ep_blister_bar { display: flex; align-items: center; flex-wrap: wrap; gap: .2rem; margin-bottom: 1.25rem; padding-bottom: .875rem; border-bottom: 1px solid var(--border); }
.ep_blister_join { width: 16px; height: 2px; background: var(--border-2); flex-shrink: 0; }
.ep_blister_node, .ep_blister_node_selected {
  display: inline-flex; align-items: center; justify-content: center;
  padding: .32rem .85rem; border-radius: 100px; font-size: .76rem; font-weight: 600;
  white-space: nowrap; border: 1.5px solid var(--border-2);
  background: var(--surface); color: var(--ink-2); transition: all .15s;
}
.ep_blister_node a { color: inherit; }
.ep_blister_node:hover { background: var(--bg); border-color: var(--blue); color: var(--blue); }
.ep_blister_node_selected { background: var(--blue); border-color: var(--blue); color: #fff; }

table.ep_columns {
  border-collapse: separate; border-spacing: 0;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--shadow-xs); font-size: .875rem;
}
th.ep_columns_title, td.ep_columns_alter {
  background: var(--navy-2); color: rgba(255,255,255,.8);
  font-size: .68rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; padding: .65rem 1rem; white-space: nowrap;
}
th.ep_columns_title a { color: rgba(255,255,255,.6); }
th.ep_columns_title a:hover { color: #fff; }
tr.row_a { background: var(--surface); }
tr.row_b { background: var(--bg); }
tr.row_a td, tr.row_b td { padding: .65rem 1rem; border-bottom: 1px solid var(--border); font-size: .875rem; color: var(--ink); }
tr.row_a:hover td, tr.row_b:hover td { background: var(--blue-pale); }
tr:last-child td { border-bottom: none; }
td.ep_columns_cell_last, td.ep_columns_alter { text-align: right; white-space: nowrap; padding: .4rem .65rem; }
.ep_columns_title_inner_sort img { width: 10px; height: 10px; filter: brightness(10); opacity: .5; }

.ep_action_list { display: flex; align-items: center; gap: .2rem; justify-content: flex-end; flex-wrap: wrap; }
.ep_action_list a, .ep_action_list input, .ep_action_list button {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 28px; height: 28px; padding: 0 .4rem;
  font-size: .68rem; font-weight: 600; font-family: var(--font);
  border-radius: 6px; background: var(--bg); border: 1px solid var(--border);
  color: var(--ink-2); cursor: pointer; transition: background .15s, color .15s;
  white-space: nowrap; -webkit-appearance: none; background-image: none;
}
.ep_action_list a:hover, .ep_action_list input:hover, .ep_action_list button:hover { background: var(--blue-pale); border-color: var(--blue); color: var(--blue); }
.ep_action_list img, td.ep_columns_cell_last img { display: none; }
.ep_action_list input[value*="Destroy"], .ep_action_list a[href*="destroy"] { color: #dc2626; border-color: #fca5a5; background: #fef2f2; }
.ep_action_list input[value*="Destroy"]:hover, .ep_action_list a[href*="destroy"]:hover { background: #dc2626; color: #fff; border-color: #dc2626; }

.ep_form_button_bar {
  display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
  padding: 1rem 1.375rem; background: var(--bg);
  border-top: 1px solid var(--border); margin-top: 1.5rem;
  border-radius: 0 0 var(--r-lg) var(--r-lg);
}
.ep_form_action_button, .ep_form_internal_button,
input.ep_form_action_button, button.ep_form_action_button {
  display: inline-flex; align-items: center; justify-content: center;
  padding: .48rem 1.1rem; font-size: .84rem; font-weight: 600; font-family: var(--font);
  border-radius: var(--r-sm); cursor: pointer; border: 1.5px solid var(--border-2);
  background: var(--surface); color: var(--ink); -webkit-appearance: none;
  background-image: none; transition: all .15s;
}
.ep_form_action_button:hover, .ep_form_internal_button:hover { border-color: var(--blue); color: var(--blue); }
input.ep_form_action_button[value="Next"], input.ep_form_action_button[value*="Deposit"],
input.ep_form_action_button[value*="Save"], input.ep_form_action_button[value="Login"],
input.ep_form_action_button[value="Search"], input.ep_form_action_button[value="Register"] {
  background: var(--blue); color: #fff; border-color: var(--blue);
}
input.ep_form_action_button[value="Next"]:hover, input.ep_form_action_button[value*="Deposit"]:hover,
input.ep_form_action_button[value*="Save"]:hover, input.ep_form_action_button[value="Login"]:hover,
input.ep_form_action_button[value="Search"]:hover { background: var(--blue-h); border-color: var(--blue-h); }
input.ep_form_action_button[value*="Destroy"], input.ep_form_action_button[value*="Delete"] { color: #dc2626; border-color: #fca5a5; background: transparent; }
input.ep_form_action_button[value*="Destroy"]:hover { background: #dc2626; color: #fff; border-color: #dc2626; }

.ep_msg_message { display: flex; gap: .65rem; padding: .875rem 1.125rem; border-radius: var(--r-lg); border: 1px solid; margin-bottom: 1rem; font-size: .875rem; line-height: 1.6; }
.ep_msg_message.ep_msg_warning, .ep_message_warning { background: #fffbeb; border-color: #fcd34d; color: #92400e; }
.ep_msg_message.ep_msg_error,   .ep_message_error   { background: #fef2f2; border-color: #fca5a5; color: #991b1b; }
.ep_msg_message.ep_msg_success, .ep_message_ok      { background: #f0fdf4; border-color: #86efac; color: #166534; }

.ep_tab_bar { display: flex; border-bottom: 2px solid var(--border); margin-bottom: 1.125rem; flex-wrap: wrap; }
.ep_tab_bar li a { display: block; padding: .5rem 1rem; font-size: .82rem; font-weight: 600; color: var(--ink-2); border-bottom: 2.5px solid transparent; margin-bottom: -2px; transition: color .15s, border-color .15s; }
.ep_tab_bar li a:hover { color: var(--blue); border-bottom-color: var(--blue); }
.ep_tab_bar li.ep_tab_selected a, .ep_tab_bar li.selected a { color: var(--blue); border-bottom-color: var(--blue); }
.ep_tab_panel { background: var(--surface); border: 1px solid var(--border); border-top: none; border-radius: 0 0 var(--r-lg) var(--r-lg); padding: 1.125rem; }

.ep_upload_doc { background: var(--surface); border: 2px dashed var(--border-2); border-radius: var(--r-lg); padding: 1.375rem; }
.ep_items_filters { background: var(--bg); border: 1px solid var(--border); border-radius: var(--r-lg); padding: .65rem .875rem; margin-bottom: 1rem; display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; }

/* ── Anti-overflow ───────────────────────────────────────────── */
body > * { max-width: 100vw; }
table { word-break: break-word; }
td, th { max-width: 100%; overflow-wrap: break-word; }

/* ── Strip EPrints background images ─────────────────────────── */
.ep_tm_header, .ep_tm_menu, .ep_tm_menu li, .ep_tm_menu li:hover,
.ep_tm_menu ul, .ep_tm_menu ul li, .ep_tm_menu a, .ep_tm_menu a:visited,
.ep_tm_footer, .ep_tm_key_tools, .ep_tm_key_tools li,
.ep_summary_box_title, .ep_summary_box_body,
.ep_sr_title_bar, .ep_sr_content, .ep_sr_collapse_bar,
.ep_tab_panel, .ep_tab_bar, .ep_tab_bar li, .ep_tab_bar li a,
.ep_toolbox_title, .ep_toolbox_content, .ep_upload_doc,
.ep_search_buttons, .ep_search_controls, .ep_search_controls_bottom,
.ep_columns_alter, .ep_form_action_button, .ep_blister_node,
th.ep_title_row, th.ep_row, td.ep_row, th.ep_columns_title { background-image: none !important; }

/* ════════════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════════════ */

/* ── ≤1080px: compress header ── */
@media (max-width: 1080px) {
  #ep_search_bar { width: 180px; }
  #ep_header_nav a { padding: .35rem .55rem; font-size: .78rem; }
  .ep_tm_key_tools_item_link { padding: .28rem .5rem; font-size: .73rem; }
  #ep_lang_switcher a { font-size: .62rem; }
}

/* ── ≤860px: hamburger only ── */
@media (max-width: 860px) {
  #ep_header_nav     { display: none !important; }
  #ep_user_login_bar { display: none !important; }
  #ep_lang_switcher  { display: none !important; }
  #ep_search_bar     { display: none !important; }
  #ep_mobile_menu_toggle { display: flex; margin-left: auto; }

  /* logo: slightly smaller on tablet/phone */
  #ep_logo_header img, .site-logo { height: 26px; max-width: 160px; }
}

/* ── ≤640px: mobile ── */
@media (max-width: 640px) {
  #wrapper { padding: 1rem .875rem 3rem; }

  .ps-hero { padding: 1.5rem 1.125rem 1.5rem; border-radius: var(--r); }
  .ps-hero-title { font-size: clamp(1.35rem, 7vw, 1.75rem); }
  .ps-hero-desc  { font-size: .85rem; margin-bottom: 1rem; }
  .ps-hero-stats { width: 100%; }
  .ps-hero-stat  { flex: 1; padding: .6rem .5rem; }
  .ps-hero-stat-num { font-size: 1.2rem; }

  .ps-journal-bar { flex-direction: column; align-items: flex-start; gap: .75rem; }
  .ps-journal-divider { display: none; }
  .ps-journal-meta { width: 100%; justify-content: space-between; gap: .5rem; }

  .ps-oai-bar { flex-direction: column; align-items: flex-start; }

  .ep_footer_top { grid-template-columns: 1fr; gap: 1.25rem; padding: 2rem 1.25rem 1.25rem; }
  .ep_footer_brand p { max-width: 100%; }
  .ep_footer_bottom { flex-direction: column; align-items: flex-start; gap: .3rem; }

  table.ep_columns { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .ep_login_form_table > div { grid-template-columns: 1fr; }
  .ep_login_form_table input.ep_form_text { max-width: 100%; }
  .ep_form_button_bar { flex-direction: column; align-items: stretch; }
}

/* ── ≤400px: small phones ── */
@media (max-width: 400px) {
  #ep_logo_header img, .site-logo { height: 22px; max-width: 120px; }
  .ps-hero { padding: 1.25rem 1rem; }
  .ps-hero-actions { flex-direction: column; }
  .ps-btn-primary, .ps-btn-ghost { width: 100%; justify-content: center; }
  .ps-hero-stats { display: none; }
}

/* ── Print ── */
@media print {
  #ep_header, #ep_footer, .ep_toolbox, .ep_blister_bar, .ep_form_button_bar,
  #ep_mobile_nav, #ep_mobile_menu_toggle { display: none !important; }
  body { background: #fff; font-size: 12pt; color: #000; }
  #wrapper { max-width: 100%; padding: 0; }
}
