:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#192b39;background:#f4f6fa;font-size:14px;--ink:#152f3c;--teal:#06766d;--line:#dfe6ed;--muted:#6e7d8e}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}.app-shell{display:grid;grid-template-columns:244px minmax(0,1fr);min-height:100vh}.sidebar{background:#102f3d;color:#c8d8df;padding:30px 22px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}.brand{color:#fff;font-size:22px;font-weight:750;letter-spacing:-.7px;display:flex;gap:10px;align-items:center}.brand-icon{background:#23b2a1;border-radius:12px;color:#062e34;padding:8px 11px}.brand small{display:block;font-size:10px;font-weight:500;letter-spacing:2px;color:#92b4c0;margin-top:5px}.nav-label{font-size:10px;letter-spacing:2px;margin:40px 12px 14px;color:#789ba9}.nav-link{display:flex;gap:12px;padding:13px 14px;border-radius:9px;margin:5px 0;font-size:13px;font-weight:550}.nav-link.active{background:#22515d;color:#9af2d9}.nav-link:hover{background:#1a4553}.sidebar-foot{margin-top:auto;border-top:1px solid #2d4d5b;padding-top:22px;font-size:12px}.avatar-circle{width:34px;height:34px;background:#d8eee9;color:#11665e;display:grid;place-items:center;border-radius:50%;font-weight:700}.topbar{height:76px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 38px}.topbar .eyebrow{font-size:11px;color:var(--muted)}.topbar strong{font-size:13px}.workspace{max-width:1440px;margin:auto;padding:34px 38px 60px}.page-head{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:26px}.eyebrow{text-transform:uppercase;font-size:10px;letter-spacing:1.7px;font-weight:700;color:var(--teal)}h1{font-size:30px;letter-spacing:-1.2px;margin:8px 0 9px;font-weight:750}h2{font-size:18px;letter-spacing:-.5px;margin:0 0 14px}h3{font-size:15px;margin:0 0 10px}p{line-height:1.6;margin:6px 0}.muted{color:var(--muted)}.small{font-size:12px}.flex{display:flex;align-items:center;gap:12px}.between{justify-content:space-between}.wrap{flex-wrap:wrap}.flow-stack{display:grid;gap:16px}.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-bottom:24px}.metric{border:1px solid var(--line);background:#fff;padding:19px 20px;border-radius:12px}.metric strong{display:block;font-size:29px;letter-spacing:-1px;margin:8px 0 3px}.metric .small{font-size:11px}.card{display:block;background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 2px 3px #142b3d03;padding:23px}.period-card{position:relative;padding:22px 24px;border-left:4px solid #45a79a}.period-card.cancelled{border-left-color:#a7b0bc;background:#fafbfc}.period-card h3{font-size:21px;letter-spacing:-.6px}.period-number{background:#e7f4f0;border-radius:10px;color:#167267;padding:13px 15px;text-align:center;font-size:17px;font-weight:700}.period-number small{display:block;font-size:9px;letter-spacing:1px;font-weight:600;margin-bottom:3px}.period-meta{display:flex;gap:18px;font-size:12px;color:var(--muted);margin:10px 0 18px}.divider-line{border-top:1px solid #edf0f3;margin:16px 0}.badge{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:6px;font-size:10px;font-weight:650;white-space:nowrap;background:#eef2f6;color:#536479;border:0;height:auto}.badge-green{background:#e3f4ed;color:#117451}.badge-amber{background:#fff2d9;color:#966100}.badge-red{background:#feeaec;color:#ac354c}.badge-blue{background:#e9efff;color:#3b5cc0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:9px 15px;border-radius:8px;border:1px solid #dce4e9;background:#fff;color:#243b49;font-size:12px;font-weight:650;box-shadow:none;height:auto}.btn:hover{background:#f0f5f6}.btn-primary{background:#087b70;border-color:#087b70;color:white}.btn-primary:hover{background:#075f58}.btn-sm{min-height:30px;padding:6px 10px;font-size:11px}.btn-danger{color:#a53143;border-color:#efc8cf}.input,.select,.textarea{display:block;width:100%;border:1px solid #d9e2e8;background:white;border-radius:8px;color:#233d4b;min-height:42px;padding:9px 11px;outline:none}.input:focus,.select:focus,.textarea:focus{border-color:#149c8d;box-shadow:0 0 0 3px #0d8c7b16}.textarea{min-height:95px;resize:vertical}label.field{display:grid;gap:7px;font-size:12px;font-weight:600;margin:12px 0}details>summary{cursor:pointer;font-weight:650;list-style:none;display:flex;align-items:center;justify-content:space-between}details>summary:after{content:'+';color:#74919e}details[open]>summary{margin-bottom:18px}details[open]>summary:after{content:'−'}.alert{padding:13px 17px;border-radius:9px;background:#e5f5ee;color:#16684a;margin-bottom:20px;font-size:13px;display:block}.alert-error{background:#fce9ed;color:#982f46}.notice{background:#fff6e5;border:1px solid #f4dfb4;padding:15px;border-radius:10px;font-size:12px;color:#8b6123}.empty{text-align:center;padding:45px 20px}.table-scroll{overflow:auto}.table{border-collapse:collapse;width:100%;font-size:12px}.table th{padding:12px;text-align:left;background:#f6f8fa;color:#71808d;font-size:10px;text-transform:uppercase;letter-spacing:.6px;border-bottom:1px solid var(--line)}.table td{padding:14px 12px;border-bottom:1px solid #edf0f4}.table a{color:#08776b;font-weight:650}.auth-page{display:grid;grid-template-columns:1fr 1fr;min-height:100vh}.auth-story{background:#103b48;padding:12vw 8vw;color:#fff;display:flex;justify-content:center;flex-direction:column}.auth-story h1{font-size:50px;line-height:1.12;margin:35px 0 25px}.auth-story p{color:#b9d2d8;max-width:390px}.auth-form{display:grid;place-items:center;padding:40px}.auth-form>div{width:100%;max-width:400px}.rollcall{max-width:660px;margin:0 auto}.roll-student{text-align:center;padding:44px 20px 34px}.student-initials{width:72px;height:72px;border-radius:24px;background:#e0f3ed;color:#188775;display:grid;place-items:center;font-size:26px;font-weight:700;margin:0 auto 24px}.roll-student h2{font-size:28px;margin:15px 0;line-height:1.3}.attendance-buttons{display:grid;grid-template-columns:1fr 1fr;gap:12px}.attendance-button{padding:22px 14px;min-height:90px;border:1px solid var(--line);border-radius:12px;font-size:16px;font-weight:700;display:grid;gap:5px;text-align:center}.attendance-button small{font-size:10px;font-weight:500}.status-present{color:#0b7555;background:#e5f5ec;border-color:#c0e6d2}.status-absent{color:#b13a50;background:#fff0f2;border-color:#f6ccd5}.status-on_leave{color:#4669b7;background:#edf2ff;border-color:#d4dffb}.status-late{color:#96691e;background:#fff6e5;border-color:#f2dfb7}.progress-track{height:5px;border-radius:8px;background:#e6edf0;margin:16px 0;overflow:hidden}.progress-track>span{display:block;background:#1ba08a;height:100%;transition:width .2s}.tabs-row{display:flex;gap:6px;background:#e9eef2;padding:4px;border-radius:9px;width:max-content}.tabs-row button{border:0;padding:8px 14px;background:transparent;border-radius:6px;color:#617480;font-weight:650;font-size:12px}.tabs-row button.active{background:white;color:#1d574f;box-shadow:0 1px 4px #102a3d12}.score-row{padding:18px 0;border-bottom:1px solid #edf1f4}.score-controls{display:flex;align-items:center;gap:12px;margin-top:12px}.score-controls input[type=range]{flex:1;min-width:70px;accent-color:#078778}.score-controls input[type=number]{width:78px}.compact .score-row{padding:9px 0}.note{border-left:3px solid #78b7a9;padding:10px 16px;background:#f6faf9;margin:15px 0}.teacher-list{display:grid;gap:12px}.teacher-item{display:flex;gap:12px;align-items:center;padding:12px;border-bottom:1px solid #edf0f4}.teacher-item strong{font-size:12px}.hidden,[hidden]{display:none!important}.full-width{width:100%}.mt{margin-top:22px}.mb{margin-bottom:22px}.text-right{text-align:right}.status-text{font-size:11px;color:#608276}.report-print{margin:15px 0}.score-total{font-size:24px;font-weight:750;color:#08776b}.list-pill{background:#f2f7f6;padding:9px 12px;border-radius:8px;margin:8px 0;font-size:12px}a:focus-visible,button:focus-visible{outline:3px solid #46b9a1;outline-offset:3px}
@media(max-width:1100px){.metrics{grid-template-columns:repeat(3,1fr)}.grid-3{grid-template-columns:1fr 1fr}.workspace{padding:25px}.topbar{padding:0 25px}.app-shell{grid-template-columns:205px 1fr}.sidebar{padding:28px 14px}}@media(max-width:760px){.app-shell{display:block}.sidebar{position:relative;height:auto;padding:16px;display:block}.brand{font-size:18px}.brand small{font-size:8px}.nav-label,.sidebar-foot{display:none}.sidebar nav{display:flex;overflow:auto;gap:5px;margin-top:15px}.nav-link{white-space:nowrap;padding:9px 12px;margin:0;font-size:11px}.topbar{height:58px;padding:0 18px}.workspace{padding:22px 16px 40px}.page-head{align-items:flex-start;flex-wrap:wrap}h1{font-size:26px}.metrics{grid-template-columns:repeat(2,1fr);gap:9px}.metric{padding:14px}.metric strong{font-size:24px}.grid-2,.grid-3{grid-template-columns:1fr}.card{padding:18px}.period-meta{flex-wrap:wrap;gap:8px}.auth-page{display:block}.auth-story{display:none}.auth-form{min-height:100vh;padding:25px}.roll-student{padding:28px 12px}.roll-student h2{font-size:24px}.attendance-button{min-height:92px}.table td,.table th{padding:10px}.topbar .eyebrow{font-size:9px}}@media print{.sidebar,.topbar,.no-print,.btn,form{display:none!important}.app-shell{display:block}.workspace{padding:0}.card{border:0;padding:0}.table th,.table td{font-size:10px}body{background:white}.table-scroll{overflow:visible}}

