:root{--ink:#102a43;--muted:#627d98;--line:#d9e2ec;--paper:#fff;--wash:#f5f7fa;--blue:#1677ff;--blue-dark:#0b5ccc;--green:#0f9d71;--amber:#c77700;--red:#c23b3b;--radius:18px;--shadow:0 12px 36px rgba(16,42,67,.08)}*{box-sizing:border-box}body{margin:0;background:var(--wash);color:var(--ink);font:16px/1.5 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.site-header{height:68px;background:rgba(255,255,255,.94);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(20px,calc((100vw - 1120px)/2));position:sticky;top:0;z-index:5;backdrop-filter:blur(12px)}.brand{font-weight:800;font-size:19px;color:var(--ink);text-decoration:none}.brand span{color:var(--blue)}nav{display:flex;gap:16px;align-items:center}nav a,nav button{border:0;background:none;color:var(--muted);font:inherit;text-decoration:none;cursor:pointer;padding:8px 0}.shell{width:min(1120px,calc(100% - 32px));margin:34px auto 70px}.narrow{max-width:700px}.loading{padding:80px;text-align:center;color:var(--muted)}h1{font-size:clamp(30px,5vw,48px);line-height:1.08;margin:.2em 0}h2{font-size:21px;margin:0 0 18px}h3{font-size:16px;margin:0}.eyebrow{color:var(--blue);font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin:0}.muted{color:var(--muted)}.grid{display:grid;gap:20px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.card{background:var(--paper);border:1px solid rgba(217,226,236,.9);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}.hero{display:grid;grid-template-columns:1.25fr .75fr;gap:24px;align-items:stretch}.hero-copy{padding:28px}.clock{font-variant-numeric:tabular-nums;font-size:18px;color:var(--muted)}.punch-card{text-align:center;display:grid;place-items:center;min-height:350px}.punch{width:190px;height:190px;border-radius:50%;border:10px solid #dcecff;background:var(--blue);color:white;font-weight:800;font-size:23px;cursor:pointer;box-shadow:0 16px 35px rgba(22,119,255,.28);transition:.15s transform}.punch:hover{transform:translateY(-2px)}.punch.out{background:var(--ink);border-color:#d9e2ec}.punch:disabled{opacity:.55;cursor:wait}.progress{height:12px;background:#e8eef4;border-radius:999px;overflow:hidden;margin:18px 0 8px}.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--blue),#35b6ff);border-radius:inherit}.metric{font-size:32px;font-weight:800}.metric small{font-size:15px;color:var(--muted);font-weight:500}.button{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:11px;background:var(--blue);color:#fff;text-decoration:none;font:600 15px inherit;padding:11px 16px;cursor:pointer}.button:hover{background:var(--blue-dark)}.button.secondary{background:#edf2f7;color:var(--ink)}.button.danger{background:#fff0f0;color:var(--red)}.button.small{padding:7px 11px;font-size:13px}.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.status{display:inline-flex;padding:4px 9px;border-radius:999px;background:#eef2f6;color:var(--muted);font-size:12px;font-weight:700;text-transform:capitalize}.status.present{background:#e4f7f0;color:#087656}.status.absent,.status.missing_out{background:#fff0f0;color:var(--red)}.status.short_hours,.status.half_day{background:#fff5db;color:var(--amber)}.status.holiday,.status.weekend{background:#edf2f7;color:#486581}.status.not_checked_in{background:#edf5ff;color:#0b5ccc}.list{display:grid;gap:10px}.list-row{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:14px 0;border-bottom:1px solid #edf2f7}.list-row:last-child{border:0}.calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.day{min-height:94px;border:1px solid var(--line);border-radius:12px;padding:10px;background:#fff}.day strong{display:block}.day .hours{font-size:12px;color:var(--muted);margin-top:10px}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse;min-width:680px}.table th,.table td{text-align:left;padding:12px;border-bottom:1px solid #edf2f7;vertical-align:top}.table th{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.04em}.form{display:grid;gap:15px}.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}label{display:grid;gap:6px;color:var(--muted);font-size:13px;font-weight:600}input,select,textarea{width:100%;border:1px solid #bcccdc;border-radius:10px;padding:11px 12px;background:#fff;color:var(--ink);font:inherit}input:focus,select:focus,textarea:focus{outline:3px solid rgba(22,119,255,.14);border-color:var(--blue)}.alert{border-radius:12px;padding:12px 14px;background:#fff5db;color:#8b5300;margin:14px 0}.alert.error{background:#fff0f0;color:var(--red)}.tabs{display:flex;gap:10px;margin-bottom:20px}.tab{background:#e8eef4;color:var(--muted)}.tab.active{background:var(--ink);color:#fff}.section-head{display:flex;justify-content:space-between;gap:16px;align-items:center;margin:0 0 18px}.prose p{max-width:65ch}.empty{padding:30px;text-align:center;color:var(--muted)}@media(max-width:760px){.site-header{padding:0 16px}nav a{display:none}.shell{margin-top:22px}.hero,.grid.two,.grid.three,.form-row{grid-template-columns:1fr}.hero-copy{padding:8px 2px}.punch-card{min-height:300px}.calendar{grid-template-columns:repeat(2,minmax(0,1fr))}.card{padding:19px}.section-head{align-items:flex-start;flex-direction:column}}