/* School staff shell. Everything is scoped to pages that opt in with body[data-school-page]. */
body[data-school-page]{--sn-ink:#0e1a2b;--sn-muted:#4a5568;--sn-line:#d9dee5;--sn-row:#e6eaf0;--sn-soft:#f4f6f8;--sn-yellow:#ffc21a;--sn-red:#b91c1c;--sn-orange:#9a3412;--sn-blue:#1e3a8a;--sn-width:256px;padding-left:var(--sn-width)}
body[data-school-page]:has(> #school-nav:empty){padding-left:0}
body[data-school-page] #school-nav:empty{display:none}
body[data-school-page] #school-nav{position:fixed;top:0;left:0;bottom:0;width:var(--sn-width);overflow-y:auto;background:#fff;border-right:1px solid var(--sn-line);padding:16px 12px 24px;z-index:4;color:var(--sn-ink)}
body[data-school-page] .school-nav-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:46px;padding:0 8px 8px}
body[data-school-page] .school-nav-brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:1.2rem;color:var(--sn-ink);text-decoration:none}
body[data-school-page] .school-nav-brand::before{content:"";width:24px;height:24px;border-radius:7px;background:var(--sn-yellow);flex:none}
body[data-school-page] .school-nav-toggle{display:none;width:auto;min-height:44px;padding:8px 16px;border-color:var(--sn-ink);color:var(--sn-ink)}
body[data-school-page] .school-nav-group{margin:14px 12px 4px;font-size:.75rem;line-height:1.4;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--sn-muted)}
body[data-school-page] #school-nav ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
body[data-school-page] #school-nav li{margin:0;line-height:1.3}
body[data-school-page] #school-nav ul a{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 12px;border-radius:10px;border:1px solid transparent;color:var(--sn-ink);font-weight:600;text-decoration:none}
body[data-school-page] #school-nav ul a:hover{background:var(--sn-soft)}
body[data-school-page] #school-nav ul a[aria-current=page]{background:var(--sn-soft);border-color:var(--sn-line);box-shadow:inset 4px 0 0 var(--sn-yellow);font-weight:800}
body[data-school-page] .school-nav-badge{flex:none;min-width:24px;height:24px;border-radius:12px;padding:0 7px;background:var(--sn-yellow);color:var(--sn-ink);font-size:.8rem;font-weight:800;display:inline-flex;align-items:center;justify-content:center}
body[data-school-page] .school-nav-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
body[data-school-page] .school-nav-account{margin:18px 12px 0;padding-top:12px;border-top:1px solid var(--sn-row)}
body[data-school-page] .school-nav-account a{display:inline-flex;align-items:center;min-height:44px;color:var(--sn-ink);font-weight:700}
@media (max-width:899px){
 body[data-school-page]{padding-left:0}
 body[data-school-page] #school-nav{position:static;width:auto;overflow:visible;border-right:0;border-bottom:1px solid var(--sn-line);padding:8px 16px}
 body[data-school-page] .school-nav-bar{padding:0}
 body[data-school-page] .school-nav-toggle{display:inline-flex;align-items:center}
 body[data-school-page] .school-nav-menu{display:none}
 body[data-school-page] #school-nav.school-nav-open .school-nav-menu{display:block;padding:4px 0 12px}
}

