.app-shell,.sidebar{transition:grid-template-columns .22s ease,width .22s ease}.sidebar{z-index:20;min-width:0}.sidebar nav{min-height:0;overflow-y:auto;overflow-x:hidden;padding-right:3px;scrollbar-width:thin}.sidebar-collapse{position:absolute;right:-14px;top:28px;z-index:2;width:30px;height:30px;display:grid;place-items:center;border:2px solid var(--paper);border-radius:50%;background:#fff;color:var(--green);box-shadow:0 5px 15px #173d3028;cursor:pointer}.sidebar-collapse span{font-size:24px;line-height:1;transition:transform .2s}.sidebar-scrim{display:none}.app-shell.sidebar-collapsed{grid-template-columns:78px 1fr}.sidebar-collapsed .sidebar{width:78px;padding:28px 12px}.sidebar-collapsed .brand{margin:0 auto 38px}.sidebar-collapsed .brand>div,.sidebar-collapsed .sidebar-footer,.sidebar-collapsed .secretary-room-nav{display:none!important}.sidebar-collapsed .brand-mark{width:42px;height:42px}.sidebar-collapsed .nav-item{width:52px;height:48px;justify-content:center;padding:0;font-size:0;gap:0}.sidebar-collapsed .nav-item span{width:auto;font-size:20px}.sidebar-collapsed .sidebar-collapse span{transform:rotate(180deg)}
@media(max-width:900px){.app-shell.sidebar-collapsed{grid-template-columns:1fr}.sidebar,.sidebar-collapsed .sidebar{width:min(310px,86vw);padding:24px 18px;transform:translateX(-105%);box-shadow:18px 0 55px #142a2255}.sidebar.open,.sidebar-collapsed .sidebar.open{transform:none}.sidebar-collapse{display:none}.sidebar .brand{margin-bottom:24px}.sidebar nav{padding-bottom:18px}.sidebar-footer{padding-top:15px}.sidebar-scrim{position:fixed;inset:0;z-index:19;border:0;background:#152d2677;opacity:0;pointer-events:none;display:block;transition:opacity .2s}.sidebar.open~.sidebar-scrim{opacity:1;pointer-events:auto}.menu{display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:#fff;color:var(--green);box-shadow:var(--shadow);cursor:pointer}.topbar{z-index:10}.sidebar-collapsed .brand>div{display:block}.sidebar-collapsed .sidebar-footer{display:grid}.sidebar-collapsed .nav-item{width:100%;height:auto;justify-content:flex-start;padding:13px;font-size:inherit;gap:14px}.sidebar-collapsed .nav-item span{width:22px;font-size:19px}.sidebar-collapsed .secretary-room-nav{display:flex!important}}
@media(max-width:520px){.sidebar,.sidebar-collapsed .sidebar{width:min(330px,92vw)}.topbar{gap:10px}.top-actions{min-width:0}.top-actions .primary{white-space:nowrap;font-size:12px}.view{overflow-x:hidden}.coord-card,.secretary-attendance-card,.monthly-attendance-wrap{max-width:100%}}
body.is-secretary .sidebar-collapsed .secretary-room-nav,body.is-direction .sidebar-collapsed .secretary-room-nav{display:none!important}
@media(max-width:900px){body.is-secretary .sidebar-collapsed .secretary-room-nav,body.is-direction .sidebar-collapsed .secretary-room-nav{display:flex!important}}
.login-screen{overflow-y:auto;overflow-x:hidden;place-items:start center;overscroll-behavior:contain}.login-screen .login-card{margin:24px 0;flex:none}.login-screen.hidden{overflow:hidden}
@media(max-height:820px){.login-screen{padding-top:14px;padding-bottom:14px}.login-screen .login-card{margin:0}.login-screen .brand.dark{margin-bottom:24px}.login-screen .demo-role-list{margin-top:18px}}
@media(max-width:520px){.login-screen{padding:10px}.login-screen .login-card{margin:0;width:100%}}