/* School workspace: independent app chrome, shared Rijmaatje type and brand assets. */
.school-portal-body{margin:0;background:#f5f7fb;color:#142b49}
.school-portal{--sp-navy:#102c53;--sp-blue:#1659e8;--sp-muted:#627184;--sp-line:#e0e6ef;--sp-soft:#f4f7fc;min-height:100dvh;display:grid;grid-template-columns:248px minmax(0,1fr);font-size:16px;line-height:1.5}
.school-portal *{box-sizing:border-box;min-width:0}
.school-portal a{color:inherit}
.school-portal :is(a,button,input,select,summary):focus-visible{outline:3px solid #8eb7ff;outline-offset:3px}
.sp-sidebar{position:sticky;top:0;height:100dvh;display:flex;flex-direction:column;gap:28px;padding:30px 20px 24px;background:#fff;border-right:1px solid var(--sp-line);overflow-y:auto}
.sp-brand{display:inline-flex;align-items:center;min-height:44px;align-self:flex-start}
.sp-brand img{display:block;width:166px;height:auto}
.sp-sidebar-label{margin:0 12px 10px;color:var(--sp-muted);font-size:14px;font-weight:500}
.sp-nav{display:grid;gap:5px}
.sp-nav a{display:flex;align-items:center;gap:12px;min-height:46px;padding:11px 13px;border:1px solid transparent;border-radius:11px;text-decoration:none;font-size:14px;font-weight:500;line-height:1.5;color:#52647b}
.sp-nav a>.icon{flex:0 0 19px;width:19px;height:19px;color:#6c7d93}
.sp-nav a:hover{background:#f5f8fc;color:var(--sp-navy)}
.sp-nav a[aria-current=page]{color:#124cbf;background:#edf3ff;border-color:#e1eafe;font-weight:600}
.sp-nav a[aria-current=page]>.icon{color:var(--sp-blue)}
.sp-nav-count{display:grid;place-items:center;min-width:23px;height:23px;margin-left:auto;padding:0 6px;border-radius:7px;background:#e1ebff;color:#124cbf;font-size:14px;font-weight:600}
.sp-sidebar-bottom{display:grid;gap:16px;margin-top:auto}
.sp-school-identity{display:flex;align-items:center;gap:11px;padding:16px 8px 0;border-top:1px solid var(--sp-line)}
.sp-school-avatar{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:12px;background:#edf3ff;color:var(--sp-blue)}
.sp-school-avatar>.icon{width:20px;height:20px}
.sp-school-identity strong{display:block;font-size:14px;font-weight:600;line-height:1.4;overflow-wrap:anywhere}
.sp-school-identity p{margin:3px 0 0;color:var(--sp-muted);font-size:14px}
.sp-logout{margin:0}
.sp-logout button{display:flex;align-items:center;justify-content:flex-start;gap:10px;width:100%;min-height:44px;padding:9px 12px;border:0;border-radius:10px;background:#fff;color:var(--sp-muted);font-size:14px;cursor:pointer;text-align:left}
.sp-logout button:hover{background:#f5f7fb;color:var(--sp-navy)}
.sp-logout .icon{width:18px;height:18px}
.sp-main{width:100%;max-width:1456px;margin-inline:auto;padding:28px 40px 48px;overflow-wrap:anywhere}
.sp-topline{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:44px;margin-bottom:30px}
.sp-topline-brand{color:var(--sp-muted);font-size:14px;font-weight:500}
.sp-topline-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px 18px}
.sp-topline-actions>a{display:inline-flex;align-items:center;gap:7px;min-height:44px;color:#536b8a;font-size:14px;font-weight:500;text-decoration:none}
.sp-topline-actions .icon{width:16px;height:16px}
.sp-mobile-menu{display:none}
.sp-page-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin:0 0 26px}
.sp-page-heading-copy{max-width:760px}
.sp-eyebrow{display:block;color:var(--sp-blue);font-size:14px;line-height:1.5;font-weight:500}
.school-portal h1{margin:5px 0 8px;color:var(--sp-navy);font-size:32px;line-height:1.2;font-weight:600;letter-spacing:-.035em}
.sp-page-heading p{margin:0;color:var(--sp-muted);font-size:16px;line-height:1.6}
.sp-page-heading>.sp-button{margin-top:7px;flex-shrink:0}
.sp-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 15px;border:1px solid var(--sp-line);border-radius:11px;background:#fff;color:var(--sp-navy)!important;text-decoration:none;font-size:14px;line-height:1.5;font-weight:600;white-space:normal;text-align:center;cursor:pointer}
.sp-button>.icon{width:17px;height:17px;flex:0 0 17px}
.sp-button:hover{border-color:#b8c9e3;background:#f8faff}
.sp-button--primary{background:var(--sp-blue);border-color:var(--sp-blue);color:#fff!important}
.sp-button--primary:hover{background:#104bc9;border-color:#104bc9}
.sp-button--quiet{background:transparent;border-color:transparent;color:#315d9c!important;padding-inline:0}
.sp-button--quiet:hover{background:transparent;border-color:transparent;color:#164bab!important}
.sp-button--light{color:var(--sp-navy)!important;background:#fff;border-color:#fff}
.sp-welcome{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) 120px;align-items:center;gap:30px;padding:28px 30px;border:1px solid #173d6d;border-radius:22px;background:linear-gradient(115deg,#102c53,#19447e);color:#fff;overflow:hidden;margin-bottom:24px}
.sp-welcome::after{content:"";position:absolute;right:-90px;top:-140px;width:400px;height:400px;border:1px solid #ffffff10;border-radius:50%;box-shadow:0 0 0 45px #ffffff04;z-index:-1;pointer-events:none}
.sp-welcome h2{margin:0 0 9px;color:#fff;font-size:24px;line-height:1.3;font-weight:600;letter-spacing:-.025em}
.sp-welcome p{max-width:650px;margin:0;color:#dae7fb;font-size:16px;line-height:1.6}
.sp-welcome .sp-button{margin-top:18px}
.sp-welcome-art{display:grid;place-items:center}
.sp-welcome-art .brand-mascot{display:block;width:100px;height:auto;filter:drop-shadow(0 10px 12px #061b3e50);transform:rotate(-7deg)}
.sp-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:24px}
.sp-metric{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:20px;border:1px solid var(--sp-line);border-radius:17px;background:#fff}
.sp-metric-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;color:var(--sp-muted);font-size:14px;line-height:1.5}
.sp-metric-heading>span{overflow-wrap:normal;word-break:normal;hyphens:none}
.sp-metric-heading>.icon{width:18px;height:18px;flex:0 0 18px;color:#426ca7}
.sp-metric strong{display:block;color:var(--sp-navy);font-size:28px;line-height:1.25;font-weight:600;letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.sp-metric p{margin:0;color:var(--sp-muted);font-size:14px;line-height:1.5}
.sp-columns{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(270px,1fr);gap:24px;align-items:start}
.sp-stack{display:grid;gap:24px}
.sp-panel{min-width:0;padding:24px;border:1px solid var(--sp-line);border-radius:20px;background:#fff}
.sp-panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}
.sp-panel-title{display:flex;align-items:flex-start;gap:11px}
.sp-panel-mark{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;border-radius:11px;background:#edf3ff;color:var(--sp-blue)}
.sp-panel-mark>.icon{width:19px;height:19px}
.school-portal .sp-panel h2{margin:4px 0 0;color:var(--sp-navy);font-size:20px;line-height:1.35;font-weight:600;letter-spacing:-.025em}
.sp-panel-title>div>p{margin:7px 0 0;color:var(--sp-muted);font-size:14px;line-height:1.5}
.sp-panel-heading>.sp-text-link{flex-shrink:0;margin-top:5px}
.sp-panel>p{margin:0 0 16px;color:var(--sp-muted);font-size:16px;line-height:1.6}
.sp-panel>p:last-child{margin-bottom:0}
.sp-text-link{display:inline-flex;align-items:center;gap:6px;min-height:32px;color:#245ab0!important;text-decoration:none;font-size:14px;line-height:1.5;font-weight:500}
.sp-text-link:hover{text-decoration:underline;text-underline-offset:3px}
.sp-text-link>.icon{width:15px;height:15px;flex:0 0 15px}
.sp-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border:1px solid #dfe6ef;border-radius:7px;background:#f5f7fb;color:#586b84;font-size:14px;line-height:1.5;font-weight:500}
.sp-pill .icon{width:15px;height:15px;flex:0 0 15px}
.sp-pill--positive{background:#edf8f2;border-color:#d3e9dc;color:#27694c}
.sp-pill--attention{background:#fff7e7;border-color:#f0e2bd;color:#8b6428}
.sp-pill--blue{background:#edf3ff;border-color:#d9e5fd;color:#2e5b9f}
.sp-notice{display:flex;align-items:flex-start;gap:11px;padding:16px 18px;margin-bottom:24px;border:1px solid #d9e5f6;border-radius:13px;background:#eef4ff;color:#425f86;font-size:14px;line-height:1.6}
.sp-notice>.icon{flex:0 0 18px;width:18px;height:18px;margin-top:2px;color:#3867a3}
.sp-notice p{margin:0}
.sp-notice a{font-weight:500;text-decoration:underline;text-underline-offset:3px}
.sp-notice--plain{margin:18px 0 0;background:#f7f9fc;border-color:#e7ecf3}
.sp-empty{display:grid;justify-items:center;text-align:center;padding:30px 16px}
.sp-empty-mark{display:grid;place-items:center;width:52px;height:52px;margin-bottom:14px;border-radius:16px;background:#eff4fc;color:#6081ae}
.sp-empty-mark>.icon{width:25px;height:25px}
.sp-empty h3{margin:0 0 8px;color:var(--sp-navy);font-size:18px;line-height:1.4;font-weight:600}
.sp-empty p{max-width:440px;margin:0;color:var(--sp-muted);font-size:14px;line-height:1.6}
.sp-empty .sp-button{margin-top:18px}
.sp-quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:24px}
.sp-quick-card{display:flex;align-items:flex-start;gap:13px;min-height:118px;padding:20px;border:1px solid var(--sp-line);border-radius:17px;background:#fff;text-decoration:none}
.sp-quick-card:hover{border-color:#b7ccec;background:#fcfdff}
.sp-quick-card .sp-panel-mark{background:#f0f5ff}
.sp-quick-card strong{display:block;margin:2px 0 5px;font-size:16px;line-height:1.4;font-weight:600}
.sp-quick-card p{margin:0;color:var(--sp-muted);font-size:14px;line-height:1.5}
.sp-chart{display:flex;gap:9px;align-items:end;height:190px;padding-top:12px;border-bottom:1px solid var(--sp-line)}
.sp-chart-day{flex:1;height:100%;display:grid;grid-template-rows:minmax(0,1fr) 26px;gap:7px;align-items:end;position:relative}
.sp-chart-bars{height:100%;display:flex;align-items:flex-end;justify-content:center;gap:2px}
.sp-chart-bars>svg{display:block;width:100%;height:100%;max-width:40px}
.sp-chart-bar-view{fill:#3f78e9}
.sp-chart-bar-click{fill:#b8d1ff}
.sp-chart-day>span{display:block;color:#6c7a8d;font-size:14px;line-height:1.4;text-align:center}
.sp-chart-legend{display:flex;flex-wrap:wrap;gap:9px 18px;margin-top:16px;color:var(--sp-muted);font-size:14px}
.sp-chart-legend>span{display:flex;align-items:center;gap:7px}
.sp-chart-legend i{display:block;width:9px;height:9px;border-radius:3px;background:#3f78e9}
.sp-chart-legend>span+span i{background:#b8d1ff}
.sp-chart-caption{margin:12px 0 0;color:var(--sp-muted);font-size:14px;line-height:1.5}
.sp-chart-unmeasured{display:grid;place-items:center;width:100%;height:100%;color:#91a0b3;background:repeating-linear-gradient(135deg,transparent,transparent 5px,#e9eef580 5px,#e9eef580 6px);border-radius:4px}
.sp-period{display:flex;align-items:center;flex-wrap:wrap;gap:5px;margin:-2px 0 18px;padding:4px;width:fit-content;max-width:100%;border:1px solid #e3e9f2;border-radius:11px;background:#f7f9fc}
.sp-period a{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:7px 13px;border:1px solid transparent;border-radius:8px;color:#637389;text-decoration:none;font-size:14px;line-height:1.5;font-weight:500}
.sp-period a[aria-current=true]{background:#fff;border-color:#dce5f2;color:#245ab0;box-shadow:0 2px 5px #102c5306}
.sp-chart-data{margin-top:18px;border-top:1px solid #e8edf4}
.sp-chart-data>summary{min-height:44px;padding-top:12px;cursor:pointer;color:#486991;font-size:14px}
.sp-table-scroll{overflow-x:auto;max-width:100%;margin-top:12px}
.sp-chart-data table{width:100%;min-width:440px;border-collapse:collapse;font-size:14px;text-align:left}
.sp-chart-data :is(th,td){padding:12px 10px;border-bottom:1px solid #e9edf4;font-weight:400;line-height:1.5;vertical-align:top}
.sp-chart-data thead th{font-weight:600;background:#f6f8fc;color:#526985}
.sp-chart-data tbody th{color:#385474}
.sp-dashboard-lower{margin-top:24px}
.sp-progress-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:12px}
.sp-progress-head strong{color:var(--sp-navy);font-size:28px;line-height:1.25;font-weight:600;font-variant-numeric:tabular-nums}
.sp-progress-head span{color:var(--sp-muted);font-size:14px}
.sp-progress{display:block;width:100%;height:8px;overflow:hidden;border:0;border-radius:8px;appearance:none;background:#e9eef6;color:var(--sp-blue)}
.sp-progress::-webkit-progress-bar{border-radius:8px;background:#e9eef6}
.sp-progress::-webkit-progress-value{border-radius:8px;background:var(--sp-blue)}
.sp-progress::-moz-progress-bar{border-radius:8px;background:var(--sp-blue)}
.sp-checklist{display:grid;gap:11px;list-style:none;margin:18px 0 0;padding:0}
.sp-checklist li{display:flex;align-items:flex-start;gap:9px;color:#526780;font-size:14px;line-height:1.5}
.sp-checklist .icon{flex:0 0 17px;width:17px;height:17px;margin-top:2px;color:#2d7858}
.sp-checklist li[data-complete=false] .icon{color:#99a7b8}
.sp-panel-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:22px;padding-top:18px;border-top:1px solid #e9edf4}
.sp-request-list{display:grid;gap:14px}
.sp-request-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.sp-request-filters>a{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:9px 12px;border:1px solid #e2e8f1;border-radius:10px;background:#fff;color:#5a6f89;text-decoration:none;font-size:14px;line-height:1.5;font-weight:500}
.sp-request-filters>a[aria-current=true]{border-color:#c8dafa;background:#edf3ff;color:#245ab0}
.sp-request-filters>a>span{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 4px;border-radius:6px;background:#f0f3f8;color:#61758f;font-size:14px}
.sp-request{padding:20px;border:1px solid var(--sp-line);border-radius:15px;background:#fff}
.sp-request-header{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.sp-request h3{margin:3px 0 7px;color:var(--sp-navy);font-size:18px;line-height:1.4;font-weight:600}
.sp-request-type{color:#476a9d;font-size:14px;line-height:1.5;font-weight:500}
.sp-request-meta{display:flex;flex-wrap:wrap;gap:5px 14px;color:var(--sp-muted);font-size:14px;line-height:1.5}
.sp-request-meta a{color:#35669c;text-decoration:none}
.sp-request-meta a:hover{text-decoration:underline}
.sp-request-details{margin:12px 0 0;color:#5d6e84;font-size:14px}
.sp-request-message{margin:16px 0 0;padding:15px 16px;border-radius:10px;background:#f5f8fc;color:#3e536e;font-size:16px;line-height:1.6;white-space:pre-line}
.sp-request-time{display:block;margin:13px 0 0;color:var(--sp-muted);font-size:14px}
.sp-request-form{display:flex;align-items:flex-end;gap:10px;margin-top:18px;padding-top:17px;border-top:1px solid #e8edf4}
.sp-field{display:grid;gap:7px;flex:1;max-width:300px;font-size:14px;line-height:1.5;font-weight:500;color:#52647b}
.sp-field select{width:100%;min-height:44px;padding:9px 34px 9px 11px;border:1px solid #b8c5d6;border-radius:10px;background:#fff;color:var(--sp-navy);font-size:16px;line-height:1.5}
.sp-request-list--compact .sp-request{padding:17px}
.sp-request-list--compact .sp-request-message{font-size:14px}
.sp-pagination{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:22px;margin-top:22px;border-top:1px solid var(--sp-line)}
.sp-pagination>p{margin:0;color:var(--sp-muted);font-size:14px}
.sp-pagination nav{display:flex;align-items:center;gap:9px}
.sp-pagination nav>span{padding-inline:5px;color:var(--sp-muted);font-size:14px}
.sp-data-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;margin:0}
.sp-data-grid>div{padding:17px 0;border-bottom:1px solid #ebeff5}
.sp-data-grid dt{margin:0 0 5px;color:var(--sp-muted);font-size:14px;line-height:1.5}
.sp-data-grid dd{margin:0;color:#273e5d;font-size:16px;line-height:1.6;overflow-wrap:anywhere}
.sp-data-grid dd a{color:#2e61a9;text-decoration:underline;text-underline-offset:3px}
.sp-data-grid .sp-data-wide{grid-column:1/-1}
.sp-profile-description{margin:0;color:#526780;font-size:16px;line-height:1.65;white-space:pre-line}
.sp-profile-description+.sp-profile-description{margin-top:18px}
.sp-profile-cover{display:block;width:100%;max-height:280px;aspect-ratio:16/7;object-fit:cover;border-radius:13px;margin-bottom:22px}
.sp-review{padding:20px;border:1px solid var(--sp-line);border-radius:15px;background:#fff}
.sp-review+.sp-review{margin-top:14px}
.sp-review-header{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:13px}
.sp-review-author{display:block;color:var(--sp-navy);font-size:16px;line-height:1.5;font-weight:600}
.sp-review-date{display:block;margin-top:3px;color:var(--sp-muted);font-size:14px}
.sp-review-score{display:inline-flex;align-items:center;gap:6px;color:#906819;font-size:14px;font-weight:600;white-space:nowrap}
.sp-review-score .icon{width:16px;height:16px}
.sp-review h3{margin:0 0 8px;color:var(--sp-navy);font-size:18px;line-height:1.4;font-weight:600}
.sp-review p{margin:0;color:#526780;font-size:16px;line-height:1.65;white-space:pre-line}
.sp-review-summary{display:flex;align-items:center;gap:17px;padding:20px;margin-bottom:22px;border-radius:13px;background:#f5f8fc}
.sp-review-summary strong{color:var(--sp-navy);font-size:28px;line-height:1.3;font-weight:600}
.sp-review-summary p{margin:0;color:var(--sp-muted);font-size:14px}
.sp-billing-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:5px 10px;margin:16px 0 4px}
.sp-billing-price strong{color:var(--sp-navy);font-size:32px;line-height:1.25;letter-spacing:-.025em;font-weight:600}
.sp-billing-price span{color:var(--sp-muted);font-size:16px}
.sp-billing-tax{margin:0;color:var(--sp-muted);font-size:14px}
.sp-billing-summary{display:flex;align-items:center;justify-content:space-between;gap:16px}
.sp-billing-summary .sp-panel-mark{flex:0 0 44px;width:44px;height:44px;border-radius:13px}
.sp-billing-summary .sp-panel-mark>.icon{width:22px;height:22px}
.sp-billing-details{display:grid;gap:0;margin:24px 0 0;border-top:1px solid var(--sp-line)}
.sp-billing-details>div{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:16px 0;border-bottom:1px solid #e9edf4}
.sp-billing-details dt{color:var(--sp-muted);font-size:14px}
.sp-billing-details dd{margin:0;text-align:right;color:#314967;font-size:14px;font-weight:500}
.sp-help-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.sp-help-item{padding:18px 0;border-top:1px solid #e9edf4}
.sp-help-item:first-of-type{padding-top:0;border-top:0}
.sp-help-item h3{margin:0 0 7px;color:var(--sp-navy);font-size:16px;line-height:1.5;font-weight:600}
.sp-help-item p{margin:0;color:var(--sp-muted);font-size:16px;line-height:1.6}
.sp-support-card{position:relative;overflow:hidden}
.sp-support-art{width:70px;margin-bottom:18px}
.sp-support-art>.brand-mascot{display:block;width:100%;height:auto}
.sp-bottom-note{margin:28px 0 0;color:#7a8798;font-size:14px;line-height:1.6}
.school-portal--login{display:flex;align-items:center;justify-content:center;padding:40px 24px;min-height:100dvh;background:radial-gradient(ellipse at 20% 30%,#e8effc,transparent 55%),#f5f7fb}
.sp-login{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:100%;max-width:1060px;border:1px solid #dbe3ef;border-radius:26px;background:#fff;box-shadow:0 20px 64px #17365c0b;overflow:hidden}
.sp-login-story{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;padding:46px 40px;background:linear-gradient(145deg,#102c53,#1a477f);color:#fff;overflow:hidden}
.sp-login-story::after{content:"";position:absolute;z-index:-1;width:460px;height:460px;left:-220px;bottom:-280px;border:1px solid #ffffff12;border-radius:50%;box-shadow:0 0 0 46px #ffffff04;pointer-events:none}
.sp-login-kicker{display:block;color:#bdd4fb;font-size:14px;line-height:1.5;font-weight:500}
.sp-login-story h2{margin:18px 0 16px;color:#fff;font-size:32px;font-weight:600;line-height:1.22;letter-spacing:-.035em}
.sp-login-story p{max-width:350px;margin:0;color:#d7e5fa;font-size:16px;line-height:1.65}
.sp-login-mascot{display:grid;place-items:center;width:100%;padding:26px 0;margin:auto 0}
.sp-login-mascot>.brand-mascot{display:block;width:128px;height:auto;transform:rotate(-7deg);filter:drop-shadow(0 12px 13px #061b3e50)}
.sp-login-reassurance{display:flex;align-items:flex-start;gap:10px;padding-top:18px;color:#bed4f3;font-size:14px;line-height:1.5}
.sp-login-reassurance>.icon{flex:0 0 18px;width:18px;height:18px;margin-top:2px}
.sp-login-form{padding:42px}
.sp-login-form>.sp-brand{margin-bottom:30px}
.sp-login-title>.sp-panel-mark{margin-bottom:18px}
.school-portal .sp-login-form h1{margin:5px 0 10px;font-size:28px;line-height:1.25}
.sp-login-title>p{margin:0;color:var(--sp-muted);font-size:16px;line-height:1.6}
.sp-login-code-form{margin-top:25px}
.sp-login-code-form>label{display:block;margin-bottom:8px;color:#3e5574;font-size:14px;line-height:1.5;font-weight:500}
.sp-login-code-form>input[type=password]{display:block;width:100%;height:52px;padding:12px 14px;border:1px solid #a9b9cf;border-radius:11px;background:#fff;color:var(--sp-navy);font-family:var(--font-family,Inter,sans-serif);font-size:16px;line-height:1.5}
.sp-login-code-form>input[aria-invalid=true]{border-color:#bc6666}
.sp-login-code-form>p{margin:9px 0 0;color:var(--sp-muted);font-size:14px;line-height:1.5}
.sp-login-code-form>.sp-button{width:100%;margin-top:20px;min-height:48px}
.sp-login-help{margin-top:25px;padding-top:23px;border-top:1px solid var(--sp-line)}
.sp-login-help>strong{display:block;color:#3a5373;font-size:14px;line-height:1.5;font-weight:600}
.sp-login-help>p{margin:5px 0 7px;color:var(--sp-muted);font-size:14px;line-height:1.6}
.sp-login-error{margin-top:20px;padding:13px 15px;border:1px solid #eed5d5;border-radius:11px;background:#fff4f4;color:#985050;font-size:14px;line-height:1.6}
@media(min-width:1600px){.sp-main{padding-inline:56px}}
@media(max-width:1200px){.school-portal{grid-template-columns:224px minmax(0,1fr)}.sp-sidebar{padding-inline:15px}.sp-main{padding:24px 28px 40px}.sp-metrics{gap:12px}.sp-metric{padding:17px}.sp-columns{grid-template-columns:minmax(0,1fr)}.sp-quick-grid{gap:12px}.sp-quick-card{padding:17px}}
@media(max-width:1100px){.sp-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:960px){.sp-main{padding-inline:24px}.sp-topline{margin-bottom:24px}.sp-page-heading{flex-wrap:wrap}.sp-page-heading>.sp-button{margin-top:0}.sp-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.sp-quick-grid{grid-template-columns:minmax(0,1fr)}.sp-quick-card{min-height:0}.sp-help-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:760px){
 .school-portal{display:block}
 .sp-sidebar{display:none}
 .sp-main{max-width:760px;padding:0 18px 32px}
 .sp-topline{position:relative;display:flex;min-height:76px;margin:0 -18px 24px;padding:13px 18px;border-bottom:1px solid var(--sp-line);background:#fff}
 .sp-topline-brand{display:none}
 .sp-topline-actions{display:none}
 .sp-topline-actions>a{display:none}
 .sp-mobile-menu{display:block;margin:0;width:100%}
 .sp-mobile-menu>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;cursor:pointer;list-style:none}
 .sp-mobile-menu>summary::-webkit-details-marker{display:none}
 .sp-mobile-menu>summary img{display:block;width:142px;height:auto}
 .sp-mobile-menu-label{display:inline-flex;align-items:center;gap:7px;color:#3e5878;font-size:14px;font-weight:500}
 .sp-mobile-menu-label .icon{width:20px;height:20px}
 .sp-mobile-menu[open]>summary{padding-bottom:16px;border-bottom:1px solid #edf0f5;margin-bottom:12px}
 .sp-mobile-menu .sp-nav{padding-top:2px}
 .sp-mobile-menu .sp-nav a{min-height:46px}
 .sp-mobile-menu .sp-school-identity{margin-top:16px;padding-top:16px}
 .sp-mobile-menu .sp-logout{margin-top:10px}
 .sp-topline-actions:empty{display:none}
 .school-portal h1{font-size:24px;line-height:1.25;letter-spacing:-.03em}
 .sp-page-heading{gap:16px;margin-bottom:22px}
 .sp-page-heading p{font-size:16px;line-height:1.6}
 .sp-page-heading>.sp-button{width:100%}
 .sp-welcome{grid-template-columns:minmax(0,1fr) 66px;gap:15px;padding:22px 20px;border-radius:18px;margin-bottom:20px}
 .sp-welcome h2{font-size:20px;line-height:1.35}
 .sp-welcome p{font-size:14px;line-height:1.6}
 .sp-welcome-art .brand-mascot{width:66px}
 .sp-welcome .sp-button{font-size:14px;margin-top:15px}
 .sp-metrics{gap:12px;margin-bottom:20px}
 .sp-metric{padding:17px 15px;border-radius:15px}
 .sp-metric strong{font-size:24px}
 .sp-metric-heading{align-items:flex-start;gap:7px}
 /* Keep the full 14px label width; these icons are decorative. */
 .sp-metric-heading>.icon{display:none}
 .sp-columns,.sp-stack{gap:20px}
 .sp-panel{padding:20px;border-radius:17px}
 .sp-panel-heading{gap:12px;margin-bottom:18px;flex-wrap:wrap}
 .sp-panel-title{gap:10px}
 .school-portal .sp-panel h2{margin-top:4px;font-size:20px;line-height:1.35}
 .sp-panel-heading>.sp-text-link{margin:0 0 0 46px}
 .sp-panel-mark{flex-basis:36px;width:36px;height:36px}
 .sp-panel-actions{margin-top:18px;padding-top:16px}
 .sp-panel-actions>.sp-button{flex:1}
 .sp-notice{padding:15px;margin-bottom:20px}
 .sp-chart{gap:4px;height:165px}
 .sp-chart-bars{gap:1px}
 .sp-chart-day>span{font-size:14px}
 .sp-quick-grid{margin-top:20px}
 .sp-empty{padding:25px 5px}
 .sp-request{padding:17px}
 .sp-request-header{gap:12px;flex-wrap:wrap}
 .sp-request .sp-pill{font-size:14px}
 .sp-request-form{flex-wrap:wrap;gap:12px}
 .sp-field{flex-basis:100%;max-width:none}
 .sp-request-form>.sp-button{width:100%}
 .sp-request-message{padding:14px;font-size:16px}
 .sp-pagination{align-items:flex-start;gap:14px}
 .sp-pagination nav{width:100%;flex-wrap:wrap;justify-content:space-between}
 .sp-pagination nav>.sp-button{flex:1}
 .sp-pagination nav>span{width:100%;text-align:center;order:-1}
 .sp-data-grid{grid-template-columns:minmax(0,1fr)}
 .sp-profile-cover{aspect-ratio:3/2;max-height:none}
 .sp-review{padding:17px}
 .sp-review-header{flex-wrap:wrap;gap:10px}
 .sp-review-summary{padding:17px}
 .sp-billing-price strong{font-size:28px}
 .sp-billing-details>div{display:grid;grid-template-columns:minmax(0,1fr);gap:5px}
 .sp-billing-details dd{text-align:left}
 .sp-help-grid{gap:20px}
 .sp-bottom-note{margin-top:22px}
 .school-portal--login{display:block;padding:20px 16px;min-height:100dvh}
 .sp-login{grid-template-columns:minmax(0,1fr);max-width:540px;margin-inline:auto;border-radius:20px}
 .sp-login-story{display:grid;grid-template-columns:minmax(0,1fr) 64px;align-items:center;gap:15px;padding:24px}
 .sp-login-story h2{font-size:20px;line-height:1.3;margin:7px 0 0}
 .sp-login-story p,.sp-login-reassurance{display:none}
 .sp-login-mascot{margin:0;padding:0}
 .sp-login-mascot>.brand-mascot{width:64px}
 .sp-login-form{padding:28px 24px}
 .sp-login-form>.sp-brand{margin-bottom:23px}
 .sp-login-form>.sp-brand img{width:148px}
 .sp-login-title>.sp-panel-mark{display:none}
 .school-portal .sp-login-form h1{font-size:24px}
 .sp-login-code-form{margin-top:22px}
 .sp-login-help{margin-top:23px;padding-top:20px}
}
@media(max-width:380px){.sp-main{padding-inline:14px}.sp-topline{margin-inline:-14px;padding-inline:14px}.sp-metrics{grid-template-columns:minmax(0,1fr)}.sp-metric{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 14px}.sp-metric-heading{grid-column:1;grid-row:1}.sp-metric-heading>.icon{display:none}.sp-metric>strong{grid-column:2;grid-row:1/3;align-self:center}.sp-metric>p{grid-column:1;grid-row:2}.sp-welcome{grid-template-columns:minmax(0,1fr);padding:21px 18px}.sp-welcome-art{display:none}.sp-panel{padding:18px}.sp-billing-summary{align-items:flex-start}.sp-chart{gap:3px}.sp-chart-bars i{min-width:1px}}
@media(prefers-reduced-motion:reduce){.school-portal{scroll-behavior:auto}}

.school-portal .sp-legal-links{display:flex;flex-wrap:wrap;gap:4px 22px;margin-top:20px;padding-top:12px;border-top:1px solid var(--sp-line);font-size:14px;line-height:1.5;color:var(--sp-muted)}
.school-portal .sp-legal-links>a{display:inline-flex;align-items:center;min-height:44px;color:inherit;text-decoration:underline;text-underline-offset:3px}