@media(min-width:761px){.sidebar{overflow-y:auto}.sidebar-foot{padding-top:18px;margin-top:20px}}

.mark-student-list{display:flex;gap:8px;flex-wrap:wrap;max-height:190px;overflow:auto}.mark-student-list .btn{justify-content:flex-start;text-align:left}#mark-unsaved{max-width:480px;margin:auto}#mark-unsaved::backdrop{background:#102f3d88}#student-mark-editor .score-controls input[type=range]{min-height:42px}#marking-editor .rollcall{max-width:760px}

.period-two-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}@media(max-width:760px){.period-two-columns{gap:8px}.period-two-columns .card{padding:10px}.period-two-columns .flex{flex-wrap:wrap}.period-two-columns h3{font-size:15px}}

.period-time-row{margin:0 0 18px;border:1px solid var(--line);border-radius:12px;padding:12px;background:#edf2f5}.period-row-heading{display:flex;align-items:center;gap:16px;margin-bottom:10px;font-size:13px}.period-row-heading>span{color:var(--muted)}.period-paired-classes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.period-lane{display:grid;align-content:start;gap:10px}.period-paired-classes .period-card{padding:16px}.period-paired-classes h3{font-size:20px}.period-now{border-color:#169c88;background:#e4f4ef}@media(max-width:760px){.period-paired-classes .period-card{padding:10px}.period-paired-classes .flex{flex-wrap:wrap}.period-paired-classes h3{font-size:16px}.period-paired-classes .btn{padding:8px;font-size:11px}.period-row-heading{gap:10px}.period-meta{flex-wrap:wrap}}

.status-not_here{color:#96691e;background:#fff6e5;border-color:#f2dfb7}#missing-students summary{padding:12px;background:#fff6e5;border-radius:8px;color:#805c20}

.missing-student-row{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:52px;padding:8px 10px;margin:6px 0;background:#edf5f1;border-radius:6px}.missing-student-row>strong{flex:1;min-width:0;font-size:13px;line-height:1.4}.missing-student-actions{flex-shrink:0;margin-left:auto}.missing-present-button{min-height:30px;padding:5px 9px;font-size:12px;line-height:1.25;border-radius:5px;background:#087b55;border-color:#087b55;color:#fff}.missing-present-button:hover{background:#066342;border-color:#066342}@media(max-width:480px){.missing-student-row{padding:8px;gap:8px;min-height:52px}.missing-student-row>strong{font-size:12px}.missing-present-button{max-width:145px;white-space:normal;padding:5px 8px;font-size:11px}}