/* Anime-Lovers Dashboard – dunkles Anime-Design (gleiche Tokens wie Cockpit v1) */
:root{
  --bg:#0b0d14;--bg2:#11141f;--card:#161a28;--card2:#1c2135;
  --ink:#e8e9f0;--ink-dim:#8b90a5;--line:#262c42;
  --accent:#ff3d71;--accent2:#ffb02e;--ok:#2dd4a7;--warn:#ffb02e;--danger:#ff5c5c;
  --mono:'Consolas','JetBrains Mono',monospace;
  --sans:system-ui,'Segoe UI',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.5;min-height:100vh}
body::before{content:'';position:fixed;inset:0;pointer-events:none;background:
  radial-gradient(ellipse 60% 40% at 85% -10%,rgba(255,61,113,.12),transparent),
  radial-gradient(ellipse 50% 35% at 5% 110%,rgba(255,176,46,.06),transparent)}
a{color:var(--accent)}
button{font-family:inherit}

/* ---------- Login ---------- */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1rem;position:relative}
.login-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:2.2rem;width:100%;max-width:380px}
.login-card .kicker{font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:.3rem}
.login-card h1{font-size:1.5rem;margin-bottom:1.4rem}
.field{margin-bottom:1rem}
.field label{display:block;font-size:.78rem;color:var(--ink-dim);margin-bottom:.3rem;font-family:var(--mono)}
.field input{width:100%;background:var(--bg2);border:1px solid var(--line);border-radius:9px;padding:.65rem .8rem;color:var(--ink);font-size:.95rem}
.field input:focus{outline:none;border-color:var(--accent)}
.btn{display:inline-block;background:linear-gradient(90deg,var(--accent),#ff5c8a);color:#fff;border:none;border-radius:9px;padding:.65rem 1.2rem;font-size:.92rem;font-weight:650;cursor:pointer;transition:.15s}
.btn:hover{transform:translateY(-1px);filter:brightness(1.08)}
.btn.full{width:100%}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--ink-dim)}
.error{color:var(--danger);font-size:.85rem;margin-top:.7rem;min-height:1.2em}

/* ---------- App-Layout ---------- */
.app{display:grid;grid-template-columns:220px 1fr;min-height:100vh;position:relative}
.sidebar{background:var(--bg2);border-right:1px solid var(--line);padding:1.3rem .9rem;display:flex;flex-direction:column;gap:.2rem;position:sticky;top:0;height:100vh}
.brand{font-weight:800;font-size:1.05rem;padding:.2rem .6rem 1rem}
.brand em{font-style:normal;color:var(--accent)}
.nav-item{display:flex;align-items:center;gap:.6rem;padding:.55rem .7rem;border-radius:9px;color:var(--ink-dim);text-decoration:none;font-size:.9rem;cursor:pointer;border:none;background:none;width:100%;text-align:left}
.nav-item:hover{background:var(--card);color:var(--ink)}
.nav-item.active{background:var(--card2);color:var(--ink);border-left:2px solid var(--accent)}
.sidebar .spacer{flex:1}
.userbox{padding:.6rem .7rem;border-top:1px solid var(--line);font-size:.8rem;color:var(--ink-dim)}
.userbox b{color:var(--ink)}
.main{padding:1.8rem 2rem;max-width:1200px}
.main h1{font-size:1.4rem;margin-bottom:.3rem}
.main .sub{color:var(--ink-dim);font-size:.88rem;margin-bottom:1.5rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:1.2rem 1.4rem;margin-bottom:1rem}
.placeholder{color:var(--ink-dim);font-size:.9rem;border:1px dashed var(--line);border-radius:12px;padding:2rem;text-align:center}

@media(max-width:720px){
  .app{grid-template-columns:1fr}
  .sidebar{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center}
  .brand{padding:.2rem .6rem}
  .sidebar .spacer,.userbox{display:none}
}

/* ---------- Toolbar / Filter ---------- */
.toolbar{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin-bottom:1rem}
.toolbar .spacer{flex:1}
select,textarea,input{background:var(--bg2);border:1px solid var(--line);border-radius:8px;color:var(--ink);padding:.45rem .6rem;font-size:.86rem;font-family:inherit}
select:focus,textarea:focus,input:focus{outline:none;border-color:var(--accent)}
.form-card{margin-bottom:1rem}

