*{box-sizing:border-box}
body{
  font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial,sans-serif;
  margin:0;
  background:#020617;
  color:#e5e7eb;
}
header{padding:16px;border-bottom:1px solid #1e293b;background:linear-gradient(180deg,#020617,#020617)}
.brand{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
h1{margin:0;font-size:28px;letter-spacing:.2px}
.sub{margin:8px 0 0;color:#94a3b8}
.pill{border:1px solid #334155;border-radius:999px;padding:6px 10px;color:#cbd5e1;font-weight:700;background:#0b1224}
main{max-width:980px;margin:0 auto;padding:16px;display:grid;gap:16px}
.card{background:#020617;border:1px solid #1e293b;border-radius:16px;padding:14px}
h2{margin:0 0 12px;font-size:16px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
label{display:flex;flex-direction:column;gap:6px;color:#cbd5e1;font-size:13px}
input{
  padding:10px;border-radius:10px;border:1px solid #334155;background:#020617;color:#e5e7eb;font-size:14px
}
textarea{
  width:100%;padding:12px;border-radius:12px;border:1px solid #334155;background:#020617;color:#e5e7eb;font-size:14px;resize:vertical
}
.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
button{
  padding:10px 12px;border-radius:12px;border:1px solid #334155;background:#0f172a;color:#e5e7eb;font-weight:700;cursor:pointer
}
button.secondary{background:#0b1224}
button.danger{background:#2a1212;border-color:#3a1a1a}
.hint{color:#94a3b8;font-size:12px;margin:10px 0 0}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.stats>div{
  background:#0b1224;border:1px solid #1e293b;border-radius:14px;padding:10px;display:flex;justify-content:space-between;gap:10px
}
.k{color:#94a3b8;font-size:12px}
.v{font-weight:900}
.mini{margin-top:10px;display:flex;justify-content:space-between;gap:10px;background:#0b1224;border:1px solid #1e293b;border-radius:14px;padding:10px}
table{width:100%;border-collapse:collapse}
th,td{border-bottom:1px solid #1e293b;padding:10px 6px;text-align:left;font-size:13px}
.file{position:relative;overflow:hidden;border:1px dashed #334155;padding:10px 12px;border-radius:12px;background:#0b1224;color:#e5e7eb;font-weight:700;cursor:pointer}
.file input{position:absolute;left:0;top:0;opacity:0;width:100%;height:100%;cursor:pointer}
footer{text-align:center;color:#64748b;padding:14px}

.calHead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.calTitle{font-weight:900}
.calSub{color:#94a3b8;font-size:12px;margin-top:2px}
.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.day{
  border:1px solid #1e293b;border-radius:14px;padding:10px;background:#0b1224;min-height:64px;cursor:pointer;position:relative
}
.day.off{opacity:.35}
.day .n{font-weight:900}
.day .a{color:#cbd5e1;font-size:12px;margin-top:6px}
.badgeDot{position:absolute;right:10px;top:10px;width:10px;height:10px;border-radius:99px;background:#60a5fa}
.badgeDot.base{background:#34d399}
.calLegend{margin-top:10px;color:#94a3b8;font-size:12px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.dot{display:inline-block;width:10px;height:10px;border-radius:99px;background:#60a5fa;margin-right:6px}
.dot.base{background:#34d399}

@media (max-width:760px){
  .grid{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
}