@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,600;0,700;1,400&display=swap');

* { margin:0; padding:0; box-sizing:border-box; }

body {
  background:var(--bg);
  color:var(--text);
  font-family:'Inter','Segoe UI',system-ui,sans-serif;
  font-size:13px;
}

/* ── NAV ── */
.nav {
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 48px;
  border-bottom:1px solid var(--border);
  background:var(--bg);
  position:sticky; top:0; z-index:20;
}
.nav-back {
  color:var(--accent); font-size:11px; letter-spacing:1.5px;
  text-decoration:none; font-family:'Orbitron',sans-serif;
  transition:opacity .2s;
}
.nav-back::before { content:'← '; font-family:sans-serif; }
.nav-back:hover { opacity:.75; }
.nav-venue { font-size:10px; color:var(--text-xfaint); letter-spacing:1px; }

/* ── PAGE SHELL ── */
.paper-shell {
  max-width:1100px;
  margin:0 auto;
  padding:56px 48px 80px;
  display:grid;
  grid-template-columns:1fr 200px;
  gap:64px;
  align-items:start;
}

/* ── LEFT: MAIN ── */
.paper-label {
  font-size:10px; letter-spacing:2px; text-transform:uppercase;
  color:var(--accent); margin-bottom:16px;
  display:flex; gap:10px; align-items:center; flex-wrap:wrap;
}
.paper-label .sep { color:var(--border-accent); }

.paper-title {
  font-family:'Lora', Georgia, serif;
  font-size:34px; font-weight:700; color:var(--text-bright);
  line-height:1.3; letter-spacing:-0.2px;
  margin-bottom:20px;
}

.paper-authors {
  font-size:13px; color:var(--text-muted); line-height:1.9; margin-bottom:10px;
}
.paper-authors .me {
  color:var(--text-bright); font-weight:600;
  text-decoration:underline; text-underline-offset:2px;
  text-decoration-color:rgba(80,216,144,0.5);
}

.paper-venue-row {
  font-size:11px; color:rgba(255,255,255,0.3);
  display:flex; gap:14px; align-items:center;
  flex-wrap:wrap; margin-bottom:40px;
}
.paper-venue-row .pill {
  padding:2px 8px; border:1px solid var(--border-accent);
  color:var(--accent); border-radius:3px; font-size:10px;
}
.paper-venue-row .sep { color:rgba(255,255,255,0.1); }

.divider { height:1px; background:rgba(255,255,255,0.06); margin-bottom:36px; }

/* ── SECTIONS ── */
.section { margin-bottom:44px; }
.section-label {
  font-size:9px; letter-spacing:2.5px; text-transform:uppercase;
  color:rgba(255,255,255,0.85); margin-bottom:14px;
  padding-bottom:8px; border-bottom:1px solid rgba(255,255,255,0.05);
  font-family:'Orbitron',sans-serif;
}
.abstract-text { font-size:13px; color:rgba(255,255,255,0.82); line-height:1.95; }

/* ── CONTRIBUTIONS LIST ── */
.contrib-list {
  list-style:none;
  counter-reset:contrib;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.contrib-list li {
  counter-increment:contrib;
  display:flex;
  gap:14px;
  font-size:13px;
  color:rgba(255,255,255,0.82);
  line-height:1.75;
}
.contrib-list li::before {
  content:counter(contrib, decimal-leading-zero);
  color:var(--accent);
  font-family:'Orbitron',sans-serif;
  font-size:10px;
  font-weight:700;
  flex-shrink:0;
  padding-top:3px;
  min-width:22px;
}

/* ── FRAMEWORK FIGURE ── */
.framework-fig {
  width:100%;
  border-radius:6px;
  overflow:hidden;
  margin-bottom:12px;
  background:rgba(255,255,255,0.02);
}
.framework-fig img {
  width:100%;
  display:block;
  object-fit:contain;
  max-height:340px;
  padding:12px;
  background:rgba(255,255,255,0.02);
}
.framework-placeholder {
  width:100%; height:200px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px;
  background:var(--bg-card-alt);
  font-size:10px; color:var(--text-xfaint); letter-spacing:1.5px;
  text-transform:uppercase; font-family:'Orbitron',sans-serif;
  border-radius:6px;
}
.framework-placeholder .fig-venue {
  font-size:20px; color:rgba(80,216,144,0.2);
  letter-spacing:3px;
}
.fig-caption {
  font-size:10px; color:var(--text-faint);
  line-height:1.6; margin-bottom:0;
}

/* ── RESULT STATS ── */
.result-stats {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(110px,1fr));
  gap:12px;
  margin-bottom:20px;
}
.stat-item {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:6px;
  padding:16px 10px;
  text-align:center;
}
.stat-value {
  font-size:26px; font-weight:700;
  color:var(--accent);
  font-family:'Orbitron',sans-serif;
  line-height:1;
  margin-bottom:6px;
}
.stat-label {
  font-size:9px; color:var(--text-faint);
  letter-spacing:0.5px; text-transform:uppercase;
  line-height:1.4;
}

