:root{--navy:#0b2d4d;--green:#13a36b;--bg:#f4f7fb;--text:#172033;--red:#dc3545;--yellow:#f6c343}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,sans-serif}.app-shell{display:flex;min-height:100vh}.sidebar{width:260px;background:linear-gradient(180deg,var(--navy),#123f68);padding:24px;position:sticky;top:0;height:100vh}.brand{font-weight:800;color:#fff;font-size:1.35rem;margin-bottom:8px;display:flex;align-items:center;gap:10px}.brand img{width:38px;height:38px;object-fit:contain;background:#fff;border-radius:8px;padding:4px}.school-name{color:#c8f4e0;font-size:.82rem;margin-bottom:16px}.sidebar .nav-link{color:#dceafd;border-radius:8px;padding:10px 12px}.sidebar .nav-link:hover{background:rgba(255,255,255,.12);color:#fff}.content{flex:1;padding:26px;min-width:0}.notification-strip{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.page-title{display:flex;justify-content:space-between;gap:16px;align-items:end;margin-bottom:20px}.page-title h1{font-size:1.6rem;margin:0;font-weight:800}.page-title span{color:#667085}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.stat-card,.panel{background:#fff;border:1px solid #e4e9f2;border-radius:8px;box-shadow:0 8px 24px rgba(15,45,77,.06)}.stat-card{padding:18px}.stat-card span{display:block;color:#667085;font-size:.9rem}.stat-card strong{font-size:2rem;color:var(--navy)}.stat-card.danger strong{color:var(--red)}.stat-card.warning strong{color:#b58100}.panel{padding:18px;margin-bottom:18px}.panel h2{font-size:1.1rem;font-weight:800;margin-bottom:14px}.panel h3{font-size:1rem}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.tabs a{padding:8px 12px;border-radius:8px;background:#fff;border:1px solid #d8e1ee;text-decoration:none;color:var(--navy)}.tabs a.active{background:var(--navy);color:#fff}.login-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,#0b2d4d,#147c64)}.login-card{width:min(440px,100%);background:#fff;padding:28px;border-radius:8px;box-shadow:0 20px 50px rgba(0,0,0,.18)}.login-card h1{font-size:1.55rem;font-weight:800}.login-logo{width:70px;height:70px;object-fit:contain;margin-bottom:12px}.setting-preview{margin-top:12px;border:1px solid #e4e9f2;border-radius:8px;padding:12px;width:max-content;background:#f8fafc}.setting-preview img{max-width:180px;max-height:90px;object-fit:contain}.small-preview img{max-width:48px;max-height:48px}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}.evidence-card{border:1px solid #e4e9f2;border-radius:8px;overflow:hidden;background:#fff}.evidence-card img,.evidence-card video{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}.evidence-card small{display:block;padding:8px;color:#667085}.approval-row{display:grid;grid-template-columns:1.4fr 1fr auto auto;gap:10px;align-items:center;border-bottom:1px solid #edf1f7;padding:10px 0}.score-box{border:1px solid #e4e9f2;border-radius:8px;padding:14px;margin-bottom:14px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.map-row{border-left:4px solid var(--green);padding:8px 10px;background:#f7fbf9;margin-bottom:8px}.map-row span,.map-row small{display:block}@media (max-width:900px){.app-shell{display:block}.sidebar{width:100%;height:auto;position:static}.content{padding:16px}.stat-grid,.grid-2{grid-template-columns:1fr}.page-title{display:block}.approval-row{grid-template-columns:1fr}.sidebar .nav{flex-direction:row!important;overflow:auto}.sidebar .nav-link{white-space:nowrap}}@media (max-width:520px){.stat-card strong{font-size:1.55rem}.panel{padding:14px}.content{padding:12px}.login-card{padding:20px}}
.mobile-menu-toggle{display:none}.sidebar-backdrop{display:none}@media (max-width:900px){.mobile-menu-toggle{display:inline-flex;position:fixed;top:12px;left:12px;z-index:1060;width:44px;height:44px;border:0;border-radius:8px;background:var(--navy);box-shadow:0 8px 24px rgba(15,45,77,.22);align-items:center;justify-content:center;flex-direction:column;gap:5px}.mobile-menu-toggle span{width:20px;height:2px;background:#fff;border-radius:2px}.app-shell{display:block;min-height:100vh}.sidebar{position:fixed!important;inset:0 auto 0 0!important;width:min(82vw,300px)!important;height:100vh!important;z-index:1050;transform:translateX(-100%);transition:transform .2s ease;overflow-y:auto}.menu-open .sidebar{transform:translateX(0)}.sidebar-backdrop{display:block;position:fixed;inset:0;background:rgba(9,24,39,.48);z-index:1040;opacity:0;pointer-events:none;transition:opacity .2s ease}.menu-open .sidebar-backdrop{opacity:1;pointer-events:auto}.content{padding:72px 16px 16px}.sidebar .nav{flex-direction:column!important;overflow:visible}.sidebar .nav-link{white-space:normal}body.menu-open{overflow:hidden}}