*{box-sizing:border-box}:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#172033;background:#f3f6fb}body{margin:0;min-width:320px}.page{min-height:100vh;display:grid;place-items:center;padding:24px}.panel{width:min(100%,480px);background:#fff;border:1px solid #e4e9f1;border-radius:20px;padding:36px;box-shadow:0 18px 55px #14264614}.brand-mark{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;color:#fff;background:#1769aa;font-weight:800}.eyebrow{margin:24px 0 8px;color:#1769aa;letter-spacing:.12em;font-size:11px;font-weight:800}h1{margin:0;font-size:30px}.subtitle{color:#657187;line-height:1.5;margin:10px 0 26px}button{width:100%;border:0;border-radius:10px;padding:13px 16px;background:#1769aa;color:#fff;font-weight:700;cursor:pointer}button:disabled{opacity:.6;cursor:wait}.secondary{background:#edf2f8;color:#26364d}.actions{display:grid;gap:10px}.account{display:grid;gap:4px;background:#f5f8fc;border-radius:10px;padding:14px;margin-bottom:14px;overflow-wrap:anywhere}.account span,.footnote{color:#718096;font-size:12px}.profile{margin-top:22px;padding:18px;border:1px solid #e4e9f1;border-radius:12px;overflow-wrap:anywhere}.profile h2{margin-top:0;font-size:17px}.profile p{font-size:14px}.error{color:#b42318;background:#fff1f0;padding:12px;border-radius:8px;font-size:13px}.warning{color:#925d00;background:#fff8e6;padding:10px;border-radius:8px}.footnote{margin:24px 0 0;text-align:center}@media(max-width:480px){.panel{padding:26px 20px}}.attendance-card{margin-top:22px;text-align:left}.attendance-card h2{font-size:19px;margin:0 0 14px}.site-card{display:grid;gap:7px;padding:16px;border-radius:12px;background:#f5f8fc;color:#26364d}.muted-label,.detail-grid span{color:#718096;font-size:11px;text-transform:uppercase;letter-spacing:.06em}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}.detail-grid div{display:grid;gap:4px}.detail-grid strong{font-size:13px}.mark-status{text-align:center;padding:22px 8px 14px}.mark-status h3{margin:8px 0;font-size:18px}.mark-status p{margin:5px 0;color:#657187;font-size:13px}.status-icon{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;margin:0 auto;font-size:28px;font-weight:800}.neutral-icon{background:#e8f2fb;color:#1769aa}.pending-icon{background:#fff4d8;color:#966400}.success-icon{background:#e5f7ed;color:#16834a}.mark-button{min-height:50px;letter-spacing:.04em}.success-message{margin-top:12px;padding:12px;border-radius:9px;color:#126b3a;background:#e8f7ee;font-size:13px}.gps-note{color:#718096;font-size:11px;line-height:1.5;text-align:center}