/* ── HERO / LEGACY ── */
.hero-wrap {
  width:100%; border-radius:4px; overflow:hidden;
  border:1px solid var(--border); margin-bottom:10px;
}
.hero-wrap img { width:100%; display:block; }
.hero-placeholder {
  width:100%; height:200px; background:var(--bg-card-alt);
  display:flex; align-items:center; justify-content:center;
  font-size:11px; color:var(--text-xfaint); letter-spacing:1px;
}
.hero-caption {
  font-size:10px; color:var(--text-faint);
  line-height:1.6; margin-top:10px; margin-bottom:0;
}

/* ── FIGURES ── */
.fig-grid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; }
.fig-item {
  background:var(--bg-card); border-radius:3px; overflow:hidden;
  border:1px solid rgba(255,255,255,0.06);
}
.fig-item img { width:100%; display:block; aspect-ratio:4/3; object-fit:cover; }
.fig-cap { padding:6px 8px; font-size:9px; color:var(--text-muted); }

/* ── RESULT FIGURES ── */
.result-fig {
  width:100%; border-radius:6px; overflow:hidden; margin-bottom:10px;
}
.result-fig img {
  width:100%; display:block; object-fit:contain;
  border-radius:6px;
  background:rgba(255,255,255,0.02);
}
.result-row {
  display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:10px;
}
.result-cap {
  font-size:10px; color:rgba(255,255,255,0.35);
  line-height:1.6; margin-bottom:28px; font-style:italic;
}
.motiv-list {
  list-style:none; display:flex; flex-direction:column; gap:10px; margin-bottom:0;
}
.motiv-list li {
  font-size:13px; color:rgba(255,255,255,0.82); line-height:1.75;
  padding-left:20px; position:relative;
}
.motiv-list li::before {
  content:'—'; position:absolute; left:0;
  color:var(--accent); font-weight:700;
}

/* ── BIBTEX ── */
.bibtex-block {
  background:var(--bg-deep); border:1px solid var(--border);
  border-radius:3px; padding:16px 18px;
  font-family:monospace; font-size:11px; color:var(--text-muted);
  line-height:1.7; white-space:pre; overflow-x:auto;
}

/* ── RIGHT: SIDEBAR ── */
.paper-sidebar { position:sticky; top:80px; }

.sidebar-label {
  font-size:9px; letter-spacing:2px; text-transform:uppercase;
  color:var(--text-xfaint); margin-bottom:12px;
  font-family:'Orbitron',sans-serif;
}

.quick-links { display:flex; flex-direction:column; gap:8px; }

.qlink {
  display:flex; align-items:center; gap:10px;
  padding:10px 14px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:3px;
  color:rgba(255,255,255,0.5);
  text-decoration:none;
  font-size:11px; letter-spacing:0.5px;
  transition:all .15s;
  background:rgba(255,255,255,0.02);
  cursor:pointer; width:100%; text-align:left;
  font-family:inherit;
}
.qlink:hover { border-color:var(--accent); color:var(--accent); background:rgba(80,216,144,0.05); }
.qlink.primary { border-color:rgba(255,255,255,0.08); color:rgba(255,255,255,0.5); }
.qlink.disabled { opacity:.3; pointer-events:none; }
.qlink i { font-size:12px; width:14px; text-align:center; }

