/* ── Dossier Styles ───────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,600;9..144,900&family=Spectral:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root {
  --paper:#f2eee3; --paper2:#ebe5d6; --ink:#191510; --muted:#736a59;
  --line:#d8cfba; --accent:#8a2b2b; --accent2:#3b4a3f; --gold:#9a7b3f;
}
* { box-sizing:border-box; }
html, body { margin:0; height:100%; }
body {
  background:var(--paper); color:var(--ink); font-family:'Spectral', Georgia, serif;
  background-image:radial-gradient(circle at 20% 10%, rgba(154,123,63,.06), transparent 40%),
                   radial-gradient(circle at 90% 90%, rgba(138,43,43,.05), transparent 45%);
}
.muted { color:var(--muted); } .small { font-size:12px; }
.hidden { display:none !important; }
.link { color:var(--accent); text-decoration:none; font-size:13px; margin-left:8px; }
a { color:var(--accent); }

button { font-family:'IBM Plex Mono', monospace; cursor:pointer; }
.btn-primary { background:var(--accent); color:var(--paper); border:none; border-radius:8px; padding:9px 14px; font-size:12px; }
.btn-secondary { background:transparent; color:var(--ink); border:1px solid var(--line); border-radius:8px; padding:9px 14px; font-size:12px; }
.full { width:100%; margin-top:6px; }
.chip { background:none; border:1px solid var(--line); border-radius:6px; padding:3px 8px; font-size:11px; color:var(--ink); }
.chip.on { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.search { max-width:240px; margin:0 12px; padding:7px 11px; }
.badge { font-family:'IBM Plex Mono'; font-size:10px; padding:2px 7px; border-radius:5px; border:1px solid var(--line); background:var(--paper2); }
.res-group { margin-top:18px; }
.res-item { border:1px solid var(--line); border-radius:8px; padding:10px 12px; margin-bottom:8px; cursor:pointer; background:var(--paper); }
.res-item:hover { box-shadow:0 4px 14px rgba(25,21,16,.08); }
.ask-box { margin:16px 24px 0; border:1px solid var(--line); border-radius:10px; padding:12px 14px; background:var(--paper); }
.ask-box .mini { margin-bottom:8px; letter-spacing:1.5px; }
input, textarea, select {
  width:100%; box-sizing:border-box; background:var(--paper); border:1px solid var(--line);
  border-radius:8px; padding:9px 11px; font-size:14px; font-family:'Spectral',serif; color:var(--ink); margin-bottom:8px; outline:none;
}
button:disabled { opacity:.55; cursor:default; }
.hrow { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.chiprow { display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
.mini { font-family:'IBM Plex Mono'; font-size:10px; letter-spacing:1px; }

/* Auth */
body.auth { display:grid; place-items:center; }
.auth-card { background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:28px; width:min(380px,92vw); box-shadow:0 24px 60px rgba(25,21,16,.18); }
.auth-card h1 { font-family:'Fraunces'; font-weight:900; margin:.2em 0 .4em; }
.brand { font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:3px; color:var(--accent); }
.note { color:var(--accent2); font-size:13px; }
.error { color:var(--accent); font-size:13px; }

