*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%;text-rendering:auto}
body,button,input,textarea,select{font-synthesis:none}
button,a,input,textarea,select{touch-action:manipulation}
img{content-visibility:auto}
:root{
  --bg-base:#05080c;--bg-deep:#020406;--bg-card:#0b1119;--bg-panel:rgba(11,17,25,.82);--bg-input:rgba(96,165,250,.06);
  --teal:#2563eb;--teal-bright:#60a5fa;--teal-dim:rgba(96,165,250,.15);--teal-line:rgba(96,165,250,.24);
  --aqua:#3b82f6;--aqua-bright:#93c5fd;--aqua-dim:rgba(59,130,246,.15);
  --text:#ffffff;--text-dim:#94a3b8;--text-faint:#64748b;
  --line:rgba(96,165,250,.20);--line-soft:rgba(148,163,184,.08);
  --danger:#fc8181;--danger-dim:rgba(252,129,129,.14);
  --warning:#f6ad55;--warning-dim:rgba(246,173,85,.14);
  --success:#60a5fa;--success-dim:rgba(96,165,250,.14);
  --radius-xs:10px;--radius-s:14px;--radius:20px;--radius-l:28px;--radius-xl:36px;
  --shadow-s:0 4px 18px rgba(0,0,0,.55);--shadow:0 18px 55px -20px rgba(0,0,0,.85);--shadow-l:0 34px 90px -28px rgba(0,0,0,.94);--shadow-mobile:0 16px 44px -20px rgba(0,0,0,.75);
  --glow-e:0 0 46px rgba(37,99,235,.34);--glow-c:0 0 46px rgba(96,165,250,.28);
  --ease:cubic-bezier(.22,1,.36,1);--ease-soft:cubic-bezier(.4,0,.2,1);
  --z-nav:200;--z-side:300;--z-ovl:250;--z-modal:500;--z-toast:600;--z-loader:9999;
  --motion-fast:.16s;--motion-med:.24s;--motion-slow:.36s;
  --ease-smooth:cubic-bezier(.22,1,.36,1);--motion-micro:.22s;--motion-ui:.42s;--motion-enter:.68s;
}
[data-theme="light"]{
  --bg-base:#f0f5f5;--bg-deep:#e6eded;--bg-card:#ffffff;--bg-panel:rgba(255,255,255,.9);--bg-input:rgba(37,99,235,.06);
  --teal:#1d4ed8;--teal-bright:#2563eb;--teal-dim:rgba(37,99,235,.12);--teal-line:rgba(37,99,235,.24);
  --aqua:#2563eb;--aqua-bright:#3b82f6;--aqua-dim:rgba(37,99,235,.12);
  --text:#0f172a;--text-dim:#475569;--text-faint:#64748b;
  --line:rgba(37,99,235,.22);--line-soft:rgba(15,23,42,.08);
  --danger:#e53e3e;--warning:#dd6b20;--success:#1d4ed8;--success-dim:rgba(29,78,216,.12);--danger-dim:rgba(229,62,62,.10);--warning-dim:rgba(221,107,32,.11);
  --shadow-s:0 4px 18px rgba(15,23,42,.10);--shadow:0 18px 55px -22px rgba(15,23,42,.22);--shadow-l:0 34px 90px -30px rgba(15,23,42,.28);--shadow-mobile:0 16px 44px -22px rgba(15,23,42,.20);
  --glow-e:0 0 46px rgba(37,99,235,.22);--glow-c:0 0 46px rgba(96,165,250,.20);
}
html{scroll-behavior:smooth;overscroll-behavior-y:none}
body{
  background:var(--bg-base);color:var(--text);
  font-family:'Plus Jakarta Sans','Noto Sans Arabic',system-ui,sans-serif;
  min-height:100vh;overflow-x:hidden;padding-top:6.5rem;
  overscroll-behavior-x:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:relative;
  -webkit-user-select:none;user-select:none;
}
[lang="ar"] body{font-family:'Noto Sans Arabic','Plus Jakarta Sans',sans-serif}
input,textarea{-webkit-user-select:text;user-select:text}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 12% 6%,rgba(37,99,235,.14),transparent 44%),radial-gradient(circle at 88% 14%,rgba(96,165,250,.12),transparent 46%),radial-gradient(circle at 50% 104%,rgba(59,130,246,.10),transparent 54%)}
body::after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(rgba(96,165,250,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(96,165,250,.05) 1px,transparent 1px);background-size:60px 60px;-webkit-mask-image:radial-gradient(circle at 50% 28%,#000,transparent 76%);mask-image:radial-gradient(circle at 50% 28%,#000,transparent 76%)}
[data-theme="light"] body::after{background-image:linear-gradient(rgba(37,99,235,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.06) 1px,transparent 1px)}
main{position:relative;z-index:1}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(37,99,235,.55),rgba(96,165,250,.45));border-radius:99px;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,rgba(96,165,250,.95),rgba(147,197,253,.8));background-clip:padding-box}
*{scrollbar-width:thin;scrollbar-color:rgba(96,165,250,.5) transparent}
.hidden{display:none!important;visibility:hidden;pointer-events:none}
.text-muted{color:var(--text-dim)}
.text-danger{color:var(--danger)}
.text-gradient{background-image:linear-gradient(135deg,#2563eb 0%,#60a5fa 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.mono{font-family:'JetBrains Mono',monospace;font-size:.87rem}
#loadingScreen{position:fixed;inset:0;z-index:var(--z-loader);display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(circle at 50% 46%,#0b1424 0%,#050911 38%,#020406 100%);transition:opacity .8s var(--ease-soft),visibility .8s var(--ease-soft)}
#loadingScreen.hidden{opacity:0!important;visibility:hidden!important;pointer-events:none!important;display:none!important}
#topNavbar{position:fixed;top:1rem;left:50%;transform:translateX(-50%);z-index:var(--z-nav);width:calc(100% - 2rem);max-width:1180px;pointer-events:none}
.nav-inner{pointer-events:auto;width:100%;height:66px;padding:.55rem .7rem .55rem 1.4rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;background:var(--bg-panel);backdrop-filter:blur(14px) saturate(1.5);-webkit-backdrop-filter:blur(14px) saturate(1.5);border:1px solid var(--line);border-radius:9999px;box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.05);transition:border-color .35s var(--ease),background .35s var(--ease)}
.nav-inner:hover{border-color:rgba(96,165,250,.46)}
.nav-brand{display:flex;align-items:center;gap:.7rem;font-weight:800;font-size:1.08rem;text-decoration:none;color:var(--text);flex-shrink:0;transition:transform .45s var(--ease);cursor:pointer}
.nav-brand:hover{transform:scale(1.035)}
.nav-brand:active{transform:scale(.96)}
.brand-logo{width:40px;height:40px;border-radius:13px;flex-shrink:0;overflow:hidden;background:linear-gradient(135deg,#2563eb 0%,#60a5fa 100%);display:flex;align-items:center;justify-content:center;color:#05080c;font-size:1.2rem;box-shadow:0 8px 26px rgba(37,99,235,.48);position:relative;transition:box-shadow .45s var(--ease)}
.nav-brand:hover .brand-logo{box-shadow:0 12px 34px rgba(37,99,235,.7),0 0 30px rgba(96,165,250,.5)}
.brand-img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block;pointer-events:none;user-select:none}
.brand-pwa-badge{position:absolute;bottom:-3px;right:-3px;width:16px;height:16px;border-radius:50%;background:linear-gradient(135deg,#2563eb,#60a5fa);border:2px solid var(--bg-base);display:flex;align-items:center;justify-content:center;color:#05080c;font-size:.6rem;font-weight:900;animation:badgePulse 2.2s var(--ease) infinite;pointer-events:none}
.brand-pwa-badge::after{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid rgba(96,165,250,.6);pointer-events:none;animation:badgeRing 2.2s var(--ease) infinite}
.brand-name{background:linear-gradient(120deg,#60a5fa,#93c5fd);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:-.01em}
.nav-actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0}
html.admin-mode-active .admin-tools-dropdown{display:block!important}
#sidebar{display:none!important;position:fixed;top:0;bottom:0;z-index:var(--z-side);width:350px;max-width:88vw;background:var(--bg-panel);backdrop-filter:blur(16px) saturate(1.5);-webkit-backdrop-filter:blur(16px) saturate(1.5);display:flex;flex-direction:column;transition:transform .48s var(--ease);contain:content;box-shadow:var(--shadow-mobile)}
html[dir="rtl"] #sidebar{right:0;left:auto;transform:translate3d(100%,0,0);border-left:1px solid var(--line)}
html[dir="ltr"] #sidebar{left:0;right:auto;transform:translate3d(-100%,0,0);border-right:1px solid var(--line)}
#sidebar.open{transform:translate3d(0,0,0)!important}
.sidebar-inner{padding:2.4rem 1.4rem 1.4rem;display:flex;flex-direction:column;height:100%;overflow-y:auto}
.sidebar-brand{display:flex;align-items:center;gap:.8rem;font-weight:800;font-size:1.3rem;margin-bottom:2.3rem;padding-bottom:1.6rem;border-bottom:1px solid var(--line)}
.sidebar-brand .brand-logo{width:48px;height:48px;border-radius:16px;font-size:1.35rem}
#overlay{display:none!important;position:fixed;inset:0;z-index:var(--z-ovl);background:rgba(2,4,6,.75);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);transition:opacity .45s var(--ease),visibility .45s var(--ease)}
#overlay.hidden{opacity:0;visibility:hidden;pointer-events:none;display:block!important}
#breadcrumb{position:fixed;top:6.5rem;left:50%;transform:translateX(-50%);z-index:90;display:flex;align-items:center;gap:.25rem;padding:6px 14px;background:var(--bg-panel);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:9999px;box-shadow:var(--shadow);max-width:90vw}
.breadcrumb-btn{display:inline-flex;align-items:center;gap:4px;padding:4px 12px;border-radius:9999px;font-size:.72rem;font-weight:600;color:var(--text-dim);background:none;border:none;cursor:pointer;font-family:inherit;transition:color .32s ease,background-color .32s ease}
.breadcrumb-btn:hover{color:var(--text);background:var(--teal-dim)}
.breadcrumb-sep{color:var(--text-dim);opacity:.4;font-size:.65rem}
#viewLogin,#viewStudent,#viewAccount,#viewAdmin{padding:4rem 1.5rem 8rem;max-width:1280px;margin:0 auto;position:relative;z-index:1;opacity:1;transform:translate3d(0,0,0);transition:opacity .32s var(--ease),transform .38s var(--ease)}
#viewLogin{max-width:540px;padding-top:3rem}
#viewAccount{max-width:580px}
.login-hero{text-align:center;margin-bottom:3rem}
.login-hero h1{font-size:clamp(2.7rem,7vw,3.9rem);font-weight:800;letter-spacing:-.035em;line-height:1.04;background:linear-gradient(135deg,#2563eb 0%,#60a5fa 100%);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:.7rem}
.login-hero p{color:var(--text-dim);font-size:1.03rem;font-weight:400}
.flex{display:flex}
.flex-col{flex-direction:column}
.flex-wrap{flex-wrap:wrap}
.flex-1{flex:1 1 0%}
.items-center{align-items:center}
.items-start{align-items:flex-start}
.items-end{align-items:flex-end}
.justify-center{justify-content:center}
.justify-between{justify-content:space-between}
.justify-end{justify-content:flex-end}
.grid{display:grid}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}
.space-y-2>*+*{margin-top:.5rem}
.space-y-3>*+*{margin-top:.75rem}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-auto{margin-top:auto}
.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}
.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-10{margin-bottom:2.5rem}
.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}
.px-3{padding-left:.75rem;padding-right:.75rem}
.px-6{padding-left:1.5rem;padding-right:1.5rem}
.px-8{padding-left:2rem;padding-right:2rem}
.py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-4{padding-top:1rem;padding-bottom:1rem}
.py-8{padding-top:2rem;padding-bottom:2rem}
.pt-4{padding-top:1rem}.pt-6{padding-top:1.5rem}.pb-32{padding-bottom:8rem}
.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}
.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}
.text-4xl{font-size:2.25rem}.text-5xl{font-size:3rem}
.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}
.text-center{text-align:center}
.uppercase{text-transform:uppercase}
.tracking-widest{letter-spacing:.1em}
.whitespace-nowrap{white-space:nowrap}
.overflow-hidden{overflow:hidden}
.overflow-y-auto{overflow-y:auto}
.max-w-lg{max-width:32rem}
.w-full{width:100%}
.w-max{width:max-content}
.mx-auto{margin-left:auto;margin-right:auto}
#contactFloatLink{position:fixed;bottom:2rem;left:50%;transform:translateX(-50%);z-index:90;text-decoration:none}
.note-good{color:var(--teal-bright);font-weight:700}
.note-mid{color:var(--warning);font-weight:700}
.note-bad{color:var(--danger);font-weight:700}
.note-abs{color:var(--text-dim);font-style:italic}
.coef-badge{display:inline-block;background:var(--aqua-dim);border:1px solid var(--line);border-radius:7px;padding:1px 7px;font-size:.69rem;color:var(--text-dim);margin-left:6px;font-weight:600;transition:all .4s var(--ease)}
[dir="rtl"] .coef-badge{margin-left:0;margin-right:6px}
tr:hover .coef-badge{transform:scale(1.12);border-color:rgba(147,197,253,.5);color:var(--aqua-bright)}
html.low-end *:not(#loadingScreen):not(#loadingScreen *),
html.low-end *:not(#loadingScreen):not(#loadingScreen *)::before,
html.low-end *:not(#loadingScreen):not(#loadingScreen *)::after{animation:none!important;transition:none!important}
html.low-end body::before,html.low-end body::after{display:none!important}
html.anim-off *,html.anim-off *::before,html.anim-off *::after{animation:none!important;transition:none!important}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(96,165,250,.22),0 0 20px rgba(96,165,250,.18)}
@media (max-width:768px){
  #topNavbar{top:.65rem;width:calc(100% - 1rem)}
  .nav-inner{padding:.45rem .5rem .45rem 1rem;height:58px}
  .brand-name{display:none}
  .brand-logo{width:34px;height:34px;border-radius:11px;font-size:1rem}
  body{padding-top:5.5rem}
  #breadcrumb{top:5.2rem}
  body::before{background:radial-gradient(circle at 20% 8%,rgba(37,99,235,.10),transparent 42%),radial-gradient(circle at 80% 16%,rgba(96,165,250,.08),transparent 44%)}
  body::after{background-size:72px 72px;-webkit-mask-image:none;mask-image:none}
  body::before,body::after{display:none!important}
  .brand-pwa-badge,.brand-pwa-badge::after{animation:none!important}
}
@media (max-width:640px){
  .stat-val{font-size:1.35rem}
  .grid-cols-3{grid-template-columns:1fr}
  #viewLogin,#viewStudent,#viewAccount,#viewAdmin{padding:2.4rem 1rem 7rem}
}
@media (min-width:641px) and (max-width:900px){.grid-cols-3{grid-template-columns:repeat(3,1fr)}}
@media (pointer:coarse){
  .brand-pwa-badge{animation:none}
  .brand-pwa-badge::after{animation:none;opacity:0}
  .res-table tbody tr{animation:none}
  .res-table th{backdrop-filter:none;-webkit-backdrop-filter:none}
  .res-table tbody tr{contain-intrinsic-size:auto 50px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
#themeTransitionGlow{position:fixed;z-index:9999;width:28px;height:28px;border-radius:50%;pointer-events:none;opacity:0;transform:translate3d(-50%,-50%,0) scale(.18);background:radial-gradient(circle,rgba(96,165,250,.34) 0%,rgba(96,165,250,.13) 38%,transparent 72%);contain:strict}
#themeTransitionGlow.show{will-change:transform,opacity;animation:themeGlow 1.52s cubic-bezier(.16,1,.3,1) both}
#themeTransitionWash{position:fixed;inset:0;z-index:9997;pointer-events:none;opacity:0;visibility:hidden;contain:strict}
#themeTransitionWash.show{visibility:visible;will-change:opacity;animation:themeWash 1.12s cubic-bezier(.22,1,.36,1) both}
.theme-smooth .glass,.theme-smooth .stat-card,.theme-smooth .notif-card,.theme-smooth .modal-box,.theme-smooth .admin-tools-menu,.theme-smooth .custom-select-menu,.theme-smooth .toast-item{transition:none!important}
.theme-smooth .nav-inner,.theme-smooth .icon-btn,.theme-smooth .lang-toggle-btn,.theme-smooth .btn-main,.theme-smooth .btn-ghost,.theme-smooth .btn-sm{transition:none!important}
#viewTransitionLayer{position:fixed;inset:0;z-index:9997;pointer-events:none;opacity:0;overflow:hidden;isolation:isolate}
#viewTransitionLayer .view-transition-orb{position:absolute;left:50%;top:42%;width:32vw;height:32vw;min-width:220px;min-height:220px;max-width:560px;max-height:560px;border-radius:50%;transform:translate(-50%,-50%) scale(.18);background:radial-gradient(circle,rgba(255,255,255,.06) 0%,rgba(96,165,250,.16) 18%,rgba(37,99,235,.09) 38%,transparent 72%);opacity:0;box-shadow:0 0 0 1px rgba(255,255,255,.04),0 0 90px rgba(96,165,250,.14)}
#viewTransitionLayer .view-transition-orb::before,#viewTransitionLayer .view-transition-orb::after{content:"";position:absolute;inset:8%;border:1px solid rgba(255,255,255,.08);border-radius:50%;transform:rotate(18deg) scaleX(1.45);box-shadow:0 0 40px rgba(96,165,250,.08)}
#viewTransitionLayer .view-transition-orb::after{inset:18%;transform:rotate(-24deg) scaleY(.62);border-color:rgba(96,165,250,.12)}
#viewTransitionLayer .view-transition-sheen{position:absolute;inset:-30%;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.045) 48%,rgba(96,165,250,.07) 50%,transparent 63%);transform:translate3d(-38%,0,0) skewX(-12deg);opacity:0}
