html.school-workspace{--forest:var(--school-accent);--forest-deep:var(--school-accent);--green:var(--school-accent)}

.school-workspace body{background:linear-gradient(135deg,#eff3f1,#f6f2e9)}.school-workspace .brand{max-width:330px;gap:12px}.school-workspace-logo{width:42px;height:42px;object-fit:contain}.brand .school-workspace-name{font-size:1rem;line-height:1.3;letter-spacing:-.025em;font-weight:800;color:var(--school-accent);text-align:left}.school-workspace #home-view{display:none!important}.school-workspace-welcome{width:100%;margin:0 0 16px;color:var(--school-accent);font-size:1rem;line-height:1.6}.school-workspace .site-footer{border-top:1px solid var(--line);padding-top:24px}.school-workspace .site-footer .footer-brand{color:var(--school-accent)}.school-workspace .site-footer .footer-brand img{width:32px;height:32px;object-fit:contain}.school-workspace .signin-tour{display:none}@media(max-width:600px){.school-workspace .brand{max-width:230px}.brand .school-workspace-name{font-size:.85rem}.school-workspace-logo{width:34px;height:34px}}

html.school-workspace{--mint:color-mix(in srgb,var(--school-accent) 12%,white)}html.school-workspace body{background:linear-gradient(135deg,#eff3f1,#f6f2e9)}html.school-workspace .site-header{background:var(--school-accent)}html.school-workspace .site-header .school-workspace-name{color:#fff}html.school-workspace main :is(h1,h2,h3){color:var(--school-accent)}html.school-workspace .site-header .nav-link{color:#fff}html.school-workspace .site-header .nav-menu-item{color:var(--text)}html.school-workspace .site-header .nav-profile{color:#fff;background:transparent;border-color:rgba(255,255,255,.35)}html.school-workspace .site-header .nav-link:hover{background:rgba(255,255,255,.12)}

html.school-workspace .school-workspace-logo{background:white;padding:4px;border-radius:8px}

html.school-workspace body #dashboard :is(h1,h2,h3){color:var(--school-accent)}
html.school-workspace body{font-family:var(--school-font,Manrope,sans-serif)}

/* Derive every tint from the school colour so no NextRoles green leaks through. */
html.school-workspace{--forest-deep:color-mix(in srgb,var(--school-accent) 88%,black);--text:#1d2230;--muted:#5d6472;--line:color-mix(in srgb,var(--school-accent) 14%,#d9dce3);--line-strong:color-mix(in srgb,var(--school-accent) 26%,#c9ced8);--shadow:0 18px 50px rgba(20,24,40,.09),0 2px 8px rgba(20,24,40,.04);--shadow-small:0 8px 24px rgba(20,24,40,.07),0 1px 4px rgba(20,24,40,.04)}
html.school-workspace body{background:linear-gradient(135deg,color-mix(in srgb,var(--school-accent) 5%,#fff),#fafafc)}
html.school-workspace body :is(h1,h2,h3,h4):not(.site-header *,.site-footer *,dialog *){color:var(--school-accent)}
html.school-workspace .eyebrow,html.school-workspace .step-label{color:var(--school-accent)}
html.school-workspace .teacher-dashboard-nav{background:color-mix(in srgb,var(--school-accent) 7%,#fff);border-color:var(--line)}
html.school-workspace .teacher-dashboard-nav button[aria-current=page]{border-color:var(--line);box-shadow:0 3px 10px rgba(20,24,40,.05)}
html.school-workspace :is(.teacher-dashboard,.student-dashboard) :is(.admin-card,.report-card,.student-section,.student-feature-card,.panel){border-color:var(--line);box-shadow:0 8px 24px rgba(20,24,40,.05)}
html.school-workspace .teacher-dashboard #school-workspace-panel .tabs button{border-color:var(--line)}
html.school-workspace .teacher-dashboard #status-filter .filter-chip[aria-pressed=true]{background:color-mix(in srgb,var(--school-accent) 10%,#fff)}
html.school-workspace .teacher-dashboard #status-filter .filter-chip:before{border-color:var(--line-strong)}
html.school-workspace :is(.badge,.status-badge,.tab-badge){border-color:var(--line)}
html.school-workspace .site-footer :is(a,small,p,span){color:var(--muted)}
html.school-workspace .site-footer .footer-brand{color:var(--school-accent)}
html.school-workspace :is(input,select,textarea):focus{border-color:var(--school-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--school-accent) 18%,transparent)}
html.school-workspace input[type=checkbox],html.school-workspace input[type=radio]{accent-color:var(--school-accent)}
html.school-workspace .school-workspace-logo{border:1px solid rgba(255,255,255,.4)}

/* Navigation: dropdown items need their own hover/focus/active states, because
   the white header-link rules above would otherwise also hit items inside the white menus. */
html.school-workspace .site-header .nav-link:is(:hover,:focus-visible){background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.3);color:#fff}
html.school-workspace .site-header .nav-link.is-active,html.school-workspace .site-header .nav-link[aria-current=page]{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.45);color:#fff}
html.school-workspace .site-header :is(.nav-link,.nav-profile,.notification-bell):focus-visible{outline:3px solid #fff;outline-offset:2px}
html.school-workspace .site-header .nav-menu .nav-menu-item{color:var(--text);background:transparent;border:1px solid transparent;cursor:pointer}
html.school-workspace .site-header .nav-menu .nav-menu-item:is(:hover,:focus-visible){background:color-mix(in srgb,var(--school-accent) 12%,#fff);border-color:color-mix(in srgb,var(--school-accent) 25%,transparent);color:var(--school-accent)}
html.school-workspace .site-header .nav-menu .nav-menu-item:focus-visible{outline:3px solid var(--school-accent);outline-offset:-3px}
html.school-workspace .site-header .nav-menu .nav-menu-item.is-active,html.school-workspace .site-header .nav-menu .nav-menu-item[aria-current=page]{background:color-mix(in srgb,var(--school-accent) 16%,#fff);color:var(--school-accent)}
html.school-workspace .site-header .nav-menu .nav-menu-icon{background:color-mix(in srgb,var(--school-accent) 12%,#fff);color:var(--school-accent)}
html.school-workspace .site-header .nav-menu .nav-menu-item:hover .nav-menu-icon{background:#fff}
html.school-workspace .site-header :is(.notification-panel,.dashboard-settings-menu) :is(button,a):is(:hover,:focus-visible){background:color-mix(in srgb,var(--school-accent) 10%,#fff);color:var(--school-accent)}

/* Page headings use a clipped green gradient (background-clip:text); replace it with the school colour. */
html.school-workspace body :is(h1,h2,h3,h4,.admin-heading h1,.page-heading h1):not(.site-header *,.site-footer *,dialog *){background:none;background-image:none;-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:var(--school-accent);color:var(--school-accent)}
html.school-workspace{--paper:#fff;--cream:#f7f8fb}

/* Login and shared form controls: replace the green-grey neutrals. */
html.school-workspace{--neutral-border:#cfd3dc;--neutral-text:#4f5666;--neutral-fill:#eceef3}
html.school-workspace :is(.login-page .field input,.signin-password input,.field input,.field select,.field textarea){border-color:var(--neutral-border);background:#fff}
html.school-workspace .signin-password{border-color:var(--neutral-border);background:#fff}
html.school-workspace .signin-card .button-primary:disabled{border-color:var(--neutral-border);color:var(--neutral-text);background:var(--neutral-fill)}
html.school-workspace .signin-card{box-shadow:0 24px 64px rgba(20,24,40,.08),0 2px 8px rgba(20,24,40,.05)}
html.school-workspace .signin-divider,html.school-workspace .signin-hint,html.school-workspace .signin-audience,html.school-workspace .form-status{color:var(--neutral-text)}
html.school-workspace .form-status:is(.is-working,.is-success){color:var(--school-accent)}
html.school-workspace .signin-card .microsoft-button{border-color:var(--neutral-border);color:var(--neutral-text);background:#f8f9fb}
html.school-workspace .microsoft-button small{color:var(--neutral-text);background:var(--neutral-fill)}
html.school-workspace .settings-switch{background:#d5d8e0;border-color:#9aa1b0}
html.school-workspace .settings-toggle input:checked+.settings-switch{background:var(--school-accent);border-color:var(--school-accent)}
html.school-workspace :is(.ui-chevron){color:inherit}

/* Open Tools/Help/Settings toggles: the white header-link colour sat on the light open-state fill (white on white). */
html.school-workspace .site-header .nav-group.is-open>.nav-group-toggle,html.school-workspace .site-header .nav-link[aria-expanded=true]{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.45);color:#fff}
html.school-workspace .site-header .nav-group-toggle:is(:hover,:focus-visible){color:#fff}
/* On narrow screens the menus sit inside the coloured nav panel, so their items need light text. */
@media(max-width:1050px){
  html.school-workspace .site-header .nav-menu .nav-menu-item{color:#fff}
  html.school-workspace .site-header .nav-menu .nav-menu-icon{background:rgba(255,255,255,.16);color:#fff}
  html.school-workspace .site-header .nav-menu .nav-menu-item:is(:hover,:focus-visible){background:#fff;color:var(--school-accent)}
  html.school-workspace .site-header .nav-menu .nav-menu-item:is(:hover,:focus-visible) .nav-menu-icon{background:color-mix(in srgb,var(--school-accent) 12%,#fff);color:var(--school-accent)}
  html.school-workspace .site-header .nav-menu .nav-menu-item.is-active,html.school-workspace .site-header .nav-menu .nav-menu-item[aria-current=page]{background:rgba(255,255,255,.2);color:#fff}
}

/* Calmer headings: the workspace font is wider than Manrope, so the tight tracking and huge size looked heavy. */
html.school-workspace body :is(.admin-heading h1,.page-heading h1,h1):not(.site-header *,.site-footer *,dialog *){font-size:clamp(1.9rem,3.6vw,2.7rem);font-weight:700;letter-spacing:-.025em;line-height:1.1}
html.school-workspace body :is(h2,h3):not(.site-header *,.site-footer *,dialog *){letter-spacing:-.015em}
html.school-workspace .school-inbox-empty{background:#f6f7fa;color:var(--text)}
html.school-workspace .school-inbox-empty strong{color:var(--school-accent)}
html.school-workspace :is(.school-inbox-empty p,.school-inbox-toolbar,.school-inbox-sender,.my-reports-tools p){color:var(--neutral-text)}
html.school-workspace .my-reports-tools b{color:var(--school-accent)}
html.school-workspace .my-report-empty-list{border-color:var(--neutral-border);color:var(--neutral-text);background:transparent}
html.school-workspace .school-inbox-item{border-color:var(--line)}
html.school-workspace :is(.school-inbox-content,.school-inbox-heading h3){color:var(--text)}html.school-workspace .school-inbox-heading h3{color:var(--school-accent)}html.school-workspace .school-inbox-item summary{color:var(--school-accent)}