:root{--cs-night:#061417;--cs-surface:#0e1f23;--cs-surface-raised:#12272c;--cs-rule-1:#173136;--cs-rule-2:#27505a;--cs-rule-3:#6e9099;--cs-text:#e9f2f1;--cs-text-muted:#8fa5a5;--cs-text-faint:#6e9099;--cs-teal:#2dd4bf;--cs-teal-hover:#5fe3d2;--cs-teal-active:#14b8a6;--cs-copper:#d08c4f;--cs-copper-print:#a2662f;--cs-paper:#efebe1;--cs-paper-ink:#0b1416;--cs-paper-muted:#4c6163;--cs-paper-rule:#b5ab94;--cs-teal-print:#0f7f72;--stamp-700:#5edca0;--stamp-600:#2e9e6b;--stamp-100:#122a20;--marker-700:#f87171;--marker-600:#c0453c;--marker-100:#2a1416;--chalk-700:#f0b45a;--chalk-600:#9c6516;--chalk-100:#2a2010;--surface-app:var(--cs-night);--surface-card:var(--cs-surface);--surface-sunken:var(--cs-surface-raised);--surface-hover:var(--cs-surface-raised);--surface-active:var(--cs-surface-raised);--surface-selected:color-mix(in srgb, var(--cs-teal) 10%, var(--cs-surface));--surface-inverse:var(--cs-night);--text-heading:var(--cs-text);--text-body:var(--cs-text);--text-muted:var(--cs-text-muted);--text-faint:var(--cs-text-faint);--text-link:var(--cs-teal);--text-link-hover:var(--cs-teal-hover);--text-danger:var(--marker-700);--text-success:var(--stamp-700);--text-warning:var(--chalk-700);--border-hairline:var(--cs-rule-1);--border-default:var(--cs-rule-2);--border-strong:var(--cs-rule-3);--border-focus:var(--cs-teal);--action-primary-bg:var(--cs-teal);--action-primary-bg-hover:var(--cs-teal-hover);--action-primary-bg-active:var(--cs-teal-active);--action-primary-fg:var(--cs-night);--action-secondary-bg:var(--cs-surface-raised);--action-secondary-bg-hover:var(--cs-rule-1);--action-danger-bg:#b23a32;--action-danger-bg-hover:var(--marker-600);--action-disabled-bg:var(--cs-rule-1);--action-disabled-fg:var(--cs-rule-3);--focus-ring:var(--cs-teal);--font-core:"Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--text-title-1:24px;--text-title-2:20px;--text-title-3:17px;--text-body-size:15px;--text-body-sm:14px;--text-label:13px;--text-caption:12px;--text-micro:11px;--text-roster-name:19px;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--radius-square:0;--radius-field:3px;--radius-control:4px;--radius-card:6px;--radius-sheet:10px;--radius-pill:999px;--row-y:14px;--cell-x:14px;--control-h:44px;--field-h:44px;--card-pad:16px;--page-pad:16px;--layout-measure:920px;--layout-sidebar-w:216px;--layout-appbar-h:56px;--layout-bottomnav-h:60px;--dur-press:80ms;--dur-tint:.12s;--dur-base:.18s;--ease-out:cubic-bezier(.22, .61, .36, 1)}[data-density=compact]{--row-y:6px;--cell-x:10px;--control-h:30px;--field-h:30px;--card-pad:12px;--page-pad:16px;--text-body-size:14px;--text-body-sm:13px;--text-label:12px;--text-title-1:20px;--text-title-2:17px;--text-title-3:15px;--layout-appbar-h:48px}@media (prefers-reduced-motion:reduce){:root{--dur-press:0s;--dur-tint:0s;--dur-base:0s}}*,:before,:after{box-sizing:border-box}html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{background:var(--surface-app);color:var(--text-body);font-family:var(--font-core);font-size:var(--text-body-size);-webkit-font-smoothing:antialiased;margin:0;line-height:1.5}h1,h2,h3,h4{color:var(--text-heading);font-weight:var(--weight-semibold);letter-spacing:-.012em;margin:0}h1{font-size:var(--text-title-1)}h2{font-size:var(--text-title-2)}h3{font-size:var(--text-title-3)}p{margin:0}a{color:var(--text-link);text-underline-offset:2px}a:hover{color:var(--text-link-hover)}:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}::selection{background:var(--surface-selected)}ul{margin:0;padding:0;list-style:none}.cs-mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.cs-caps{font-family:var(--font-mono);font-size:var(--text-micro);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}.cs-muted{color:var(--text-muted)}.cs-visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@keyframes cs-spin{to{transform:rotate(360deg)}}@keyframes cs-skeleton{0%{opacity:.55}50%{opacity:1}to{opacity:.55}}@keyframes cs-toast-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.cs-app{background:var(--surface-app);flex-direction:column;min-height:100vh;display:flex}.cs-measure{width:100%;max-width:var(--layout-measure);padding:0 var(--page-pad);margin:0 auto}.cs-topbar{z-index:5;background:var(--surface-card);border-bottom:1px solid var(--border-hairline);position:sticky;top:0}.cs-topbar__inner{min-height:var(--layout-appbar-h);padding:10px var(--page-pad);flex-wrap:wrap;align-items:center;gap:16px;display:flex}.cs-brand{font-size:var(--text-title-3);font-weight:var(--weight-semibold);color:var(--text-heading);letter-spacing:-.015em;text-decoration:none}.cs-brand__qualifier{font-family:var(--font-mono);font-size:var(--text-micro);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}.cs-brand-row{align-items:center;gap:8px;display:inline-flex}.cs-brand-row img{flex:none;width:24px;height:24px;display:block}.cs-spacer{flex:1}.cs-main{flex:1;min-width:0;padding-bottom:32px}.cs-page{flex-direction:column;gap:20px;padding:20px 0;display:flex}.cs-page__header{flex-wrap:wrap;align-items:baseline;gap:8px 16px;display:flex}.cs-stack{flex-direction:column;gap:12px;display:flex}.cs-stack--tight{gap:8px}.cs-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.cs-row--end{align-items:flex-end}.cs-split{flex-wrap:wrap;align-items:flex-start;gap:20px;display:flex}.cs-split__main{flex:480px;min-width:0}.cs-split__aside{flex:300px;max-width:340px}.cs-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));align-items:start;gap:12px;display:grid}.cs-sidebar{width:var(--layout-sidebar-w);background:var(--surface-inverse);color:#fff;flex-direction:column;flex:none;height:100vh;display:flex;position:sticky;top:0}.cs-sidebar__brand{border-bottom:1px solid #ffffff1f;padding:14px 14px 12px}.cs-sidebar__nav{flex-direction:column;flex:1;gap:1px;padding:8px;display:flex}.cs-sidebar__link{border-radius:var(--radius-field);color:#ffffffc7;height:32px;font-family:var(--font-core);font-size:var(--text-body-sm);text-align:left;cursor:pointer;background:0 0;border:0;border-left:2px solid #0000;align-items:center;gap:9px;padding:0 9px;text-decoration:none;display:flex}.cs-sidebar__link:hover{background:#ffffff14}.cs-sidebar__link[aria-current=page]{border-left-color:var(--cs-teal);color:#fff;font-weight:var(--weight-semibold);background:#ffffff21}.cs-sidebar__footer{font-size:var(--text-caption);color:#ffffffb3;border-top:1px solid #ffffff1f;flex-direction:column;gap:6px;padding:12px;display:flex}.cs-bottomnav{z-index:6;height:var(--layout-bottomnav-h);background:var(--surface-card);border-top:1px solid var(--border-default);grid-auto-columns:1fr;grid-auto-flow:column;display:grid;position:sticky;bottom:0}.cs-bottomnav__link{color:var(--text-muted);font-size:var(--text-caption);font-weight:var(--weight-medium);border-top:2px solid #0000;justify-content:center;align-items:center;margin-top:-1px;text-decoration:none;display:flex}.cs-bottomnav__link[aria-current=page]{border-top-color:var(--action-primary-bg);color:var(--cs-teal);font-weight:var(--weight-semibold)}@media (width>=720px){.cs-bottomnav{display:none}}.cs-tabnav{gap:4px;display:none}@media (width>=720px){.cs-tabnav{display:flex}}.cs-tabnav__link{border-radius:var(--radius-control);color:var(--text-muted);font-size:var(--text-body-sm);font-weight:var(--weight-medium);padding:7px 12px;text-decoration:none}.cs-tabnav__link:hover{background:var(--surface-hover);color:var(--text-heading)}.cs-tabnav__link[aria-current=page]{background:var(--surface-selected);color:var(--text-heading);font-weight:var(--weight-semibold)}.cs-button{height:var(--control-h);border-radius:var(--radius-control);font-family:var(--font-core);font-size:var(--text-body-sm);font-weight:var(--weight-semibold);cursor:pointer;transition:background var(--dur-tint) var(--ease-out), border-color var(--dur-tint) var(--ease-out);border:1px solid #0000;justify-content:center;align-items:center;gap:8px;padding:0 16px;display:inline-flex}.cs-button--primary{background:var(--action-primary-bg);color:var(--action-primary-fg)}.cs-button--primary:hover{background:var(--action-primary-bg-hover)}.cs-button--primary:active{background:var(--action-primary-bg-active)}.cs-button--secondary{background:var(--action-secondary-bg);border-color:var(--border-default);color:var(--text-heading)}.cs-button--secondary:hover{background:var(--action-secondary-bg-hover)}.cs-button--ghost{color:var(--text-link);background:0 0}.cs-button--ghost:hover{background:var(--surface-hover)}.cs-button--danger{background:var(--action-danger-bg);color:#fff}.cs-button--danger:hover{background:var(--action-danger-bg-hover)}.cs-button:disabled{background:var(--action-disabled-bg);color:var(--action-disabled-fg);cursor:default;border-color:#0000}.cs-button--block{width:100%}.cs-button--sm{height:var(--control-h);font-size:var(--text-label);padding:0 10px}.cs-button__spinner{border-radius:var(--radius-pill);border:2px solid;border-top-color:#0000;width:14px;height:14px;animation:.7s linear infinite cs-spin}.cs-field{flex-direction:column;gap:5px;display:flex}.cs-field__label{font-size:var(--text-label);font-weight:var(--weight-medium);color:var(--text-heading);letter-spacing:.02em}.cs-field__required{color:var(--text-muted)}.cs-field__hint{font-size:var(--text-caption);color:var(--text-muted)}.cs-field__error{font-size:var(--text-caption);font-weight:var(--weight-medium);color:var(--text-danger)}.cs-input,.cs-select{width:100%;height:var(--field-h);background:var(--surface-app);border:1px solid var(--border-default);border-radius:var(--radius-field);color:var(--text-heading);font-family:var(--font-core);font-size:var(--text-body-size);padding:0 10px}.cs-input::placeholder{color:var(--text-faint)}.cs-input:hover,.cs-select:hover{border-color:var(--border-strong)}.cs-input[aria-invalid=true],.cs-select[aria-invalid=true]{border-color:var(--action-danger-bg)}.cs-input:disabled,.cs-select:disabled{background:var(--action-disabled-bg);color:var(--action-disabled-fg)}.cs-checkbox{width:16px;height:16px;accent-color:var(--action-primary-bg)}.cs-card{background:var(--surface-card);border:1px solid var(--border-hairline);border-radius:var(--radius-card);overflow:hidden}.cs-card--panel{border-color:var(--border-default)}.cs-card--sunken{background:var(--surface-sunken)}.cs-card--register{border-radius:var(--radius-square);border-color:var(--border-default)}.cs-card--marked{border-left:3px solid var(--action-primary-bg);border-radius:0 var(--radius-card) var(--radius-card) 0}.cs-card__header{padding:10px var(--card-pad);background:var(--surface-app);border-bottom:1px solid var(--border-hairline);align-items:center;gap:10px;display:flex}.cs-card__title{font-size:var(--text-title-3);font-weight:var(--weight-semibold)}.cs-card__meta{font-size:var(--text-caption);color:var(--text-muted)}.cs-card__body{padding:var(--card-pad)}.cs-card__body--flush{padding:0}.cs-card-link{color:inherit;text-decoration:none;display:block}.cs-card-link:hover .cs-card{background:var(--surface-hover);border-color:var(--border-strong)}.cs-list__item{width:100%;padding:var(--row-y) var(--cell-x);border:0;border-bottom:1px solid var(--border-hairline);color:inherit;font-family:var(--font-core);font-size:var(--text-body-sm);text-align:left;background:0 0;align-items:center;gap:10px;text-decoration:none;display:flex}.cs-list__item:last-child{border-bottom:0}a.cs-list__item:hover,button.cs-list__item:hover{background:var(--surface-hover);cursor:pointer}.cs-table-scroll{overflow-x:auto}.cs-table{border-collapse:collapse;width:100%;font-size:var(--text-body-sm)}.cs-table th{padding:8px var(--cell-x);background:var(--surface-app);border-bottom:1px solid var(--border-default);color:var(--text-muted);font-size:var(--text-caption);font-weight:var(--weight-semibold);letter-spacing:.02em;text-align:left;white-space:nowrap;position:sticky;top:0}.cs-table td{padding:var(--row-y) var(--cell-x);border-bottom:1px solid var(--border-hairline);vertical-align:middle}.cs-table tbody tr:hover{background:var(--surface-hover)}.cs-table__num{text-align:right}.cs-roster__row{padding:12px var(--cell-x) 14px;background:var(--surface-card);border-bottom:1px solid var(--border-hairline);border-left:3px solid #0000}.cs-roster__row[data-status=present]{border-left-color:var(--stamp-600)}.cs-roster__row[data-status=absent]{border-left-color:var(--marker-600)}.cs-roster__row[data-status=late]{border-left-color:var(--chalk-600)}.cs-roster__identity{align-items:center;gap:10px;margin-bottom:10px;display:flex}.cs-roster__name{min-width:0;font-size:var(--text-roster-name);font-weight:var(--weight-semibold);color:var(--text-heading);letter-spacing:-.01em;flex:1}.cs-attendance{grid-auto-columns:1fr;grid-auto-flow:column;gap:8px;display:grid}.cs-attendance__slot{background:var(--surface-app);border:1px solid var(--border-default);border-radius:var(--radius-control);min-height:56px;color:var(--text-muted);font-family:var(--font-core);font-size:var(--text-label);font-weight:var(--weight-medium);cursor:pointer;justify-content:center;align-items:center;gap:8px;display:flex}.cs-attendance__slot:hover{background:var(--surface-hover)}.cs-attendance__slot:disabled{cursor:default;opacity:.6}.cs-attendance__glyph{border:1.5px solid;justify-content:center;align-items:center;width:22px;height:22px;font-size:13px;line-height:1;display:inline-flex}.cs-attendance__slot[data-status=present] .cs-attendance__glyph{border-radius:var(--radius-pill)}.cs-attendance__slot[data-status=absent] .cs-attendance__glyph{border-radius:2px}.cs-attendance__slot[data-status=late] .cs-attendance__glyph{border-radius:var(--radius-pill)}.cs-attendance__slot[aria-pressed=true]{font-weight:var(--weight-semibold)}.cs-attendance__slot[aria-pressed=true][data-status=present]{background:var(--stamp-100);border-color:var(--stamp-600);color:var(--stamp-700)}.cs-attendance__slot[aria-pressed=true][data-status=absent]{background:var(--marker-100);border-color:var(--marker-600);color:var(--marker-700)}.cs-attendance__slot[aria-pressed=true][data-status=late]{background:var(--chalk-100);border-color:var(--chalk-600);color:var(--chalk-700)}.cs-status{font-size:var(--text-caption);font-weight:var(--weight-medium);align-items:center;gap:7px;display:inline-flex}.cs-status__glyph{border:1.5px solid;justify-content:center;align-items:center;width:18px;height:18px;font-size:11px;line-height:1;display:inline-flex}.cs-status[data-status=present]{color:var(--text-success)}.cs-status[data-status=present] .cs-status__glyph{border-radius:var(--radius-pill)}.cs-status[data-status=absent]{color:var(--text-danger)}.cs-status[data-status=absent] .cs-status__glyph{border-radius:2px}.cs-status[data-status=late]{color:var(--text-warning)}.cs-status[data-status=late] .cs-status__glyph{border-radius:var(--radius-pill)}.cs-status[data-status=unmarked]{color:var(--text-faint)}.cs-status[data-status=unmarked] .cs-status__glyph{border-radius:var(--radius-pill);border-style:dashed}.cs-sync{border-radius:var(--radius-pill);min-height:28px;font-size:var(--text-caption);font-weight:var(--weight-medium);align-items:center;gap:7px;padding:3px 10px;display:inline-flex}.cs-sync[data-state=pending]{background:var(--surface-sunken);border:1px dashed var(--border-strong);color:var(--text-muted)}.cs-sync[data-state=failed]{background:var(--marker-100);border:1px solid var(--action-danger-bg);color:var(--text-danger)}.cs-sync[data-state=synced]{color:var(--text-success)}.cs-badge{border:1px solid var(--border-default);border-radius:var(--radius-field);font-size:var(--text-caption);font-weight:var(--weight-medium);color:var(--text-body);align-items:center;padding:2px 7px;display:inline-flex}.cs-badge[data-tone=info]{background:var(--surface-selected);border-color:var(--cs-teal-active);color:var(--cs-teal)}.cs-badge[data-tone=success]{background:var(--stamp-100);border-color:var(--stamp-600);color:var(--stamp-700)}.cs-badge[data-tone=warning]{background:var(--chalk-100);border-color:var(--chalk-600);color:var(--chalk-700)}.cs-badge[data-tone=danger]{background:var(--marker-100);border-color:var(--marker-600);color:var(--marker-700)}.cs-empty{padding:32px var(--card-pad);flex-direction:column;align-items:flex-start;gap:10px;display:flex}.cs-empty__title{font-size:var(--text-title-3);font-weight:var(--weight-semibold);color:var(--text-heading)}.cs-empty__body{font-size:var(--text-body-sm);color:var(--text-muted);text-wrap:pretty;max-width:48ch}.cs-error{background:var(--marker-100);border:1px solid var(--action-danger-bg);border-radius:var(--radius-card);flex-direction:column;align-items:flex-start;gap:8px;padding:14px;display:flex}.cs-error__title{font-weight:var(--weight-semibold);color:var(--text-danger)}.cs-error__body{font-size:var(--text-body-sm);color:var(--text-body)}.cs-toast-region{right:0;bottom:calc(var(--layout-bottomnav-h) + 16px);z-index:20;pointer-events:none;justify-content:center;padding:0 16px;display:flex;position:fixed;left:0}@media (width>=720px){.cs-toast-region{bottom:24px}}.cs-toast{background:var(--surface-inverse);border:1px solid var(--border-default);border-radius:var(--radius-card);max-width:520px;color:var(--text-heading);font-size:var(--text-body-sm);pointer-events:auto;animation:cs-toast-in var(--dur-base) var(--ease-out);align-items:center;gap:12px;padding:10px 12px;display:inline-flex}.cs-toast__action{border-radius:var(--radius-control);color:inherit;font-family:var(--font-core);font-size:var(--text-label);font-weight:var(--weight-semibold);cursor:pointer;background:0 0;border:1px solid #fff6;padding:4px 10px}.cs-scrim{z-index:30;background:#0b0e146b;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.cs-modal{background:var(--surface-card);border:1px solid var(--border-default);border-radius:var(--radius-sheet);width:100%;max-width:420px;padding:20px;box-shadow:0 24px 60px #00000080}.cs-skeleton{background:var(--surface-sunken);border-radius:var(--radius-field);animation:1.2s ease-in-out infinite cs-skeleton}.cs-skeleton__row{height:14px;margin-bottom:10px}.cs-auth{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.cs-auth__card{background:var(--surface-card);border:1px solid var(--border-default);border-radius:var(--radius-card);width:100%;max-width:380px;padding:24px}.cs-auth__form{flex-direction:column;gap:14px;margin-top:18px;display:flex}
