*{box-sizing:border-box}
body{
    margin:0;
    font-family:system-ui,Segoe UI,Roboto,Arial,sans-serif;
    background:#f6f7f9;
    color:#222;
}

a{color:#0b5cd6;text-decoration:none}
a.btn{
    display:inline-block;
    padding:.5rem .75rem;
    border:1px solid #ccd;
    border-radius:6px;
    background:#fff;
}

.topbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:.5rem 1rem;
    background:#fff;
    border-bottom:1px solid #e5e7eb;
    position:sticky;
    top:0;
    z-index:10;
}

.topbar .brand a{font-weight:700}

.container{
    max-width:1100px;
    margin:1rem auto;
    padding:0 1rem;
}

.card{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:10px;
    padding:1rem;
    margin-bottom:1rem;
    box-shadow:0 1px 0 rgba(0,0,0,.02);
}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}

/* ===== Verbesserte Lesbarkeit für dunkles Design ===== */
label{
    display:block;
    margin:.5rem 0 .25rem;
    font-weight:700;
    color:#dbeafe;
}

input,
select,
textarea{
    width:100%;
    padding:.6rem;
    border:1px solid #3b82f6;
    border-radius:8px;
    background:#081827;
    color:#ffffff;
}

input::placeholder,
textarea::placeholder{
    color:#94a3b8;
}

button{
    padding:.6rem .9rem;
    border:1px solid #cfd4d9;
    border-radius:8px;
    background:#0b5cd6;
    color:#fff;
    font-weight:600;
    cursor:pointer;
}

button:hover{opacity:.95}

.btn.danger{
    border-color:#f3b1b1;
    color:#a00;
}

.flash{
    background:#ecf3ff;
    border:1px solid #cfe0ff;
    padding:.5rem 1rem;
    border-radius:8px;
    margin-bottom:1rem;
}

.error{
    background:#ffecec;
    border:1px solid #ffcece;
    color:#900;
    padding:.5rem 1rem;
    border-radius:8px;
    margin-top:1rem;
}

.muted{color:#94a3b8}

.calendar{width:100%;border-collapse:collapse}
.calendar th,.calendar td{
    border:1px solid #e5e7eb;
    vertical-align:top;
    padding:.25rem;
    min-height:80px
}

.calendar.big td{min-height:110px}

.calendar .daynum{
    font-weight:700;
    font-size:.9rem;
    margin-bottom:.25rem
}

.calendar .ev{
    background:#f0f7ff;
    border:1px dashed #d0e2ff;
    border-radius:6px;
    padding:.1rem .25rem;
    margin-bottom:.2rem;
    font-size:.85rem
}

.calendar .empty{background:#fafbfc}

.table{width:100%;border-collapse:collapse}
.table th,.table td{
    border-bottom:1px solid #eee;
    padding:.5rem;
    text-align:left
}

.table .num{text-align:right}

.footer{
    padding:2rem 1rem;
    text-align:center;
    color:#777
}

.nav{
    display:flex;
    gap:.5rem;
    align-items:center;
    margin-bottom:.5rem
}