:root{
  --maroon:#8B0000;
  --navy:#002147;
  --white:#ffffff;
  --muted:#f4f4f6;
  --radius:10px;
  --max-width:980px;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

*{box-sizing:border-box}
body{background:linear-gradient(180deg,var(--muted),#ffffff); margin:0; color:#111; display:flex; justify-content:center; padding:32px;}
.container{width:100%;max-width:var(--max-width);background:var(--white);border-radius:16px;box-shadow:0 6px 30px rgba(2,6,23,0.08);overflow:hidden}
.header{display:flex;align-items:center;gap:16px;padding:20px;background:linear-gradient(90deg,var(--navy),var(--maroon));color:var(--white)}
.logo{width:56px;height:56px;border-radius:8px;background:rgba(255,255,255,0.08);display:flex;align-items:center;justify-content:center;font-weight:700}
.header h1{margin:0;font-size:18px}
.nav{padding:16px;display:flex;gap:12px;border-bottom:1px solid #eee}
a.btn{padding:8px 12px;border-radius:8px;text-decoration:none;background:var(--navy);color:var(--white);display:inline-block}
.main{padding:20px}
.card{background:#fff;border-radius:12px;padding:16px;margin-bottom:12px;box-shadow:0 1px 0 rgba(2,6,23,0.03)}
.form-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
input[type=text], input[type=password], input[type=time], textarea{padding:8px;border:1px solid #e5e7eb;border-radius:8px;min-width:0}
button.primary{background:var(--maroon);color:var(--white);border:none;padding:8px 12px;border-radius:8px;cursor:pointer}
.list{list-style:none;padding:0;margin:0}
.list li{padding:8px;border-bottom:1px solid #f1f1f1}
.footer{padding:12px;text-align:center;color:#666;font-size:13px}
.small{font-size:13px;color:#666}
.table{width:100%;border-collapse:collapse}
.table th, .table td{padding:8px;border-bottom:1px solid #f1f1f1;text-align:left}