:root{
  --bg:#ffffff;
  --bg2:#f4f6fb;
  --card:#ffffff;
  --muted:#516074;
  --text:#0b1020;
  --line:#dde3ef;
  --accent:#245bdb;
  --danger:#c62828;
  --ui:#ffffff;
  --shadow:0 10px 30px rgba(0,0,0,.10);
}
html[data-theme="dark"]{
  --bg:#0b0c0f;
  --bg2:#090a0d;
  --card:#12141a;
  --muted:#8b93a7;
  --text:#e9edf5;
  --line:#232634;
  --accent:#6aa6ff;
  --danger:#ff6a6a;
  --ui:#0e1016;
  --shadow:0 18px 60px rgba(0,0,0,.45);
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:linear-gradient(180deg,var(--bg2), var(--bg));color:var(--text)}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.page{max-width:980px;margin:0 auto;padding:24px}
.top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px}
.top-main{display:flex;align-items:flex-start;gap:20px;flex:1;min-width:0}
.top h1{margin:0;font-size:24px;letter-spacing:.03em}
.name{font-size:32px;line-height:1.15;font-weight:700;color:var(--text);margin-top:8px}
.affiliations-block{margin-top:10px;display:flex;flex-direction:column;gap:4px}
.affiliation-line{font-size:14px;line-height:1.45;color:var(--muted)}
.toplinks{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.profile-photo-wrap{width:140px;height:180px;flex:0 0 140px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--ui);box-shadow:var(--shadow)}
.profile-photo{display:block;width:100%;height:100%;object-fit:cover}
.photo-help{margin-top:8px}
@media (max-width:700px){.top{flex-direction:column}.top-main{width:100%}.toplinks{width:100%;align-items:flex-start}.profile-photo-wrap{width:120px;height:155px;flex-basis:120px}}

.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;margin:12px 0;box-shadow:var(--shadow)}
.card h2{margin:0 0 10px 0;font-size:18px}

.muted{color:var(--muted)}
.small{font-size:12px}

section{margin:18px 0}
section h2{margin:0 0 10px 0;font-size:16px}

/* Clear section headers */
.sect{display:block;padding:8px 10px;border-radius:10px;background:rgba(36,91,219,.10);border:1px solid rgba(36,91,219,.20)}
html[data-theme="dark"] .sect{background:rgba(106,166,255,.12);border-color:rgba(106,166,255,.22)}

.lines{display:flex;flex-direction:column;gap:8px}
.line{padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--card)}

