:root{
  --ink: #0c0a09;
  --ink-2: #16120f;
  --ink-3: #1c1712;
  --paper: #e9e1d0;
  --paper-dim: #b9ae97;
  --lacquer: #7a1620;
  --lacquer-bright: #a52430;
  --gold: #b8934a;
  --gold-soft: #8a7140;
  --seal: #b3272d;
  --discord: #5865F2;
}

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

body{
  background:var(--ink);
  color:var(--paper);
  font-family:'Inter', sans-serif;
  font-weight:300;
}

a{color:inherit;text-decoration:none;}

h1,h2,h3{font-family:'Noto Serif SC', serif; font-weight:700; letter-spacing:0.02em;}

/* ---------- Login-Fenster ---------- */
.login-screen{
  min-height:100svh;
  display:flex; align-items:center; justify-content:center;
  padding:24px;
  background:
    radial-gradient(ellipse 90% 60% at 50% 0%, rgba(122,22,32,0.22), transparent 60%),
    linear-gradient(180deg, var(--ink) 0%, #0a0807 100%);
}

.login-card{
  width:100%; max-width:420px;
  border:1px solid var(--gold-soft);
  background:linear-gradient(160deg, rgba(122,22,32,0.10), rgba(184,147,74,0.04));
  padding:48px 38px;
  text-align:center;
  position:relative;
}
.login-card::before, .login-card::after{
  content:''; position:absolute; width:16px; height:16px; border:1.5px solid var(--gold);
}
.login-card::before{top:-1px; left:-1px; border-right:none; border-bottom:none;}
.login-card::after{bottom:-1px; right:-1px; border-left:none; border-top:none;}

.login-glyph{font-family:'Ma Shan Zheng', cursive; font-size:2.6rem; color:var(--seal); margin-bottom:6px;}
.login-title{font-size:1.6rem; color:var(--paper); text-transform:uppercase; margin-bottom:10px;}
.login-sub{font-size:0.9rem; color:var(--paper-dim); margin-bottom:34px; line-height:1.6;}

.btn-discord{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  width:100%; padding:15px 20px;
  background:var(--discord); color:#fff;
  font-size:0.9rem; font-weight:500; letter-spacing:0.03em;
  border:none; cursor:pointer; transition:filter .2s ease, transform .2s ease;
}
.btn-discord:hover{filter:brightness(1.1); transform:translateY(-1px);}
.btn-discord svg{width:20px; height:20px; flex-shrink:0;}

.login-error{
  margin-top:20px; padding:12px 16px;
  border:1px solid var(--seal); color:#e8b4b4; font-size:0.82rem; text-align:left;
}

/* ---------- Dashboard Layout ---------- */
.dashboard{
  display:grid; grid-template-columns:260px 1fr; min-height:100svh;
}

.sidebar{
  background:var(--ink-2); border-right:1px solid rgba(184,147,74,0.15);
  padding:28px 0; display:flex; flex-direction:column;
}
.sidebar-brand{
  display:flex; align-items:center; gap:10px; padding:0 26px 26px;
  font-family:'Noto Serif SC', serif; font-weight:900; letter-spacing:0.1em; font-size:1rem;
  border-bottom:1px solid rgba(184,147,74,0.15); margin-bottom:20px;
}
.sidebar-brand .glyph{font-family:'Ma Shan Zheng', cursive; color:var(--seal); font-size:1.5rem;}

.nav-category{
  font-size:0.68rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--gold-soft);
  padding:16px 26px 8px;
}
.nav-item{
  display:flex; align-items:center; gap:12px;
  padding:11px 26px; font-size:0.88rem; color:var(--paper-dim);
  border-left:2px solid transparent; transition:all .2s ease;
}
.nav-item:hover{color:var(--paper); background:rgba(184,147,74,0.05);}
.nav-item.active{color:var(--paper); border-left-color:var(--seal); background:rgba(122,22,32,0.12);}
.nav-item .seal-icon{
  width:26px; height:26px; border:1px solid var(--gold-soft); border-radius:3px;
  display:flex; align-items:center; justify-content:center;
  font-family:'Ma Shan Zheng', cursive; font-size:0.9rem; color:var(--gold); flex-shrink:0;
}

.sidebar-footer{margin-top:auto; padding:20px 26px 0; border-top:1px solid rgba(184,147,74,0.15);}
.user-chip{display:flex; align-items:center; gap:10px; margin-bottom:14px;}
.user-chip img{width:36px; height:36px; border-radius:4px; border:1px solid var(--gold-soft);}
.user-chip .u-name{font-size:0.85rem; color:var(--paper);}
.user-chip .u-role{font-size:0.7rem; color:var(--seal); text-transform:uppercase; letter-spacing:0.06em;}
.btn-logout{
  display:block; text-align:center; padding:9px; font-size:0.75rem;
  letter-spacing:0.1em; text-transform:uppercase; border:1px solid var(--gold-soft); color:var(--paper-dim);
  transition:all .2s ease;
}
.btn-logout:hover{border-color:var(--seal); color:var(--seal);}

.main{padding:44px 5vw;}
.main-header{margin-bottom:36px;}
.eyebrow-tag{
  display:inline-flex; align-items:center; gap:10px;
  font-size:0.72rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold);
  margin-bottom:12px;
}
.eyebrow-tag::before{content:''; width:20px; height:1px; background:var(--gold);}
.page-title{font-size:1.9rem; color:var(--paper);}
.page-lede{color:var(--paper-dim); margin-top:10px; font-size:0.95rem; max-width:640px; line-height:1.6;}

.card-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); gap:1px; background:rgba(184,147,74,0.15); border:1px solid rgba(184,147,74,0.15);}
.card{background:var(--ink); padding:28px 26px;}
.card h3{font-size:1rem; color:var(--paper); margin-bottom:8px;}
.card p{font-size:0.85rem; color:var(--paper-dim); line-height:1.6;}

.no-access{max-width:520px; margin:80px auto; text-align:center;}
.no-access .glyph{font-family:'Ma Shan Zheng', cursive; font-size:3rem; color:var(--seal); margin-bottom:14px;}

@media (max-width: 860px){
  .dashboard{grid-template-columns:1fr;}
  .sidebar{flex-direction:row; overflow-x:auto; padding:14px; align-items:center;}
  .sidebar-brand, .nav-category, .sidebar-footer{display:none;}
  .nav-item{border-left:none; border-bottom:2px solid transparent; white-space:nowrap;}
  .nav-item.active{border-bottom-color:var(--seal);}
}