:root{--background:#f7f6f2;--surface:#fff;--surface-muted:#edeae5;--border:#d4d1ca;--text:#28251d;--text-muted:#6f6b63;--primary:#01696f;--primary-soft:#dceceb;--success:#437a22;--success-soft:#dce7d5;--warning:#da7101;--warning-soft:#f4e3d0;--radius-lg:18px;--shadow-sm:0 1px 2px #0000000a;--shadow-md:0 8px 24px #00000014}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:var(--background);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.shell{min-height:100dvh;padding:32px}.page-grid{gap:20px;max-width:1120px;margin:0 auto;display:grid}.mobile-shell{max-width:430px;min-height:100dvh;margin:0 auto;padding:18px}.card{background:var(--surface);border:1px solid color-mix(in srgb, var(--border) 70%, transparent);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:20px}.hero{background:linear-gradient(145deg, var(--primary-soft), var(--surface));box-shadow:var(--shadow-md);border-radius:28px;padding:28px}.eyebrow{color:var(--text-muted);letter-spacing:.08em;text-transform:uppercase;font-size:12px;font-weight:700}.title{letter-spacing:-.04em;margin:10px 0;font-size:clamp(32px,5vw,56px);line-height:.98}.subtitle{color:var(--text-muted);max-width:720px;margin:0;font-size:18px;line-height:1.55}.button-row{flex-wrap:wrap;gap:12px;margin-top:22px;display:flex}.button{background:var(--primary);color:#fff;border-radius:999px;justify-content:center;align-items:center;padding:12px 18px;font-weight:700;display:inline-flex}.button.secondary{background:var(--surface);border:1px solid var(--border);color:var(--text)}.stack{gap:14px;display:grid}.two-column{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;display:grid}.pill{background:var(--success-soft);color:var(--success);border-radius:999px;padding:8px 12px;font-size:13px;font-weight:800;display:inline-flex}.muted{color:var(--text-muted)}.mobile-header{align-items:center;gap:14px;margin-bottom:18px;display:flex}.avatar{background:linear-gradient(135deg, var(--primary), #006494);color:#fff;border-radius:18px;justify-content:center;align-items:center;width:56px;height:56px;font-weight:800;display:flex}.attendance-bar{background:var(--surface-muted);border-radius:999px;height:10px;overflow:hidden}.attendance-bar span{background:var(--primary);width:42%;height:100%;display:block}@media (max-width:640px){.shell{padding:18px}}