.langswitch{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.langswitch a{display:inline-block;padding:6px 10px;border:1px solid var(--line);border-radius:999px;background:var(--card);font-size:12px}
.langswitch a.active{border-color:var(--accent);box-shadow:0 0 0 2px rgba(36,91,219,.15)}

/* Drag & drop list (admin) */
.dnd{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.dnd-item{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;background:var(--card);padding:10px}
.dnd-item.drag{opacity:.65}
.dnd-handle{cursor:grab;user-select:none;font-size:16px;line-height:1;padding:4px 6px;border:1px solid var(--line);border-radius:10px;background:rgba(0,0,0,.03)}
html[data-theme="dark"] .dnd-handle{background:rgba(255,255,255,.04)}
.dnd-main{flex:1;display:flex;flex-direction:column;gap:8px}
.dnd-title{font-weight:700}
section h3{margin:14px 0 8px 0;font-size:14px}

.kv{width:100%;border-collapse:collapse;margin:10px 0 18px 0}
.kv th,.kv td{border-bottom:1px solid var(--line);padding:8px 10px;vertical-align:top}
.kv th{width:240px;color:var(--muted);font-weight:600;text-align:left}

.profiles{margin:4px 0 14px;color:var(--muted)}
.profiles a{color:inherit}

.para{line-height:1.55}

.bullets{margin:0;padding-left:18px}
.bullets li{margin:8px 0;line-height:1.45}

.foot{display:flex;justify-content:space-between;gap:12px;margin-top:22px;padding-top:14px;border-top:1px solid var(--line)}

/* Admin UI */
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.row.space{justify-content:space-between}
.row.right{justify-content:flex-end}
.adminbar{position:sticky;top:0;z-index:5000;background:linear-gradient(180deg,var(--bg2), rgba(0,0,0,0));backdrop-filter:saturate(120%) blur(6px);padding:10px 0;margin:-10px 0 10px 0}
.adminbar-inner{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:820px){.grid2{grid-template-columns:1fr}}

.field{display:flex;flex-direction:column;gap:6px;margin:10px 0}
.field-label{font-size:12px;color:var(--muted)}
input,select,textarea{background:var(--ui);color:var(--text);border:1px solid var(--line);border-radius:10px;padding:10px 12px;outline:none}
textarea{resize:vertical;min-height:90px}
input:focus,select:focus,textarea:focus{border-color:rgba(106,166,255,.7);box-shadow:0 0 0 3px rgba(106,166,255,.12)}

/* Do not style checkboxes/radios as text inputs (fixes ORCID import selection). */
input[type="checkbox"],
input[type="radio"]{
  width:auto;
  height:auto;
  padding:0;
  border-radius:4px;
  background:transparent;
  box-shadow:none;
  border:1px solid var(--line);
  -webkit-appearance:checkbox;
  appearance:auto;
  accent-color: rgba(106,166,255,.95);
}

.btn{background:var(--ui);border:1px solid var(--line);color:var(--text);padding:9px 12px;border-radius:10px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.btn:hover{border-color:rgba(106,166,255,.5)}
.btn.primary{background:rgba(106,166,255,.12);border-color:rgba(106,166,255,.35)}
.btn.danger{background:rgba(255,106,106,.10);border-color:rgba(255,106,106,.35)}

.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.tab{background:var(--ui);border:1px solid var(--line);color:var(--text);padding:8px 12px;border-radius:999px;cursor:pointer}
.tab.active{border-color:rgba(106,166,255,.6);background:rgba(106,166,255,.12)}

.items{list-style:none;margin:0;padding:0}
.item{display:flex;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:10px 0;background:var(--ui)}
.item-title{font-weight:650}
.item-actions{display:flex;gap:8px;align-items:center}

.pub-journal{font-size:12px;color:#9aa4b2;margin-top:4px}
.pub-type-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;line-height:1.2;margin-right:8px;border:1px solid transparent;vertical-align:middle}
.pub-type-badge.type-wos{background:rgba(36,91,219,.12);border-color:rgba(36,91,219,.28);color:var(--accent)}
.pub-type-badge.type-book{background:rgba(126,87,194,.14);border-color:rgba(126,87,194,.30);color:#6d46c2}
.pub-type-badge.type-conference{background:rgba(0,150,136,.14);border-color:rgba(0,150,136,.28);color:#0b7f73}
.pub-type-badge.type-other{background:rgba(127,127,127,.14);border-color:rgba(127,127,127,.22);color:var(--muted)}
.quartile-badges.compact{margin-left:8px;gap:3px}
.quartile-badges.compact .quartile-badge{padding:1px 5px;font-size:10px;border-radius:999px}

.tbl{width:100%;border-collapse:collapse;margin-top:10px}
.tbl th,.tbl td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
.tbl th{color:var(--muted);font-size:12px}

.inline{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.chip{display:inline-flex;gap:8px;align-items:center;border:1px solid var(--line);background:var(--ui);padding:6px 10px;border-radius:999px}

/* Modal */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:18px;z-index:9999}
.modal{width:min(820px, 100%);max-height:min(92vh, 1000px);display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden}
.modal-head{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line);gap:12px}
.modal-title{font-weight:700}
.modal-body{padding:14px;overflow:auto;max-height:calc(92vh - 130px)}
.modal-foot{display:flex;justify-content:flex-end;gap:10px;padding:12px 14px;border-top:1px solid var(--line)}
.modal-close{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--text);font-size:24px;line-height:1;cursor:pointer;flex:0 0 auto}
.modal-close:hover{background:var(--ui)}

/* Toast */
.toast{position:fixed;right:16px;bottom:16px;background:var(--card);border:1px solid var(--line);padding:10px 12px;border-radius:12px;opacity:0;transform:translateY(10px);transition:all .2s ease;z-index:10000}
.toast.show{opacity:1;transform:translateY(0)}
.toast.err{border-color:rgba(255,106,106,.45)}

.badge{display:inline-block;padding:2px 8px;border-radius:999px;border:1px solid var(--line);font-size:12px;color:var(--muted)}
.badge.ok{border-color:rgba(0,0,0,0);background:rgba(36,91,219,0.12);color:var(--accent)}

.themebtn{border:1px solid var(--line);background:transparent;color:var(--text);padding:8px 10px;border-radius:10px;cursor:pointer}
.themebtn:hover{border-color:var(--accent)}


.login-card{max-width:540px}
.login-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px}
.password-wrap{position:relative;min-width:260px;flex:1 1 320px}
.password-wrap input{width:100%;padding-right:44px}
.password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:999px;border:1px solid var(--line);background:var(--ui);color:var(--text);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.password-toggle:hover{border-color:rgba(106,166,255,.55)}


.kv td{white-space:pre-line}

.orcid-controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.orcid-status{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:8px 0 0}
.orcid-counts{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.spinner{width:18px;height:18px;border-radius:999px;border:2px solid var(--line);border-top-color:var(--accent);animation:spin .8s linear infinite;display:inline-block;vertical-align:middle}
@keyframes spin{to{transform:rotate(360deg)}}
.skeleton{height:14px;border-radius:999px;background:linear-gradient(90deg, rgba(127,127,127,.10), rgba(127,127,127,.20), rgba(127,127,127,.10));background-size:200% 100%;animation:shimmer 1.2s infinite}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.orcid-loading{display:flex;flex-direction:column;gap:10px;padding:8px 0}
.orcid-list{position:relative;min-height:60px}
.fade-in{animation:fadeInUp .28s ease both}
@keyframes fadeInUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.orcid-sentinel{height:20px}
.orcid-importbar{position:sticky;bottom:0;background:linear-gradient(180deg, rgba(255,255,255,0), var(--bg) 35%);padding-top:10px;margin-top:10px}
html[data-theme="dark"] .orcid-importbar{background:linear-gradient(180deg, rgba(11,12,15,0), var(--bg) 35%)}


.pub-badge{display:inline-block;padding:2px 8px;border:1px solid var(--border);border-radius:999px;font-size:.78rem;font-weight:600;margin-right:6px;background:var(--card);color:var(--text);}


.translate-progress{margin-top:14px;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--ui);box-shadow:var(--shadow)}
.translate-progress.hidden{display:none}
.translate-progress-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.translate-progress-main{display:flex;gap:12px;align-items:flex-start}
.translate-progress-title{font-weight:700;margin-bottom:4px}
.translate-progress-meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.translate-progress-bar{height:10px;border-radius:999px;background:rgba(127,127,127,.14);overflow:hidden;margin-top:12px;position:relative}
.translate-progress-bar-fill{height:100%;width:8%;border-radius:999px;background:linear-gradient(90deg, rgba(36,91,219,.35), rgba(36,91,219,.95), rgba(36,91,219,.35));background-size:200% 100%;animation:translateBar 1.4s linear infinite;transition:width .35s ease}
.translate-progress.done .translate-progress-bar-fill{animation:none;width:100%}
.translate-progress.error .translate-progress-bar-fill{animation:none;background:linear-gradient(90deg, rgba(198,40,40,.75), rgba(198,40,40,.95))}
.api-status{margin-top:12px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--ui);display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.api-status-text{display:flex;flex-direction:column;gap:2px;flex:1 1 240px}
.api-status-title{font-weight:700}
.api-status-dot{width:12px;height:12px;border-radius:999px;background:var(--muted);box-shadow:0 0 0 4px rgba(127,127,127,.10);flex:0 0 auto}
.api-status-ok .api-status-dot{background:#1f9d55;box-shadow:0 0 0 4px rgba(31,157,85,.16)}
.api-status-error .api-status-dot{background:#c62828;box-shadow:0 0 0 4px rgba(198,40,40,.14)}
.api-status-loading .api-status-dot{background:var(--accent);box-shadow:0 0 0 4px rgba(36,91,219,.14);animation:pulseDot 1s ease-in-out infinite}
@keyframes pulseDot{0%{transform:scale(.9);opacity:.8}50%{transform:scale(1.08);opacity:1}100%{transform:scale(.9);opacity:.8}}
@keyframes translateBar{0%{background-position:200% 0}100%{background-position:-200% 0}}


.quartile-badges{display:inline-flex;gap:4px;flex-wrap:wrap;vertical-align:middle;margin-left:6px}
.quartile-badge{display:inline-block;padding:2px 6px;border-radius:4px;font-size:11px;line-height:1.2;font-weight:700;color:#fff;white-space:nowrap}
.quartile-badge.q1{background:#7ed957;color:#173b11}
.quartile-badge.q2{background:#2e8b57}
.quartile-badge.q3{background:#3b82f6}
.quartile-badge.q4{background:#f59e0b;color:#2f1d00}
.quartile-badge.sjr{background:#8b5cf6;color:#ede9fe}
.quartile-group .chip{margin-bottom:6px}
.quartile-chip.wos.q1,.quartile-chip.scopus.q1{background:rgba(126,217,87,.18);border-color:rgba(126,217,87,.35)}
.quartile-chip.wos.q2,.quartile-chip.scopus.q2{background:rgba(46,139,87,.18);border-color:rgba(46,139,87,.35)}
.quartile-chip.wos.q3,.quartile-chip.scopus.q3{background:rgba(59,130,246,.16);border-color:rgba(59,130,246,.35)}
.quartile-chip.wos.q4,.quartile-chip.scopus.q4{background:rgba(245,158,11,.18);border-color:rgba(245,158,11,.35)}

.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-top:14px}
.stat-card{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:var(--ui)}
.stat-value{font-size:1.5rem;font-weight:800;margin-top:4px}
.chart-wrap{margin-top:14px;border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--card);overflow:auto}
.citations-svg{width:100%;height:auto;display:block}
.chart-grid{stroke:rgba(127,127,127,.25);stroke-width:1}
.chart-axis{fill:var(--muted);font-size:12px;font-family:inherit}
.chart-bar{fill:var(--accent)}
.chart-value{fill:var(--text);font-size:11px;font-family:inherit}

.card.subtle{background:var(--card);border-style:dashed}
.row.wrap{flex-wrap:wrap}
.row.gap{gap:10px}
.chip-check{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border:1px solid var(--line);border-radius:999px;background:var(--ui);font-size:13px}

.translate-unit-list{display:flex;flex-direction:column;gap:12px;margin-top:14px;max-height:52vh;overflow:auto;padding-right:4px}
.translate-unit-card{border:1px solid #d7deea;border-radius:12px;padding:12px;background:#fff}
.translate-unit-card.done{border-color:#9fd3a8;background:#f7fff8}
.translate-unit-card.error{border-color:#ef9a9a;background:#fff8f8}
.translate-unit-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:8px}
.translate-unit-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.translate-unit-text{width:100%;min-height:110px;resize:vertical;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.45}
@media (max-width: 900px){.translate-unit-grid{grid-template-columns:1fr}}

.translate-unit-card.edited{border-color:#eab308;box-shadow:0 0 0 1px rgba(234,179,8,.25);}
.translate-unit-card .translate-unit-text{min-height:120px;}

.translate-summary-note{margin-top:10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb, var(--ui) 88%, var(--ok,#16a34a) 12%);}
.translate-unit-list.hidden{display:none}
.translate-progress .badge{font-weight:600}
.translate-unit-card .muted.small{font-weight:600;color:var(--fg);opacity:.82}
.translate-unit-card.done .badge{background:rgba(22,163,74,.12);color:#166534;border:1px solid rgba(22,163,74,.28)}
.translate-unit-card.error .badge{background:rgba(220,38,38,.12);color:#991b1b;border:1px solid rgba(220,38,38,.28)}
.translate-unit-card:not(.done):not(.error) .badge{background:rgba(107,114,128,.12);color:var(--fg);border:1px solid rgba(107,114,128,.25)}
@media (prefers-color-scheme: dark){
  .translate-unit-card{background:#111827;border-color:#334155}
  .translate-unit-card.done{background:#0f1f17;border-color:#215a36}
  .translate-unit-card.error{background:#2a1111;border-color:#7f1d1d}
  .translate-summary-note{background:#102019;border-color:#215a36;color:#d1fae5}
  .translate-unit-card .muted.small{color:#e5e7eb;opacity:.9}
}