/* ---------- Aufgaben ---------- */
.ws-group{margin-bottom:1.4rem}
.ws-group h3{font-size:.85rem;color:var(--ink-dim);margin-bottom:.5rem;display:flex;align-items:center;gap:.5rem}
.ws-group .ws-count{margin-left:auto;font-family:var(--mono);font-size:.75rem}
.ws-tag{font-family:var(--mono);font-size:.7rem;font-weight:700;color:var(--accent2)}
.task-row{display:flex;align-items:center;gap:.7rem;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:.5rem .8rem;margin-bottom:.35rem}
.task-row:hover{background:var(--card2)}
.task-row .t-title{flex:1;font-size:.9rem;cursor:pointer}
.task-row.st-fertig .t-title{color:var(--ink-dim);text-decoration:line-through}
.task-row.st-blockiert{border-left:3px solid var(--danger)}
.task-row.st-laeuft{border-left:3px solid var(--accent2)}
.task-row select.t-status{font-size:.76rem;padding:.25rem .4rem}
.t-comments{font-size:.74rem;color:var(--ink-dim);font-family:var(--mono)}
.badge{font-family:var(--mono);font-size:.64rem;padding:.12rem .5rem;border-radius:6px}
.p-hoch{background:rgba(255,92,92,.15);color:var(--danger)}
.p-mittel{background:rgba(255,176,46,.12);color:var(--accent2)}
.p-niedrig{background:rgba(139,144,165,.14);color:var(--ink-dim)}
.a-du{background:rgba(255,61,113,.15);color:var(--accent)}
.a-paul{background:rgba(255,176,46,.15);color:var(--accent2)}
.a-ki{background:rgba(45,212,167,.15);color:var(--ok)}
.a-beide{background:rgba(139,144,165,.15);color:var(--ink-dim)}

/* ---------- Aufgaben-Detail ---------- */
.task-detail{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:1rem;margin:-0.15rem 0 .5rem;}
.detail-row{display:flex;flex-wrap:wrap;gap:.8rem}
.detail-row .field{flex:1;min-width:140px}
.detail-actions{display:flex;gap:.6rem;margin:.6rem 0 1rem}
.d-descr,.c-input{width:100%}
.comments h4{font-size:.78rem;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.5rem}
.comment{border-left:2px solid var(--line);padding:.3rem .7rem;margin-bottom:.5rem;font-size:.86rem}
.comment b{color:var(--accent2)}
.c-time{color:var(--ink-dim);font-size:.7rem;font-family:var(--mono);margin-left:.5rem}
.c-empty{color:var(--ink-dim);font-size:.84rem}
.c-new{display:flex;gap:.6rem;margin-top:.6rem;align-items:flex-start}
.c-new .btn{flex-shrink:0}

/* ---------- Übersicht ---------- */
.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.7rem;margin-bottom:1rem}
.stat{text-align:center;padding:1rem .6rem}
.stat b{display:block;font-size:1.6rem;font-family:var(--mono);color:var(--accent)}
.stat span{font-size:.74rem;color:var(--ink-dim)}
.stat.dim b{color:var(--ink-dim)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
@media(max-width:800px){.two-col{grid-template-columns:1fr}}
.card-h{font-size:.8rem;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.12em;margin-bottom:.6rem}
.mini-task,.mini-act{font-size:.85rem;padding:.35rem 0;border-bottom:1px solid rgba(38,44,66,.5)}
.mini-act .c-time{display:block;margin-left:0}

/* ---------- Produkte ---------- */
.prod-row .pr-title .c-time{display:block;margin-left:0}
.prod-row select.pr-status{font-size:.76rem;padding:.25rem .4rem}
.ext-link{text-decoration:none;font-size:1rem}
.cat-kuji{background:rgba(255,61,113,.15);color:var(--accent)}
.cat-exklusiv{background:rgba(255,176,46,.15);color:var(--accent2)}
.cat-standard{background:rgba(139,144,165,.15);color:var(--ink-dim)}
.cat-cross{background:rgba(45,212,167,.15);color:var(--ok)}
.st-p-freigegeben{border-left:3px solid var(--ok)}
.st-p-abgelehnt{opacity:.55}
.st-p-angelegt .t-title{color:var(--ink-dim)}
.st-lbl-freigegeben{color:var(--ok)}
.st-lbl-abgelehnt{color:var(--danger)}