/* Keep navigation and account actions in view; spacing follows available height. */
#school-sidebar{height:100dvh;min-height:0;overflow:hidden;padding:clamp(12px,2dvh,24px) 1rem max(12px,env(safe-area-inset-bottom,0px))}
#school-sidebar>.brand{flex-shrink:0}
#school-sidebar .school-year{flex-shrink:0;margin:clamp(10px,1.8dvh,20px) .5rem;font-size:.8rem;line-height:1.4}
#school-sidebar .nav-caption{flex-shrink:0;margin:0 0 8px;padding:0 .75rem;font-size:.75rem;line-height:1.4}
#school-sidebar nav{min-height:0;flex:0 1 auto;gap:clamp(2px,.45dvh,6px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
#school-sidebar .nav-item{flex-shrink:0;min-height:clamp(2.35rem,5.5dvh,3rem);padding:.45rem .75rem;gap:.7rem;font-size:1rem;line-height:1.3}
.sidebar-demo{flex-shrink:0;margin-top:12px}
.sidebar-demo-trigger{display:flex;align-items:center;gap:10px;width:100%;min-height:58px;padding:9px 11px;border:1px solid var(--theme-line,#dce7df);border-radius:12px;background:var(--theme-surface-muted,#edf4ef);color:var(--theme-text,#214e3d);text-align:left;transition:background .15s,border-color .15s}
.sidebar-demo-trigger:hover,.sidebar-demo-trigger[aria-expanded="true"]{background:var(--theme-selected,#e3eee5);border-color:var(--theme-accent-border,#8eaf9a)}
.sidebar-demo-symbol{display:grid;place-items:center;flex-shrink:0;width:30px;height:30px;color:var(--theme-accent,#39775b)}
.sidebar-demo-symbol>.icon{width:23px;height:23px}
.sidebar-demo-caption{display:flex;flex:1;min-width:0;flex-direction:column;gap:2px}
.sidebar-demo-caption small{font-size:.72rem;line-height:1.3;color:var(--theme-muted,#6c8175)}
.sidebar-demo-caption strong{font-size:.9rem;line-height:1.35;font-weight:600}
.sidebar-demo-trigger>.icon{width:15px;height:15px;flex-shrink:0;color:var(--theme-muted,#6c8175)}
.sidebar-demo-menu{position:fixed;inset:auto;margin:0;width:14rem;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:8px;border:1px solid var(--theme-line,#dce5df);border-radius:15px;background:var(--theme-surface,#fff);color:var(--theme-text,#254c3c);box-shadow:0 10px 36px var(--theme-shadow,#29473520);overflow:auto}
.sidebar-demo-menu-heading{padding:7px 10px 11px;font-size:.88rem;font-weight:650;line-height:1.4}
.sidebar-demo-menu-heading small{display:block;margin-top:3px;font-size:.72rem;font-weight:400;color:var(--theme-muted,#728078)}
.sidebar-demo-menu [role="menuitemradio"]{display:flex;align-items:center;gap:11px;width:100%;min-height:44px;padding:10px;border:0;border-radius:9px;background:transparent;color:inherit;text-align:left;font-size:.9rem;line-height:1.3}
.sidebar-demo-menu [role="menuitemradio"]>.icon{width:20px;height:20px;flex-shrink:0;color:var(--theme-muted,#6c8175)}
.sidebar-demo-menu [role="menuitemradio"]:hover{background:var(--theme-hover,#f2f6f3)}
.sidebar-demo-menu [aria-checked="true"]{background:var(--theme-selected,#e8f1e9);color:var(--theme-accent,#27654a);font-weight:600}
.sidebar-demo-menu [aria-checked="true"]>.icon{color:inherit}
.sidebar-demo-check{display:flex;align-items:center;margin-left:auto;visibility:hidden}
.sidebar-demo-check>.icon{width:17px;height:17px}
.sidebar-demo-menu [aria-checked="true"] .sidebar-demo-check{visibility:visible}
.sidebar-demo-menu [role="menuitemradio"]:focus-visible{outline:2px solid var(--theme-accent-border,#759d87);outline-offset:-2px}
#school-sidebar .sidebar-bottom{margin-top:auto;padding-top:clamp(8px,1.5dvh,18px);flex-shrink:0}
#school-sidebar .support-button{min-height:38px;padding:7px .5rem;margin:0 0 10px;gap:8px;font-size:.85rem;line-height:1.4;text-align:left;border-radius:9px}
#school-sidebar .support-button>span{white-space:nowrap}
#school-sidebar .support-button:hover{background:var(--theme-hover,#f2f6f3)}
#school-sidebar .sidebar-account{border-top:1px solid var(--theme-line,#dfe7e2);padding-top:12px}
#school-sidebar .profile{border:0;padding:0;gap:10px;align-items:center;min-height:45px;border-radius:9px}
#school-sidebar .profile>.avatar{width:2.5rem;height:2.5rem}
#school-sidebar .profile>span:not(.avatar){flex:1;min-width:0}
#school-sidebar .profile strong{font-size:.95rem;line-height:1.3;overflow-wrap:anywhere}
#school-sidebar .profile small{font-size:.8rem;line-height:1.35;margin-top:3px;color:var(--theme-muted,#738279)}
#school-sidebar .profile>.icon{width:15px;height:15px;flex-shrink:0;margin-left:0}
#school-sidebar .profile:hover{background:var(--theme-hover,#f2f6f3)}
#school-sidebar .sidebar-logout{display:flex;align-items:center;justify-content:center;gap:7px;width:max-content;max-width:calc(100% - 2.5rem - 10px);min-height:34px;margin:8px 0 0 calc(2.5rem + 10px);padding:5px 12px;border:1px solid var(--theme-line,#dfe7e2);border-radius:20px;background:var(--theme-surface-muted,#f5f8f5);color:var(--theme-muted,#61776b);font-size:.8rem;line-height:1.4;text-align:left;transition:background .15s,color .15s}
#school-sidebar .sidebar-logout>.icon{width:16px;height:16px;flex-shrink:0;color:var(--theme-accent,#59826c)}
#school-sidebar .sidebar-logout:hover{background:var(--theme-hover,#eaf2ec);color:var(--theme-text,#294e3e);border-color:var(--theme-accent-border,#9abaA6)}
#school-sidebar :is(a,button):focus-visible{outline:2px solid var(--theme-accent-border,#759d87);outline-offset:-2px}
@media(max-height:740px){
  .sidebar-demo{margin-top:8px}
  .sidebar-demo-trigger{min-height:52px;padding-top:6px;padding-bottom:6px}
  #school-sidebar{padding-top:10px;padding-bottom:10px}
  #school-sidebar .school-year{margin:8px .5rem}
  #school-sidebar .nav-caption{display:none}
  #school-sidebar .nav-item{min-height:2.2rem;padding:.35rem .75rem}
  #school-sidebar .sidebar-bottom{padding-top:8px}
  #school-sidebar .support-button{margin-bottom:6px}
  #school-sidebar .sidebar-account{padding-top:9px}
}
@media(max-height:620px){
  #school-sidebar .school-year{display:none}
  #school-sidebar>.brand{margin-bottom:8px}
  #school-sidebar .sidebar-brand-vector{max-height:3.7rem}
  #school-sidebar nav{gap:2px}
  #school-sidebar .nav-item{min-height:1.85rem;padding:.25rem .75rem}
  #school-sidebar .support-button{min-height:32px;padding-top:4px;padding-bottom:4px}
  #school-sidebar .sidebar-account{padding-top:7px}
  #school-sidebar .sidebar-logout{margin-top:6px;min-height:30px}
}
/* The handle lives outside the sidebar, so it stays at screen centre. */
.sidebar-toggle{display:none}
@media(min-width:761px){
  /* The straight edge stops at the handle; only its outer curve is stroked. */
  #school-sidebar{border-right:0}
  #school-sidebar::before,#school-sidebar::after{content:"";position:absolute;right:0;width:1px;height:calc(50% - 42px);background:var(--line);pointer-events:none}
  #school-sidebar::before{top:0}
  #school-sidebar::after{bottom:0}
  .sidebar-toggle{
    position:fixed;left:calc(var(--sidebar) - 13px);top:50dvh;z-index:40;
    display:block;width:36px;height:84px;transform:translateY(-50%);
    padding:0;border:0;background:none;color:var(--theme-text,#47685a);
    cursor:pointer;outline:none;transition:left .2s ease,color .15s ease;
    -webkit-tap-highlight-color:transparent;
  }
  .sidebar-toggle-shape{position:absolute;inset:0 auto 0 12px;width:20px;height:84px;overflow:visible;pointer-events:none}
  .sidebar-toggle-shape path{transition:fill .15s,stroke .15s}
  .sidebar-toggle-fill{fill:var(--theme-surface-muted,#eef3ef);stroke:none}
  .sidebar-toggle-outline{fill:none;stroke:var(--theme-line,#cfdcd4);stroke-width:1;filter:drop-shadow(2px 0 3px var(--theme-shadow,#28473712))}
  .sidebar-toggle>.icon{position:absolute;left:15px;top:35px;width:13px;height:14px;stroke-width:2;transform:rotate(180deg);pointer-events:none}
  .sidebar-toggle:hover .sidebar-toggle-fill,.sidebar-toggle:focus-visible .sidebar-toggle-fill{fill:var(--theme-selected,#e1eee5)}
  .sidebar-toggle:hover .sidebar-toggle-outline,.sidebar-toggle:focus-visible .sidebar-toggle-outline{stroke:var(--theme-accent-border,#759d87)}
  .sidebar-toggle:focus-visible .sidebar-toggle-outline{filter:drop-shadow(0 0 3px var(--theme-accent-border,#759d87))}
  .sidebar-toggle:hover{color:var(--theme-accent,#236b53)}
  .sidebar-toggle:active .sidebar-toggle-fill{fill:var(--theme-hover,#dcebe0)}
  #school-sidebar{transition:width .2s ease,padding .2s ease}
  #app>.workspace{transition:margin-left .2s ease}

  html.sidebar-collapsed:has(.workspace),html.sidebar-collapsed:has(.workspace) .sidebar{--sidebar:4.25rem}
  html.sidebar-collapsed .sidebar-toggle>.icon{transform:none}
  html.sidebar-collapsed #school-sidebar{padding:.75rem .625rem}
  html.sidebar-collapsed #school-sidebar :is(.brand,.school-year,.nav-caption){display:none}
  html.sidebar-collapsed #school-sidebar nav{gap:clamp(2px,.6dvh,7px)}
  html.sidebar-collapsed #school-sidebar .nav-item{justify-content:center;padding:0;width:100%;min-height:clamp(36px,6dvh,2.75rem);gap:0;border-radius:.75rem}
  html.sidebar-collapsed #school-sidebar .nav-item>span:not(.nav-count){display:none}
  html.sidebar-collapsed #school-sidebar .nav-item>.icon{width:1.3rem;height:1.3rem;flex-shrink:0}
  html.sidebar-collapsed #school-sidebar .nav-count{position:absolute;top:2px;right:0;margin:0;min-width:16px;height:16px;padding:0 3px;font-size:10px;line-height:16px;text-align:center;border-radius:6px}
  html.sidebar-collapsed #school-sidebar .sidebar-bottom{padding-top:.5rem}
  html.sidebar-collapsed #school-sidebar .sidebar-demo{margin-top:10px}
  html.sidebar-collapsed #school-sidebar .sidebar-demo-trigger{min-height:2.6rem;justify-content:center;padding:0;border-radius:.75rem}
  html.sidebar-collapsed #school-sidebar .sidebar-demo-caption,html.sidebar-collapsed #school-sidebar .sidebar-demo-trigger>.icon{display:none}
  html.sidebar-collapsed #school-sidebar :is(.support-button,.sidebar-logout){justify-content:center;gap:0;padding:0;min-height:2.2rem;width:100%;max-width:none;border-radius:.75rem;margin:0 0 .4rem}
  html.sidebar-collapsed #school-sidebar :is(.support-button>span,.support-button>.icon:last-child,.sidebar-logout-label){display:none}
  html.sidebar-collapsed #school-sidebar :is(.support-button>.icon,.sidebar-logout>.icon){width:1.3rem;height:1.3rem}
  html.sidebar-collapsed #school-sidebar .sidebar-account{padding-top:.5rem;display:flex;flex-direction:column;align-items:center;gap:6px}
  html.sidebar-collapsed #school-sidebar .sidebar-logout{margin:0;border-color:transparent;background:none}
  html.sidebar-collapsed #school-sidebar .profile{justify-content:center;gap:0;padding:0;margin:0}
  html.sidebar-collapsed #school-sidebar .profile>:not(.avatar){display:none}
  html.sidebar-collapsed #school-sidebar .profile>.avatar{width:2.1rem;height:2.1rem;flex-shrink:0}
  html.sidebar-collapsed #school-sidebar :is(.support-button,.sidebar-logout):hover{background:var(--theme-hover,#f2f6f3);color:var(--theme-accent,#236b53)}
  html.sidebar-collapsed #school-sidebar :is(a,button):focus-visible{outline:2px solid var(--theme-accent-border,#759d87);outline-offset:-2px}
}
@media(prefers-reduced-motion:reduce){
  #school-sidebar,#app>.workspace,.sidebar-toggle,.sidebar-toggle-shape path{transition:none}
}