:root{
          --navy:#1b2a59;--navy-d:#0c1530;--navy-m:#243278;--navy-l:#eef1f8;
          --gold:#b89a4e;--gold-d:#8a7a3e;--gold-l:#f9f5e8;--gold-m:#d9c27e;
          --ink:#0a1124;--bg:#eef1f8;--border:#e2e6f0;--text:#1e2d4e;--muted:#6b7793;
          --green:#0e9f6e;--red:#e02424;
          --shadow-sm:0 2px 8px rgba(12,21,48,.06);--shadow-md:0 12px 32px rgba(12,21,48,.10);
          --e-out:cubic-bezier(.16,1,.3,1);
        }
        body{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased;background:var(--bg);color:var(--text);font-size:14px;}
        ::selection{background:var(--gold-m);color:var(--ink);}

        /* Topbar wie Karrieresystem */
        #tb{height:62px;background:rgba(10,17,36,.96);display:flex;align-items:center;padding:0 26px;gap:18px;flex-shrink:0;border-bottom:1px solid rgba(255,255,255,.06);}
        .tb-logo-img{width:40px;height:40px;object-fit:contain;filter:drop-shadow(0 3px 8px rgba(184,154,78,.35));}
        .tb-name{font-size:14.5px;font-weight:800;color:#fff;letter-spacing:-.3px;}
        .tb-sub{font-size:10px;color:rgba(255,255,255,.4);font-weight:600;letter-spacing:1px;text-transform:uppercase;margin-top:1px;}
        .tb-div{width:1px;height:24px;background:rgba(255,255,255,.12);}
        .tb-bc{color:rgba(255,255,255,.55);font-size:13px;font-weight:500;}
        .tb-pill{font-size:11px;font-weight:700;padding:5px 13px;border-radius:30px;background:rgba(255,255,255,.07);color:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;gap:8px;}
        .tb-btn{font-size:12px;font-weight:700;padding:8px 16px;border-radius:30px;background:rgba(255,255,255,.07);color:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.14);transition:all .18s;}
        .tb-btn,.tb-pill{white-space:nowrap;}
        @media(max-width:1100px){.tb-bc,.tb-div{display:none;}}
        .tb-btn:hover{background:rgba(255,255,255,.14);color:#fff;}
        .tb-btn.gold{background:linear-gradient(120deg,var(--gold),var(--gold-d));color:#fff;border-color:transparent;box-shadow:0 3px 10px rgba(184,154,78,.35);}
        .tb-btn.gold:hover{filter:brightness(1.08);}

        /* Sidebar */
        #side{width:250px;background:linear-gradient(175deg,#0e1c42 0%,var(--navy) 60%,var(--navy-m) 100%);position:relative;overflow:hidden;}
        #side::before{content:'';position:absolute;inset:0;opacity:.4;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:20px 20px;mask-image:radial-gradient(circle at 30% 0%,#000,transparent 85%);-webkit-mask-image:radial-gradient(circle at 30% 0%,#000,transparent 85%);}
        #side>*{position:relative;}
        .side-lbl{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:1.4px;color:rgba(255,255,255,.42);padding:22px 22px 8px;}
        .sidebar-item{color:rgba(255,255,255,.62);font-weight:600;font-size:13px;border:1px solid transparent;border-radius:12px !important;transition:all .18s;}
        .sidebar-item i{width:18px;text-align:center;color:rgba(217,194,126,.7);}
        .sidebar-item:hover{background:rgba(255,255,255,.06) !important;color:#fff;}
        .sidebar-item.active{background:rgba(255,255,255,.09) !important;border-color:rgba(255,255,255,.12);color:#fff;box-shadow:inset 3px 0 0 var(--gold-m);}
        .sidebar-item.active i{color:var(--gold-m);}
        #inbox-count{background:linear-gradient(120deg,var(--gold),var(--gold-d)) !important;font-weight:800;}
        #side-footer{border-top:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.45);}

        /* Seitenkopf */
        .page-head{display:flex;align-items:center;gap:14px;margin-bottom:26px;}
        .page-head h1{font-size:24px;font-weight:900;color:var(--navy);letter-spacing:-.6px;}
        .page-head .eyebrow{font-size:10.5px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold-d);background:var(--gold-l);border:1px solid #eadfbd;padding:5px 12px;border-radius:30px;}

        .custom-scrollbar::-webkit-scrollbar,#content::-webkit-scrollbar{width:10px;}
        .custom-scrollbar::-webkit-scrollbar-thumb,#content::-webkit-scrollbar-thumb{background:rgba(27,42,89,.18);border-radius:10px;border:3px solid transparent;background-clip:padding-box;}

        /* Karten mit Goldstreifen */
        .card{position:relative;background:#fff;border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow-sm);overflow:hidden;transition:box-shadow .35s var(--e-out);}
        .card::before{content:'';position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--gold-m),var(--gold),var(--gold-d));}
        .card.navy::before{background:linear-gradient(90deg,var(--navy-m),var(--navy));}
        .card.green::before{background:linear-gradient(90deg,#2dd4bf,var(--green));}
        .card h4{color:var(--navy);font-weight:900 !important;letter-spacing:-.3px;}
        .stat-lbl{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:var(--muted);}
        .stat-val{font-size:32px;font-weight:900;color:var(--navy);letter-spacing:-1px;margin-top:6px;font-variant-numeric:tabular-nums;}

        .inp{width:100%;padding:.55rem .7rem;border:1px solid var(--border);border-radius:10px;font-size:13px;outline:none;background:#fbfcfe;color:var(--text);font-family:inherit;transition:border-color .15s,box-shadow .15s;}
        .inp:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(184,154,78,.18);background:#fff;}
        .lbl{font-size:10px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.9px;display:block;margin-bottom:.3rem;}
        .btn{background:linear-gradient(120deg,var(--gold),var(--gold-d));color:#fff;padding:.6rem 1.2rem;border-radius:30px;font-size:13px;font-weight:800;box-shadow:0 3px 10px rgba(184,154,78,.35);transition:filter .15s,transform .15s;}
        .btn:hover{filter:brightness(1.08);}
        .btn:active{transform:translateY(1px);}
        .btn:disabled{opacity:.6;}
        .btn2{background:var(--navy-l);color:var(--navy);padding:.6rem 1.2rem;border-radius:30px;font-size:13px;font-weight:700;border:1px solid var(--border);transition:all .15s;}
        .btn2:hover{background:#e3e8f4;}
        input[type=checkbox]{accent-color:var(--gold-d);}

        /* Tabelle wie Karrieresystem */
        table thead{background:#fff !important;}
        table th{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);border-bottom:2px solid var(--border);}
        table tbody tr:nth-child(odd) td{background:#fbfcfe;}
        table tbody tr:hover td{background:var(--gold-l);}
        table tbody tr.sel td{background:var(--gold-l);}
        .bar{height:8px;background:var(--navy-l);border-radius:10px;}
        .bar>div{height:8px;border-radius:10px;background:linear-gradient(90deg,var(--navy-m),var(--navy));}
        .note{font-size:12px;color:var(--muted);line-height:1.65;background:var(--gold-l);border-left:3px solid var(--gold);border-radius:0 10px 10px 0;padding:11px 15px;}
        .note b{color:var(--gold-d);}
        .ph-btn{background:var(--navy-l);color:var(--navy);font-size:11.5px;font-weight:700;padding:4px 10px;border-radius:30px;border:1px solid var(--border);font-family:ui-monospace,monospace;}
        .ph-btn:hover{background:var(--gold-l);border-color:#eadfbd;color:var(--gold-d);}
        .avatar{width:64px;height:64px;border-radius:50%;background:linear-gradient(150deg,var(--gold-m),var(--gold-d));color:#fff;font-weight:900;font-size:22px;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(184,154,78,.35);margin:0 auto;}
        #toast{transition:opacity .3s;}

/* ═══════════ LOGIN ═══════════ */
.hidden{display:none !important;}
.login-body{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#0a1430;position:relative;overflow:hidden;padding:24px 16px;}
.login-bg{position:fixed;inset:-30%;z-index:0;pointer-events:none;
  background:
    radial-gradient(40% 50% at 18% 28%, rgba(184,154,78,.32), transparent 60%),
    radial-gradient(42% 48% at 82% 18%, rgba(91,179,212,.22), transparent 62%),
    radial-gradient(55% 60% at 62% 95%, rgba(36,50,120,.6), transparent 60%);
  filter:blur(28px);}
.login-wrap{position:relative;z-index:1;width:100%;max-width:420px;}
.login-brand{display:flex;align-items:center;gap:12px;justify-content:center;margin-bottom:22px;}
.login-card{padding:34px 32px 26px;box-shadow:0 30px 70px rgba(12,21,48,.35);}
.login-kick{display:inline-flex;font-size:10.5px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold-d);background:var(--gold-l);border:1px solid #eadfbd;padding:5px 12px;border-radius:30px;margin-bottom:14px;}
.login-title{font-size:26px;font-weight:900;color:var(--navy);letter-spacing:-.7px;}
.login-sub{font-size:13px;color:var(--muted);margin:6px 0 22px;}
.login-error{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c;font-size:13px;font-weight:600;padding:10px 14px;border-radius:12px;margin-bottom:16px;}
.code-inp{font-size:22px;letter-spacing:8px;text-align:center;font-variant-numeric:tabular-nums;}
.login-foot{font-size:11px;color:var(--muted);text-align:center;margin-top:16px;}