.school-app{--navy:#11233f;--blue:#2563eb;--sky:#eaf2ff;color:#19283c;background:#f4f7fb;grid-template-columns:225px 1fr;min-height:100vh;font-family:Arial,sans-serif;display:grid}.school-side{background:var(--navy);color:#fff;flex-direction:column;height:100vh;padding:22px 15px;display:flex;position:sticky;top:0}.school-brand{color:#fff;align-items:center;gap:10px;padding:3px 7px 27px;text-decoration:none;display:flex}.school-brand>span{background:linear-gradient(145deg,#3275f3,#194caf);border-radius:11px;place-items:center;width:40px;height:40px;font-size:22px;display:grid}.school-brand div{display:grid}.school-brand b{font-size:17px}.school-brand small{color:#8fa3bf;font-size:8px}.school-side nav{gap:5px;display:grid}.school-side nav button{color:#9caec6;cursor:pointer;background:0 0;border:0;border-radius:8px;align-items:center;gap:10px;padding:12px;font-weight:700;display:flex}.school-side nav button svg{font-size:19px}.school-side nav button.active{color:#fff;background:#203a60}.school-side nav button.active svg{color:#70a5ff}.school-user{border-top:1px solid #29405f;align-items:center;gap:9px;margin-top:auto;padding:17px 5px 0;display:flex}.school-user>span{color:#b8d2ff;background:#2b4770;border-radius:50%;place-items:center;width:34px;height:34px;font-size:10px;font-weight:800;display:grid}.school-user>div{display:grid}.school-user small{color:#8195b1;font-size:8px}.school-main{min-width:0}.school-main>header{background:#fff;border-bottom:1px solid #dfe6ef;justify-content:space-between;align-items:center;height:78px;padding:0 27px;display:flex}.school-main>header a{color:#8a98aa;gap:5px;font-size:9px;text-decoration:none;display:flex}.school-main h1{margin:5px 0;font-size:21px}.school-year{align-items:center;gap:8px;font-size:10px;display:flex}.school-year span{color:#8a98aa}.school-year svg{margin-left:12px;font-size:19px}.school-dashboard{padding:21px}.school-metrics{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.school-metrics article{background:#fff;border:1px solid #dee6f0;border-radius:12px;gap:12px;padding:16px;display:flex}.school-metrics article>span{background:var(--sky);width:38px;height:38px;color:var(--blue);border-radius:9px;place-items:center;font-size:20px;display:grid}.school-metrics article>div{display:grid}.school-metrics small{color:#8492a4;text-transform:uppercase;font-size:8px;font-weight:800}.school-metrics strong{font-size:21px}.school-metrics p{color:#8d9aab;margin:0;font-size:8px}.school-columns{grid-template-columns:1.35fr .65fr;gap:13px;margin-top:13px;display:grid}.school-card,.school-page-card{background:#fff;border:1px solid #dfe6ef;border-radius:12px;padding:18px}.card-head,.school-toolbar{justify-content:space-between;align-items:center;display:flex}.card-head h2,.school-page-card h2{margin:0 0 4px;font-size:15px}.card-head p{color:#8b98a9;margin:0;font-size:9px}.card-head button,.school-toolbar>button,.module-preview button{background:var(--blue);color:#fff;border:0;border-radius:7px;padding:8px 10px;font-size:9px;font-weight:800}.class-row{border-top:1px solid #edf1f6;grid-template-columns:48px 8px 1fr auto;align-items:center;gap:9px;padding:13px 3px;display:grid}.class-row time{font-size:10px;font-weight:800}.class-row>i{background:var(--blue);border-radius:50%;width:7px;height:7px}.class-row>div{display:grid}.class-row b{font-size:10px}.class-row span{color:#8c99aa;font-size:8px}.school-alert{border-radius:8px;grid-template-columns:25px 1fr auto;align-items:center;margin-top:9px;padding:11px;font-size:9px;display:grid}.school-alert p{margin:0}.school-alert.warn{color:#8b6500;background:#fff7df}.school-alert.red{color:#a72b2b;background:#fff0f0}.school-alert.blue{color:#1e5cb7;background:#edf5ff}.school-activity{margin-top:13px}.school-activity>div:not(.card-head){border-top:1px solid #edf1f6;gap:10px;padding:11px;display:flex}.school-activity>div>span{border-radius:8px;place-items:center;width:30px;height:30px;display:grid}.school-activity span.green{color:#1c9b50;background:#eaf9ef}.school-activity span.blue{color:#2563eb;background:#eaf2ff}.school-activity span.purple{color:#7c3bc7;background:#f4edff}.school-activity p{margin:0;font-size:9px;display:grid}.school-activity small{color:#929faf;font-size:8px}.school-page-card{margin:21px}.school-toolbar>div{border:1px solid #dce4ee;border-radius:8px;align-items:center;gap:8px;width:min(480px,60%);padding:9px 11px;display:flex}.school-toolbar input{border:0;outline:0;width:100%}.school-toolbar>button{gap:5px;display:flex}.student-table{border-top:1px solid #e9eef4;grid-template-columns:1.5fr 1fr .6fr .5fr .6fr;align-items:center;padding:11px;font-size:9px;display:grid}.student-table.heading{color:#8794a5;background:#f7f9fc;margin-top:16px;font-weight:800}.student-name{align-items:center;gap:9px;display:flex}.student-name>i{color:#2563eb;background:#eaf2ff;border-radius:50%;place-items:center;width:31px;height:31px;font-style:normal;font-weight:800;display:grid}.student-name>b{display:grid}.student-name small{color:#929faf}.student-table strong.low{color:#d04949}.student-table em{border-radius:10px;width:max-content;padding:4px 7px;font-style:normal}.student-table em.paid{color:#198548;background:#eaf9ef}.student-table em.pending{color:#9b6600;background:#fff3df}.module-preview{text-align:center;align-content:center;place-items:center;min-height:500px;display:grid}.module-preview>span{background:var(--sky);width:68px;height:68px;color:var(--blue);border-radius:18px;place-items:center;font-size:35px;display:grid}.module-preview h2{margin:16px 0 5px;font-size:23px}.module-preview p{color:#78879a;max-width:450px;font-size:12px;line-height:1.6}.module-preview button{margin:9px;padding:11px 15px}.module-preview small{color:#9ba7b6;font-size:8px}@media (max-width:900px){.school-app{grid-template-columns:70px 1fr}.school-brand div,.school-side nav button,.school-user div{font-size:0}.school-brand{padding-left:0}.school-side nav button svg{font-size:21px}.school-metrics{grid-template-columns:1fr 1fr}.school-columns{grid-template-columns:1fr}.student-table{grid-template-columns:1.5fr 1fr .5fr}.student-table>:nth-child(3),.student-table>:nth-child(5){display:none}}@media (max-width:600px){.school-app{display:block}.school-side{z-index:10;height:59px;padding:5px;position:fixed;inset:auto 0 0}.school-brand,.school-user{display:none}.school-side nav{grid-template-columns:repeat(5,1fr)}.school-side nav button{justify-content:center}.school-main{padding-bottom:65px}.school-main>header{height:65px;padding:0 13px}.school-year span{display:none}.school-dashboard,.school-page-card{margin:0;padding:11px}.school-metrics{grid-template-columns:1fr 1fr;gap:8px}.school-metrics article{padding:11px}.school-toolbar>div{width:100%}.school-toolbar>button{padding:10px;font-size:0}.student-table{grid-template-columns:1.5fr 1fr .4fr;padding:9px 2px}.student-table>:nth-child(4){display:block}}