:root { --ink:#11233d; --blue:#16365e; --blue-light:#e8f0f9; --accent:#d98f20; --paper:#fff; --mist:#f4f7fb; --muted:#627186; --line:#d8e1ec; --success:#1c7a50; --danger:#b42318; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--mist); font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size:16px; line-height:1.5; }
button, input, textarea, select { font:inherit; }
.topbar { min-height:72px; padding:0 5vw; display:flex; align-items:center; justify-content:space-between; background:var(--blue); color:#fff; }
.brand { display:flex; align-items:center; gap:.7rem; letter-spacing:.01em; font-size:1.02rem; }.brand b { font-weight:750; }.brand-mark { width:30px; height:30px; display:grid; place-items:center; background:#fff; color:var(--blue); border-radius:50%; font-weight:850; }
main { width:min(940px, 92vw); margin:0 auto; padding:4.5rem 0 5rem; }.view { display:none; }.view.active { display:block; }
.intro { max-width:690px; margin:0 auto 2.25rem; }.eyebrow { margin:0 0 .5rem; color:var(--accent); font-weight:750; font-size:.82rem; text-transform:uppercase; letter-spacing:.1em; } h1 { margin:0; font-size:clamp(2rem, 4.6vw, 3.35rem); letter-spacing:-.045em; line-height:1.05; } .intro > p:last-child, .review-header p { color:var(--muted); font-size:1.06rem; margin:1rem 0 0; }
.report-card, .unlock-card, .employee-week, .empty-state { background:var(--paper); border:1px solid var(--line); border-radius:18px; box-shadow:0 16px 35px rgba(18, 43, 76, .07); }.report-card { padding:clamp(1.25rem, 4vw, 2.4rem); }
.field-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:1rem 1.25rem; margin-bottom:1.25rem; }label { display:flex; flex-direction:column; gap:.45rem; color:#34445b; font-weight:700; font-size:.9rem; } label span { color:var(--muted); font-weight:500; }
input, textarea, select { width:100%; padding:.75rem .85rem; border:1px solid #bfcddd; border-radius:9px; color:var(--ink); background:#fff; font-size:1rem; line-height:1.4; transition:border-color .15s, box-shadow .15s; } input[readonly] { background:#f4f7fa; color:#536277; }textarea { resize:vertical; min-height:7rem; }.wide-label { margin-top:1.25rem; } input:focus, textarea:focus, select:focus { outline:0; border-color:#3073b9; box-shadow:0 0 0 3px rgba(48,115,185,.16); }
.form-footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1.75rem; }.status { margin:0; color:var(--success); font-size:.92rem; font-weight:650; }.status.error { color:var(--danger); }
button { cursor:pointer; border:0; border-radius:9px; min-height:44px; padding:.68rem 1rem; font-weight:750; transition:transform .15s, filter .15s; }button:hover { filter:brightness(.96); }button:active { transform:translateY(1px); }button:disabled { opacity:.65; cursor:wait; }.primary-button { background:var(--blue); color:#fff; }.secondary-button { background:var(--blue-light); color:var(--blue); }.text-button { min-height:0; padding:.35rem .2rem; background:transparent; color:#fff; border-radius:0; border-bottom:1px solid rgba(255,255,255,.5); }
.review-header { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; margin-bottom:2rem; }.review-header h1 { font-size:clamp(2rem, 4vw, 2.8rem); }.unlock-card { max-width:540px; padding:1.75rem; }.unlock-card h2 { margin:0; font-size:1.35rem; }.unlock-card > p { color:var(--muted); }.unlock-row { display:flex; gap:.75rem; align-items:flex-start; }.unlock-row input { flex:1; }
.week-controls { display:flex; align-items:end; flex-wrap:wrap; gap:.75rem; padding:1.25rem; background:#e8f0f9; border-radius:13px; }.week-controls label { flex:1 1 200px; }.week-range { margin:1.35rem 0 .75rem; color:var(--muted); font-weight:700; }.weekly-results { display:grid; gap:1rem; }.employee-week { overflow:hidden; }.employee-heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.35rem 1.5rem; border-bottom:1px solid var(--line); background:#fbfcfe; }.employee-heading h2 { margin:0; font-size:1.2rem; }.employee-heading p { margin:.2rem 0 0; color:var(--muted); font-size:.9rem; }.report-count { color:var(--blue); background:var(--blue-light); padding:.3rem .55rem; border-radius:999px; white-space:nowrap; font-weight:750; font-size:.85rem; }.daily-entry { padding:1.15rem 1.5rem; border-top:1px solid var(--line); }.daily-entry:first-child { border-top:0; }.daily-entry h3 { margin:0 0 .55rem; font-size:.96rem; }.daily-entry p { margin:.35rem 0 0; }.work-copy { color:#263d5c; }.note-copy { margin-top:.9rem; padding:.75rem .9rem; background:#fff7e8; border-left:3px solid var(--accent); border-radius:4px; color:#5f491f; font-size:.94rem; }.no-entry { color:#7d8999; background:#fbfcfe; }.empty-state { padding:2.3rem; text-align:center; }.empty-state h2 { margin:0; }.empty-state p { color:var(--muted); }footer { padding:1.6rem; border-top:1px solid var(--line); color:#6a788a; background:#fff; text-align:center; font-size:.88rem; }
@media (max-width:620px) { .topbar { padding:0 4vw; }.brand { font-size:.9rem; }main { width:min(94vw, 940px); padding-top:2.8rem; }.field-grid { grid-template-columns:1fr; }.form-footer, .review-header, .unlock-row { align-items:stretch; flex-direction:column; }.form-footer .primary-button { width:100%; }.employee-heading { align-items:flex-start; flex-direction:column; }.week-controls > button { width:100%; } }
@media print { @page { margin:.55in; } body { background:#fff; font-size:11pt; } .topbar, footer, #report-view, .review-header, .week-controls, .unlock-card { display:none !important; } main { width:100%; margin:0; padding:0; } #admin-view, #weekly-content { display:block !important; } .week-range { font-size:13pt; color:#000; margin:0 0 12pt; } .employee-week { box-shadow:none; border:1px solid #aaa; border-radius:0; break-inside:avoid; } .employee-heading { padding:9pt 11pt; background:#f2f2f2; }.daily-entry { padding:8pt 11pt; }.daily-entry h3 { font-size:10.5pt; }.note-copy { background:#f8f8f8; } }