:root{--navy:#1f3a5f;--blue:#2f6fb2;--bg:#f4f6f9;--line:#d9dee6;--ok:#1d7a46;--warn:#b26a00;--bad:#b42318;--muted:#5f6b7a}
*{box-sizing:border-box}body{margin:0;font:15px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:#1b2430}
a{color:var(--blue)}header.top{background:var(--navy);color:#fff;display:flex;align-items:center;gap:18px;padding:10px 20px;flex-wrap:wrap}
header.top .brand{font-weight:700;font-size:17px;color:#fff;text-decoration:none}header.top nav a{color:#dfe8f5;text-decoration:none;margin-right:14px}
header.top nav a.on,header.top nav a:hover{color:#fff;text-decoration:underline}header.top .who{margin-left:auto;display:flex;gap:10px;align-items:center;font-size:13px}
main{max-width:1240px;margin:0 auto;padding:20px}h1{font-size:22px;margin:4px 0 14px}h2{font-size:17px;margin:22px 0 8px}
.card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px;margin-bottom:16px}
table{border-collapse:collapse;width:100%;background:#fff}th,td{padding:7px 9px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{background:#eef2f7;font-size:13px;color:#344054}td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
.btn,button{display:inline-block;background:var(--blue);color:#fff;border:0;border-radius:7px;padding:7px 13px;font:inherit;cursor:pointer;text-decoration:none}
.btn.secondary,button.secondary{background:#e7ecf3;color:#1b2430}.btn.danger,button.danger{background:var(--bad)}.btn.ok,button.ok{background:var(--ok)}
.btn.small,button.small{padding:3px 9px;font-size:13px}
input,select,textarea{font:inherit;padding:6px 8px;border:1px solid #b9c2cf;border-radius:6px;background:#fff;max-width:100%}
label{display:block;font-weight:600;font-size:13px;margin:10px 0 3px}label.inline{display:inline-flex;gap:6px;font-weight:400;align-items:center;margin-right:12px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:end}
.stats{display:flex;gap:12px;flex-wrap:wrap}.stat{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 16px;min-width:150px}
.stat b{display:block;font-size:26px}.muted{color:var(--muted)}.small{font-size:13px}
.pill{display:inline-block;border-radius:999px;padding:1px 9px;font-size:12px;font-weight:600;background:#e7ecf3}
.pill.in,.pill.approved{background:#d9f2e3;color:var(--ok)}.pill.break,.pill.pending{background:#fff1d6;color:var(--warn)}
.pill.out,.pill.cancelled{background:#eceff3;color:#555}.pill.denied,.pill.flag{background:#fde2e0;color:var(--bad)}
.flash{background:#e6f4ea;border:1px solid #b7dfc3;padding:10px 14px;border-radius:8px;margin-bottom:14px}
.error{background:#fdecea;border:1px solid #f5c2bd;padding:10px 14px;border-radius:8px;margin-bottom:14px;color:#7a1d14}
.board{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.who-card{display:flex;gap:10px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;align-items:center}
.thumb{width:64px;height:64px;object-fit:cover;border-radius:8px;background:#dde3ea;flex:none;display:flex;align-items:center;justify-content:center;color:#777;font-size:11px}
.punch-photo{width:90px;height:68px;object-fit:cover;border-radius:6px;cursor:zoom-in}
details summary{cursor:pointer;color:var(--blue)}.inline-form{display:inline}
.formrow{display:grid;grid-template-columns:2fr 1fr 2fr auto auto;gap:6px;margin-bottom:6px;align-items:center}
.login{max-width:380px;margin:60px auto}.secret{font-family:ui-monospace,monospace;background:#fff7d6;padding:8px 10px;border-radius:6px;word-break:break-all}
.daytable td.flag{color:var(--bad)}tr.deleted td{text-decoration:line-through;color:#999}
@media print{header.top,.noprint{display:none}main{max-width:none;padding:0}body{background:#fff}.card{border:0;padding:0}}