:is(#organizationView,.school-grade-personnel) .sp-actions{display:flex;gap:8px;flex-wrap:wrap}
:is(#organizationView,.school-grade-personnel) .sp-editor{margin-bottom:24px}
:is(#organizationView,.school-grade-personnel) .sp-editor fieldset{border:0;margin:0;padding:0;min-width:0}
:is(#organizationView,.school-grade-personnel) .sp-editor .so-form-grid{margin-bottom:18px}
:is(#organizationView,.school-grade-personnel) .sp-search{display:grid;gap:7px;margin:0 0 10px;font-size:13px}
:is(#organizationView,.school-grade-personnel) .sp-search input,:is(#organizationView,.school-grade-personnel) .sp-list-tools input,:is(#organizationView,.school-grade-personnel) .sp-list-tools select{min-width:0;width:100%;min-height:44px;border:1px solid var(--line,#ececef);border-radius:10px;padding:10px 12px;background:#fff;color:var(--ink,#20212b)}
:is(#organizationView,.school-grade-personnel) .sp-teachers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:236px;overflow:auto;overscroll-behavior:contain;padding:2px}
:is(#organizationView,.school-grade-personnel) .sp-teacher{display:flex;align-items:center;gap:10px;min-height:58px;border:1px solid var(--line,#ececef);border-radius:10px;background:#fff;padding:10px;cursor:pointer;min-width:0}
:is(#organizationView,.school-grade-personnel) .sp-teacher:has(input:checked){border-color:var(--brand,#5e5ce6);background:#f1f0ff}
:is(#organizationView,.school-grade-personnel) .sp-teacher input{width:17px;height:17px;margin:0;flex:none;accent-color:var(--brand,#5e5ce6)}
:is(#organizationView,.school-grade-personnel) .sp-teacher>span{min-width:0}:is(#organizationView,.school-grade-personnel) .sp-teacher strong,:is(#organizationView,.school-grade-personnel) .sp-teacher small{display:block;overflow-wrap:anywhere}:is(#organizationView,.school-grade-personnel) .sp-teacher strong{font-size:14px;font-weight:600}:is(#organizationView,.school-grade-personnel) .sp-teacher small{font-size:12px;color:var(--ink-2,#6e6e76);margin-top:2px}
:is(#organizationView,.school-grade-personnel) .sp-selected{min-height:22px;margin:10px 0 18px;font-size:13px}:is(#organizationView,.school-grade-personnel) .sp-effective{display:flex;gap:16px;align-items:center;min-height:44px;margin:0 0 16px;color:var(--ink-2,#6e6e76);font-size:13px}:is(#organizationView,.school-grade-personnel) .sp-effective strong{color:var(--ink,#20212b);font-weight:500}
:is(#organizationView,.school-grade-personnel) .sp-scope{display:flex;flex-direction:column;gap:12px;font-size:13px}:is(#organizationView,.school-grade-personnel) .sp-scope strong{font-size:14px;font-weight:500}
:is(#organizationView,.school-grade-personnel) .sp-list-tools{display:flex;gap:12px;margin:20px 0 16px}:is(#organizationView,.school-grade-personnel) .sp-list-tools label{min-width:0;flex:1;max-width:380px}:is(#organizationView,.school-grade-personnel) .sp-list-tools select{width:150px}:is(#organizationView,.school-grade-personnel) .sp-empty{grid-column:1/-1;text-align:center;padding:24px;font-size:14px}
:is(#organizationView,.school-grade-personnel) .sp-table td{vertical-align:middle}:is(#organizationView,.school-grade-personnel) .sp-table td:nth-child(4){font-variant-numeric:tabular-nums;font-size:13px}:is(#organizationView,.school-grade-personnel) .sp-sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@media(max-width:760px){:is(#organizationView,.school-grade-personnel) .sp-teachers{grid-template-columns:repeat(2,minmax(0,1fr))}:is(#organizationView,.school-grade-personnel) .sp-actions .so-button{flex:1}:is(#organizationView,.school-grade-personnel) .sp-table,:is(#organizationView,.school-grade-personnel) .sp-table tbody{display:block;width:100%;min-width:0}:is(#organizationView,.school-grade-personnel) .sp-table thead{display:none}:is(#organizationView,.school-grade-personnel) .sp-table tr{display:block;padding:12px 16px;border-bottom:1px solid var(--line,#ececef)}:is(#organizationView,.school-grade-personnel) .sp-table tr:last-child{border:0}:is(#organizationView,.school-grade-personnel) .sp-table td{display:grid;grid-template-columns:76px minmax(0,1fr);gap:8px;padding:7px 0;border:0;overflow-wrap:anywhere}:is(#organizationView,.school-grade-personnel) .sp-table td:before{content:attr(data-label);font-size:13px;color:var(--ink-2,#6e6e76)}:is(#organizationView,.school-grade-personnel) .sp-table .so-badge{justify-self:start}:is(#organizationView,.school-grade-personnel) .sp-table button{justify-self:start}}
@media(max-width:420px){:is(#organizationView,.school-grade-personnel) .sp-teachers{grid-template-columns:1fr}:is(#organizationView,.school-grade-personnel) .sp-list-tools{flex-wrap:wrap}:is(#organizationView,.school-grade-personnel) .sp-list-tools label{flex-basis:100%;max-width:none}:is(#organizationView,.school-grade-personnel) .sp-list-tools select{width:100%}}

/* Keep native selects readable and inset their disclosure arrow within this module. */
:is(#organizationView,.school-grade-personnel) .sp-page :is(.sp-editor,.sp-list-tools) select{appearance:none;-webkit-appearance:none;padding-inline-end:36px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%236e6e76' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;background-size:16px 16px}
@media(forced-colors:active){:is(#organizationView,.school-grade-personnel) .sp-page :is(.sp-editor,.sp-list-tools) select{appearance:auto;-webkit-appearance:auto;background-image:none}}