/* Shared states: permission denied and passkey step-up. */
body[data-school-page] .school-denied{background:#fff;border:1px solid var(--sn-line);border-radius:18px;padding:28px;display:grid;gap:14px;justify-items:start;margin-top:24px}
body[data-school-page] .school-denied h1{font-size:clamp(1.5rem,4vw,1.9rem);margin:0}
body[data-school-page] .school-denied p{margin:0}
body[data-school-page] .school-denied-icon,body[data-school-page] .school-step-up-icon{width:56px;height:56px;border-radius:28px;background:var(--sn-row);display:block;position:relative}
body[data-school-page] .school-denied-icon::after{content:"";position:absolute;left:19px;top:25px;width:18px;height:14px;border-radius:3px;background:var(--sn-ink)}
body[data-school-page] .school-denied-icon::before{content:"";position:absolute;left:22px;top:15px;width:12px;height:14px;border:3px solid var(--sn-ink);border-bottom:0;border-radius:8px 8px 0 0;box-sizing:border-box}
body[data-school-page] .school-step-up-icon{background:var(--sn-ink)}
body[data-school-page] .school-support{width:100%;background:var(--sn-soft);border:1px solid var(--sn-line);border-radius:14px;padding:12px 16px}
body[data-school-page] .school-support-label{font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--sn-muted)}
body[data-school-page] .school-support-code{font-weight:800;font-size:1.25rem;letter-spacing:.04em;overflow-wrap:anywhere}
body[data-school-page] .school-secondary{background:#fff;color:var(--sn-ink);border-color:var(--sn-ink)}
body[data-school-page] .school-step-up{display:none}
body[data-school-page] .school-step-up[open]{display:grid;gap:14px}
body[data-school-page] .school-step-up h2{margin:0}
body[data-school-page] .school-step-up p{margin:0}
body[data-school-page] .school-step-up-actions{display:flex;flex-wrap:wrap;gap:12px}
body[data-school-page] .school-step-up-note{font-size:.9rem;color:var(--sn-muted)}

/* Home hub. */
body[data-school-page=home] .home-picker[hidden]{display:none}
body[data-school-page=home] .home-grid{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start;margin-top:20px}
body[data-school-page=home] .home-card{flex:999 1 420px;min-width:0;background:#fff;border:1px solid var(--sn-line);border-radius:18px;padding:22px}
body[data-school-page=home] .home-side{flex:1 1 280px;min-width:0;display:grid;gap:20px}
body[data-school-page=home] .home-side .home-card{flex:none}
body[data-school-page=home] .home-card h2{margin:0;font-size:1.2rem}
body[data-school-page=home] .home-card-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
body[data-school-page=home] .home-pill{display:inline-flex;align-items:center;min-height:26px;padding:2px 10px;border-radius:13px;font-size:.8rem;font-weight:800;background:var(--sn-row);color:var(--sn-ink)}
body[data-school-page=home] .home-pill.yellow{background:var(--sn-yellow)}
body[data-school-page=home] .home-pill.ink{background:var(--sn-ink);color:#fff}
body[data-school-page=home] .home-pill.red{background:#ffe7e7;color:var(--sn-red)}
body[data-school-page=home] .home-pill.orange{background:#fff1e8;color:var(--sn-orange)}
body[data-school-page=home] .home-pill.blue{background:#e8efff;color:var(--sn-blue)}
body[data-school-page=home] .home-attention{list-style:none;margin:0;padding:0}
body[data-school-page=home] .home-attention li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;margin:0;border-bottom:1px solid var(--sn-row);line-height:1.4}
body[data-school-page=home] .home-attention li:last-child{border-bottom:0}
body[data-school-page=home] .home-item{display:flex;gap:12px;align-items:flex-start;min-width:0;flex:1 1 260px}
body[data-school-page=home] .home-item-text{display:grid;gap:2px;min-width:0}
body[data-school-page=home] .home-item-title{font-weight:700}
body[data-school-page=home] .home-item-detail{font-size:.9rem;color:var(--sn-muted)}
body[data-school-page=home] .home-attention .button,body[data-school-page=home] .home-actions .button{background:#fff;color:var(--sn-ink);border-color:var(--sn-ink);padding:10px 16px;min-height:44px;width:auto}
body[data-school-page=home] .home-attention button{border-color:var(--sn-ink);color:var(--sn-ink);width:auto}
body[data-school-page=home] .home-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
body[data-school-page=home] .home-actions .button.primary{background:var(--sn-ink);color:#fff}
body[data-school-page=home] .home-clear{display:grid;gap:8px;justify-items:start;padding:20px 0}
body[data-school-page=home] .home-clear h3,body[data-school-page=home] .home-clear p{margin:0}
body[data-school-page=home] .home-clear-icon{width:56px;height:56px;border-radius:28px;background:var(--sn-ink);position:relative}
body[data-school-page=home] .home-clear-icon::after{content:"";position:absolute;left:20px;top:14px;width:12px;height:22px;border:solid #fff;border-width:0 4px 4px 0;transform:rotate(45deg)}
body[data-school-page=home] .home-kv{margin:0}
body[data-school-page=home] .home-kv div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--sn-row)}
body[data-school-page=home] .home-kv dt{font-size:.9rem;color:var(--sn-muted);font-weight:600}
body[data-school-page=home] .home-kv dd{margin:0;font-weight:600;text-align:right}
body[data-school-page=home] .home-checklist{list-style:none;margin:8px 0 0;padding:0}
body[data-school-page=home] .home-checklist li{margin:0;padding:6px 0}
body[data-school-page=home] .home-checklist .todo{color:var(--sn-orange);font-weight:700}
body[data-school-page=home] .home-skeleton{display:grid;gap:18px;padding:8px 0}
body[data-school-page=home] .home-skeleton span{display:block;height:14px;border-radius:8px;background:var(--sn-row)}
body[data-school-page=home] .home-skeleton span:nth-child(odd){width:45%}
body[data-school-page=home] .home-skeleton span:nth-child(even){width:85%;height:12px}
body[data-school-page=home] .home-error{border-left:4px solid var(--sn-red);background:#ffe7e7;padding:12px 16px;border-radius:0 12px 12px 0;margin-top:16px}
body[data-school-page=home] .home-error p{margin:0}
@media (max-width:520px){body[data-school-page=home] .home-card{padding:16px}body[data-school-page=home] .home-kv dd{text-align:left}}
body[data-school-page=home] .home-pill{flex:none;white-space:nowrap}
body[data-school-page=home] header,body[data-school-page=home] main,body[data-school-page=home] footer{max-width:1120px}