.sidebar-divider { height:1px; background:rgba(255,255,255,0.05); margin:16px 0; }

.sidebar-meta { font-size:10px; color:var(--text-xfaint); line-height:1.9; }
.sidebar-meta .meta-head {
  font-size:9px; letter-spacing:1px; text-transform:uppercase;
  margin-bottom:6px; display:block; color:var(--text-xfaint);
}
.sidebar-meta .accent { color:var(--accent); }

/* ── LIGHT THEME OVERRIDES ── */
[data-theme="light"] .section-label {
  color:rgba(0,0,0,0.75);
  border-bottom-color:rgba(0,0,0,0.08);
}
[data-theme="light"] .abstract-text { color:var(--text-muted); }
[data-theme="light"] .contrib-list li { color:var(--text-muted); }
[data-theme="light"] .motiv-list li { color:var(--text-muted); }
[data-theme="light"] .motiv-list li::before { color:var(--accent); }
[data-theme="light"] .result-cap { color:var(--text-faint); }
[data-theme="light"] .paper-venue-row { color:var(--text-faint); }
[data-theme="light"] .paper-venue-row .sep { color:rgba(0,0,0,0.15); }
[data-theme="light"] .divider { background:rgba(0,0,0,0.08); }
[data-theme="light"] .sidebar-divider { background:rgba(0,0,0,0.08); }
[data-theme="light"] .qlink {
  border-color:rgba(0,0,0,0.12);
  color:rgba(0,0,0,0.55);
  background:rgba(0,0,0,0.03);
}
[data-theme="light"] .qlink:hover {
  border-color:var(--accent);
  color:var(--accent);
  background:rgba(20,120,60,0.05);
}
[data-theme="light"] .qlink.primary {
  border-color:rgba(0,0,0,0.12);
  color:rgba(0,0,0,0.55);
}
[data-theme="light"] .framework-fig { background:rgba(0,0,0,0.03); }
[data-theme="light"] .framework-fig img { background:rgba(0,0,0,0.03); }
[data-theme="light"] .result-fig img { background:rgba(0,0,0,0.03); }
[data-theme="light"] .bibtex-block {
  background:var(--bg-deep);
  border-color:var(--border);
  color:var(--text-muted);
}
[data-theme="light"] .sidebar-meta { color:var(--text-faint); }
[data-theme="light"] .sidebar-meta .meta-head { color:var(--text-faint); }
[data-theme="light"] .fig-item { border-color:rgba(0,0,0,0.1); }
[data-theme="light"] .framework-placeholder .fig-venue { color:rgba(20,120,60,0.5); }

/* ── TABLET ── */
@media (max-width:1024px) and (min-width:769px) {
  .nav { padding:14px 28px; flex-wrap:wrap; gap:8px; }
  .paper-shell { padding:40px 28px 60px; gap:32px; }
  .paper-shell { grid-template-columns:1fr 180px; }
  .paper-title { font-size:28px; }
  .paper-sidebar { top:80px; }
}

/* ── MOBILE ── */
@media (max-width:768px) {
  .nav { padding:12px 20px; flex-wrap:wrap; gap:8px; }
  .paper-shell {
    grid-template-columns:1fr;
    gap:0; padding:32px 20px 60px;
  }
  /* allow the single column to shrink to viewport width; without this the
     white-space:pre bibtex block forces the whole page wider than the screen */
  .paper-shell > * { min-width:0; }
  .paper-sidebar {
    position:static;
    margin-top:40px;
    padding-top:32px;
    border-top:1px solid var(--border);
  }
  .quick-links { flex-direction:row; flex-wrap:wrap; }
  .qlink { width:auto; }
  .paper-title { font-size:26px; }
  .fig-grid { grid-template-columns:1fr 1fr; }
  .result-stats { grid-template-columns:1fr 1fr; }
  .framework-fig img { max-height:200px; }
}