[hidden]{display:none!important}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#f6f3ef;color:#222}
header{background:#7a1f2b;color:#fff;padding:14px 18px;display:flex;justify-content:space-between;align-items:center}
main{max-width:480px;margin:auto;padding:16px}.card{background:#fff;border-radius:14px;padding:16px;margin-bottom:14px;box-shadow:0 1px 3px #0001}
.btn{display:block;width:100%;padding:20px;font-size:1.25rem;font-weight:600;border:0;border-radius:14px;margin:10px 0;color:#fff;cursor:pointer}
.btn:disabled{opacity:.3}.k{background:#2e7d32}.ps{background:#ef6c00}.pe{background:#1565c0}.g{background:#c62828}
input,select{font-size:1.05rem;padding:10px;border:1px solid #ccc;border-radius:10px;width:100%;margin:4px 0 10px}
table{width:100%;border-collapse:collapse;font-size:.9rem}td,th{padding:6px 5px;border-bottom:1px solid #eee;text-align:left;vertical-align:top}
.warn{color:#b71c1c;font-size:.83rem}.badge{display:inline-block;padding:3px 10px;border-radius:20px;font-weight:600;font-size:.85rem}
.da{background:#c8e6c9}.pause{background:#ffe0b2}.aus{background:#eee}.big{font-size:2.2rem;font-weight:700}
.muted{color:#777;font-size:.85rem}.dev-spaet{background:#fff3cd;border-left:3px solid #f0a500}.dev-abw{background:#f4f6fb}.raw{display:none;color:#777;font-size:.75rem}.dev-spaet:hover .raw,.dev-abw:hover .raw,.dev-spaet:focus .raw,.dev-abw:focus .raw,.show-raw .raw{display:block}.err{background:#ffebee;color:#b71c1c;padding:10px;border-radius:10px}
.ok{background:#e8f5e9;color:#1b5e20;padding:10px;border-radius:10px}.off{background:#fff3e0;color:#8a4b00;padding:10px;border-radius:10px;font-weight:600}
.net{font-size:.8rem;padding:3px 9px;border-radius:12px;background:#ffffff33}a{color:#7a1f2b}
.install-tip h3{margin:0 0 8px;color:#7a1f2b;font-size:1.05rem}
.install-tip ol{margin:8px 0 0;padding-left:1.2rem;font-size:.9rem;line-height:1.45}
.install-tip .btn.inst{background:#7a1f2b;padding:12px;font-size:1rem;margin-top:10px}
.payslip-list{list-style:none;padding:0;margin:0}
.payslip-list li{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #eee;gap:8px}
.payslip-list a.btn.s{display:inline-block;width:auto;padding:8px 12px;font-size:.9rem;background:#7a1f2b;margin:0;text-decoration:none;color:#fff;border-radius:10px}

.leaver{background:#fff3cd;border:3px solid #f0a500;font-size:1.05rem}.leaver h2{color:#8a5a00;margin-top:0}

.vbtn{background:#7a1f2b}body.noscroll{overflow:hidden}
.vview{position:fixed;inset:0;background:#f6f3ef;z-index:50;display:flex;flex-direction:column}
.vhead{background:#7a1f2b;color:#fff;padding:12px 14px;padding-top:max(12px,env(safe-area-inset-top));display:flex;justify-content:space-between;align-items:center}
.vx{background:none;border:0;color:#fff;font-size:1rem;padding:6px 0;cursor:pointer}
.vbody{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:10px 14px;max-width:480px;width:100%;margin:auto}
.vyear{display:flex;justify-content:center;align-items:center;gap:22px;font-size:1.2rem;margin:4px 0 6px}
.vyear button{font-size:1.4rem;background:#fff;border:1px solid #ddd;border-radius:10px;width:44px;height:40px}.vyear button:disabled{opacity:.3}
.vlegend{font-size:.78rem;color:#555;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;margin:6px 0}
.vlegend .c{display:inline-block;width:14px;height:14px;border-radius:4px;vertical-align:middle}
.vm{background:#fff;border-radius:12px;padding:8px 10px;margin-bottom:10px;box-shadow:0 1px 3px #0001}.vm h4{margin:2px 0 6px;color:#7a1f2b}
.vg{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}.vg i{font-style:normal;font-size:.7rem;color:#888;text-align:center}
.vg .d{aspect-ratio:1;border:0;border-radius:8px;background:#f3f3f3;font-size:.9rem;padding:0;color:#222;min-height:36px}
.d.past{opacity:.35}.d.heute{outline:2px solid #7a1f2b}
.frei,.d.frei{background:#ddd;color:#888}
.belegt,.d.belegt{background:repeating-linear-gradient(45deg,#ef9a9a,#ef9a9a 4px,#ffcdd2 4px,#ffcdd2 8px);color:#7f0000}
.offen,.d.offen{background:#ffe0b2;color:#8a4b00}.genehmigt,.d.genehmigt{background:#a5d6a7;color:#1b5e20}.abgelehnt,.d.abgelehnt{background:#eee;color:#999;text-decoration:line-through}
.sel,.d.sel{background:#1565c0;color:#fff}
.vfoot{background:#fff;border-top:1px solid #ddd;padding:10px 14px;padding-bottom:max(10px,env(safe-area-inset-bottom));max-height:45vh;overflow-y:auto}
.vfoot .btn{padding:14px;font-size:1.1rem;margin:6px 0}.vfoot input{margin:6px 0 0}
.vview[hidden]{display:none}

.bday{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:24px;
 background:radial-gradient(ellipse at 50% 30%,#7a1f2b 0%,#4a0f19 55%,#2a0a0f 100%);animation:bfade .6s ease}
.bday[hidden]{display:none}#bconf{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.bcard{position:relative;max-width:380px;width:100%;text-align:center;color:#f6ead0;padding:34px 26px 26px;border-radius:22px;
 background:linear-gradient(160deg,#3b1a12 0%,#2a120c 60%,#1e0d08 100%);border:1px solid #c9a24a;
 box-shadow:0 0 0 6px #c9a24a22,0 20px 60px #000a;animation:bpop .7s cubic-bezier(.2,1.3,.4,1)}
.bbull{width:112px;height:112px;border-radius:50%;border:2px solid #c9a24a;box-shadow:0 0 28px #c9a24a66;animation:bglow 3s ease-in-out infinite}
.bline{height:1px;margin:18px 30px 14px;background:linear-gradient(90deg,transparent,#c9a24a,transparent)}
.bsub{letter-spacing:.18em;text-transform:uppercase;font-size:.72rem;color:#c9a24a}
.bcard h2{font-family:Georgia,"Times New Roman",serif;font-weight:normal;font-size:1.7rem;margin:10px 0 12px;
 background:linear-gradient(90deg,#b8862b,#f3dfa2,#b8862b);-webkit-background-clip:text;background-clip:text;color:transparent}
.bcard p{line-height:1.55;font-size:1rem;margin:0 0 16px;color:#efe2c6}.bsig{font-family:Georgia,serif;font-style:italic;color:#c9a24a;margin-bottom:20px}
.bbtn{background:linear-gradient(180deg,#d8b45c,#a97c25);color:#2a120c;border:0;border-radius:24px;padding:12px 34px;font-weight:bold;font-size:1rem}
@keyframes bfade{from{opacity:0}}@keyframes bpop{from{transform:scale(.85) translateY(20px);opacity:0}}
@keyframes bglow{50%{box-shadow:0 0 44px #e8c87099}}
@media (prefers-reduced-motion:reduce){.bday,.bcard,.bbull{animation:none}}
.byears{font-family:Georgia,serif;color:#f3dfa2;font-size:1.05rem;margin-top:8px}.byears b{font-size:2.6rem;display:block;line-height:1.1;
 background:linear-gradient(90deg,#b8862b,#f3dfa2,#b8862b);-webkit-background-clip:text;background-clip:text;color:transparent}
/* Sprachauswahl + RTL (Arabisch) */
.hr{display:flex;gap:8px;align-items:center}
select.langsel{width:auto;margin:0;padding:3px 6px;font-size:.8rem;border-radius:12px;border:0;background:#ffffff33;color:#fff}
select.langsel option{color:#222}
[dir=rtl] body{text-align:right}
[dir=rtl] .vyear,[dir=rtl] .vhead{direction:rtl}
[dir=rtl] .vg{direction:rtl}
[dir=rtl] input[type=password],[dir=rtl] .big,[dir=rtl] #mtable td:nth-child(2),[dir=rtl] #mtable td:nth-child(3){direction:ltr;unicode-bidi:isolate}
[dir=rtl] ol{padding-right:1.4em;padding-left:0}