/* Layout */
.topbar { display:flex; align-items:center; gap:12px; padding:12px 18px; border-bottom:1px solid var(--line); background:var(--paper2); }
.topbar-title { font-family:'Fraunces'; font-weight:900; font-size:20px; }
.topbar-user { margin-left:auto; font-size:13px; }
.icon-btn { background:none; border:1px solid var(--line); border-radius:8px; width:38px; height:38px; font-size:18px; color:var(--ink); display:none; }
.layout { display:flex; height:calc(100vh - 60px); }
.sidebar { width:250px; flex-shrink:0; border-right:1px solid var(--line); background:var(--paper2); padding:18px; overflow-y:auto; }
.sidebar .brand { margin-bottom:12px; }
.nav { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px; }
.nav-btn { background:transparent; border:1px solid var(--line); border-radius:7px; padding:7px 11px; font-size:12px; color:var(--muted); }
.nav-btn.on { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.side-section-title { font-family:'IBM Plex Mono'; font-size:10px; letter-spacing:2px; color:var(--muted); margin-bottom:8px; }
.vehicle-list { display:flex; flex-direction:column; gap:4px; margin-bottom:8px; }
.vehicle { padding:9px 11px; border-radius:8px; border-left:3px solid transparent; cursor:pointer; }
.vehicle:hover { background:var(--paper); }
.vehicle.active { background:var(--paper); border-left-color:var(--accent); }
.vehicle .v-name { font-weight:600; font-size:15px; }
.vehicle .v-thesis { font-size:12px; color:var(--muted); margin-top:2px; }

.view { flex:1; min-width:0; overflow-y:auto; }
.pad { padding:20px 24px; }
.vh { font-family:'Fraunces'; font-weight:900; font-size:30px; margin:0 0 4px; }
.board-header { padding:18px 24px; border-bottom:1px solid var(--line); }
.board-header h1 { font-family:'Fraunces'; font-weight:900; font-size:30px; margin:2px 0 0; }
.board-header .meta { font-family:'IBM Plex Mono'; font-size:10px; letter-spacing:2px; color:var(--muted); }
.columns { padding:20px 24px; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.col-title { display:flex; align-items:center; gap:8px; margin-bottom:10px; font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:1.5px; }
.dot { width:8px; height:8px; border-radius:2px; }

/* Cards */
.card { background:var(--paper); border:1px solid var(--line); border-top:3px solid var(--accent2); border-radius:8px; padding:12px 13px; margin-bottom:10px; }
.card.done { opacity:.55; }
.card h3 { margin:0; font-size:15px; font-weight:600; line-height:1.25; cursor:pointer; }
.card.done h3 { text-decoration:line-through; }
.card p { font-size:13px; color:var(--muted); margin:6px 0 0; line-height:1.45; }
.card ul { margin:8px 0 0; padding-left:16px; font-size:12.5px; line-height:1.5; }
.card .due { font-family:'IBM Plex Mono'; font-size:11px; margin-top:4px; }
.card .row { display:flex; align-items:center; gap:8px; margin-top:10px; flex-wrap:wrap; }
.card .src, .src { font-family:'IBM Plex Mono'; font-size:10px; color:var(--muted); text-transform:uppercase; }
.spacer { flex:1; }
.comment { margin-bottom:6px; font-size:12.5px; line-height:1.4; }
.comment .who { font-family:'IBM Plex Mono'; font-size:10px; color:var(--accent2); }
.assign-row { display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; }

/* Vergleich */
.cmp-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; margin-top:20px; }
.cmp-card { border:1px solid var(--line); border-top:3px solid var(--accent2); border-radius:8px; padding:14px; background:var(--paper); }
.cmp-name { font-family:'Fraunces'; font-weight:600; font-size:18px; }
.cmp-card ul { margin:4px 0 0; padding-left:16px; font-size:12.5px; line-height:1.5; }
.fazit { margin-top:16px; border:1px solid var(--line); border-radius:8px; padding:14px 16px; background:var(--paper2); font-size:14.5px; line-height:1.5; }
.synth { margin-top:20px; border:1px solid var(--line); border-top:3px solid var(--accent2); border-radius:10px; padding:18px; background:var(--paper); }
.synth-name { font-family:'Fraunces'; font-weight:900; font-size:24px; }
.synth-items { display:flex; flex-direction:column; gap:8px; margin-top:12px; }
.synth-item { border:1px solid var(--line); border-radius:7px; padding:9px 11px; }

/* Quellen */
.src-card { border:1px solid var(--line); border-radius:8px; padding:12px 13px; margin-top:10px; background:var(--paper); }
.src-top { display:flex; justify-content:space-between; }
.src-q { margin-top:4px; word-break:break-all; font-size:13px; }
.src-topic { font-weight:600; font-size:15px; margin-top:6px; }
.src-card .row { display:flex; align-items:center; gap:8px; margin-top:10px; flex-wrap:wrap; }

/* Modal */
.overlay { position:fixed; inset:0; background:rgba(25,21,16,.4); display:grid; place-items:center; padding:18px; z-index:50; }
.modal { background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:22px; width:min(560px,100%); max-height:86vh; overflow-y:auto; }
.modal h2 { font-family:'Fraunces'; font-weight:900; margin:0 0 6px; }

/* Mobile */
@media (max-width:760px) {
  .icon-btn { display:block; }
  .search { display:none; }
  .topbar-title { font-size:18px; }
  .topbar-user { font-size:12px; }
  .layout { height:auto; flex-direction:column; }
  .sidebar { position:fixed; top:0; left:0; bottom:0; z-index:60; width:280px; max-width:82vw; transform:translateX(-100%); transition:transform .2s ease; }
  .sidebar.open { transform:none; box-shadow:0 0 40px rgba(0,0,0,.3); }
  .scrim { position:fixed; inset:0; background:rgba(25,21,16,.45); z-index:55; }
  .columns { grid-template-columns:1fr; }
}
::-webkit-scrollbar { width:8px; height:8px; }
::-webkit-scrollbar-thumb { background:var(--line); border-radius:4px; }
