:root{--primary:#6366f1;--primary-hover:#4f46e5;--primary-glow:#6366f126;--secondary:#8b5cf6;--secondary-hover:#7c3aed;--accent:#10b981;--accent-glow:#10b98126;--admin-accent:#ef4444;--admin-glow:#ef444426;--bg-base:#030712;--bg-surface:#111827b3;--bg-surface-solid:#0b0f19;--bg-muted:#111827;--border-light:#ffffff0d;--border-focus:#6366f166;--text-main:#94a3b8;--text-title:#f8fafc;--text-muted:#64748b;--text-inverse:#fff;--sidebar-bg:#030712;--sidebar-text:#94a3b8;--sidebar-hover:#ffffff08;--radius-sm:8px;--radius-md:12px;--radius-lg:20px;--radius-xl:28px;--shadow-sm:0 2px 8px #0000004d;--shadow-md:0 12px 30px #0006;--shadow-lg:0 24px 60px #0009;--shadow-glow:0 0 30px #6366f11f;--transition-fast:.15s cubic-bezier(.16, 1, .3, 1);--transition-smooth:.3s cubic-bezier(.25, .8, .25, 1);--font-sans:"Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;--font-heading:"Plus Jakarta Sans", var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background:var(--bg-base);color:var(--text-main);min-height:100vh;line-height:1.6;position:relative;overflow-x:hidden}body:before,body:after{content:"";z-index:-1;opacity:.18;filter:blur(140px);pointer-events:none;border-radius:50%;width:50vw;height:50vw;animation:25s ease-in-out infinite alternate float-blob;position:fixed}body:before{background:radial-gradient(circle, var(--primary), transparent 70%);top:-15vw;right:-10vw}body:after{background:radial-gradient(circle, var(--secondary), transparent 70%);animation-delay:-12s;bottom:-15vw;left:-10vw}@keyframes float-blob{0%{transform:translate(0)scale(1)}50%{transform:translate(60px,-40px)scale(1.1)}to{transform:translate(-20px,80px)scale(.9)}}#root{flex-direction:column;width:100%;min-height:100vh;display:flex}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--text-title);letter-spacing:-.03em;font-weight:800}button,input,select,textarea{color:inherit;font-family:inherit}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0003}::-webkit-scrollbar-thumb{background:#ffffff14;border:2px solid #0000;border-radius:99px}::-webkit-scrollbar-thumb:hover{background:#ffffff2e}.authPage{background:radial-gradient(circle at 10% 10%,#6366f11a,#0000 40%),radial-gradient(circle at 90% 90%,#8b5cf61a,#0000 45%),#030712;grid-template-columns:1fr 1fr;align-items:center;gap:40px;min-height:100vh;padding:40px;display:grid;position:relative;overflow:hidden}.authHero{color:var(--text-title);padding-left:60px;animation:.8s ease-out fadeIn}.authHero h1{letter-spacing:-.04em;background:linear-gradient(135deg,#fff 40%,#c7d2fe 80%,#6366f1);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:20px;font-size:72px;font-weight:900;line-height:1.05;display:inline-block}.authHero p{color:var(--text-main);max-width:550px;margin-bottom:40px;font-size:18px;font-weight:400;line-height:1.6}.heroGrid{grid-template-columns:1fr 1fr;gap:20px;max-width:600px;display:grid}.feature{border-radius:var(--radius-md);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff05;border:1px solid #ffffff0d;padding:20px;transition:all .3s cubic-bezier(.16,1,.3,1)}.feature:hover{background:#ffffff0a;border-color:#6366f140;transform:translateY(-4px)scale(1.02);box-shadow:0 10px 30px #0000004d}.feature h3{color:var(--text-title);margin-bottom:6px;font-size:16px;font-weight:700}.feature p{color:var(--text-muted);margin:0;font-size:13px;line-height:1.5}.authBox{border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);box-shadow:var(--shadow-lg), 0 0 40px #6366f10d;z-index:2;background:#0b0f1999;border:1px solid #ffffff0f;justify-self:center;width:100%;max-width:500px;padding:48px;animation:.6s cubic-bezier(.16,1,.3,1) slideInUp;position:relative}.authBox h2{letter-spacing:-.02em;color:var(--text-title);margin-bottom:6px;font-size:28px;font-weight:800}.authBox .muted{color:var(--text-muted);margin-bottom:24px;font-size:14px}.authBox .toggle{background:#0000004d;border:1px solid #ffffff0d;border-radius:20px;grid-template-columns:1fr 1fr;margin-bottom:24px;padding:4px;display:grid}.authBox .toggle button{color:var(--text-muted);cursor:pointer;background:0 0;border:0;border-radius:16px;padding:10px;font-size:14px;font-weight:700;transition:all .2s}.authBox .toggle .active{background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;box-shadow:0 4px 12px #6366f133}.portalCard{transition:all .3s cubic-bezier(.16,1,.3,1)!important}.portalCard:hover{background:#ffffff14!important;border-color:#ffffff26!important;transform:translateY(-4px)scale(1.01)!important;box-shadow:0 12px 30px #0006!important}.portal-admin{--primary:var(--admin-accent);--secondary:#f97316;background:radial-gradient(circle at 10% 10%,#ef444414,#0000 40%),#030712}.portal-teacher{--primary:var(--secondary);--secondary:#ec4899;background:radial-gradient(circle at 10% 10%,#8b5cf614,#0000 40%),#030712}.portal-student{--primary:var(--accent);--secondary:#06b6d4;background:radial-gradient(circle at 10% 10%,#10b98114,#0000 40%),#030712}label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;font-size:11px;font-weight:700;display:block}input,select,textarea{border-radius:var(--radius-sm);color:#fff;background:#ffffff05;border:1px solid #ffffff0f;outline:none;width:100%;padding:11px 14px;font-size:14px;transition:all .2s cubic-bezier(.16,1,.3,1)}input:focus,select:focus,textarea:focus{border-color:var(--primary);background:#ffffff0a;box-shadow:0 0 0 3px #6366f126}textarea{resize:vertical;min-height:90px}.primary{background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:0;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:14px;font-weight:700;transition:all .2s;display:inline-flex;box-shadow:0 8px 20px #6366f126}.primary:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 12px 25px #6366f140}.primary:active{transform:translateY(0)}.primary.small{padding:8px 16px;font-size:13px}.shell{background:#030712;grid-template-columns:260px 1fr;min-height:100vh;display:grid;position:relative}.sidebar{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:10;background:#030712d9;border-right:1px solid #ffffff0a;flex-direction:column;height:100vh;padding:30px 18px;display:flex;position:sticky;top:0}.brand{align-items:center;gap:12px;margin-bottom:35px;padding:0 6px;display:flex}.brandIcon{background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;border-radius:10px;place-items:center;width:40px;height:40px;display:grid;box-shadow:0 6px 15px #6366f133}.brandInfo h2{letter-spacing:-.03em;color:#fff;margin:0;font-size:18px;font-weight:900}.brandInfo p{letter-spacing:1px;text-transform:uppercase;color:var(--primary);margin:2px 0 0;font-size:10px;font-weight:700}.nav{color:var(--sidebar-text);border-radius:var(--radius-sm);text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;gap:12px;margin-bottom:4px;padding:11px 14px;font-size:14px;font-weight:600;transition:all .2s cubic-bezier(.16,1,.3,1);display:flex}.nav:hover{color:#fff;background:#ffffff08;transform:translate(4px)}.nav.active{color:#fff;border-left:3px solid var(--primary);background:linear-gradient(90deg,#6366f114,#0000);padding-left:11px}.logout{color:#ef4444;border-radius:var(--radius-sm);cursor:pointer;background:#ef44440a;border:1px solid #ef444426;justify-content:center;align-items:center;gap:8px;margin-top:auto;padding:11px;font-size:14px;font-weight:700;transition:all .2s;display:flex}.logout:hover{color:#fff;background:#ef4444;border-color:#ef4444;box-shadow:0 4px 12px #ef444433}.main{padding:30px;overflow-y:auto}.top{border-radius:var(--radius-md);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);box-shadow:var(--shadow-sm);background:#0b0f1980;border:1px solid #ffffff0a;justify-content:space-between;align-items:center;margin-bottom:25px;padding:24px 30px;display:flex}.top h1{color:#fff;letter-spacing:-.02em;font-size:28px;font-weight:800}.top .sub{color:var(--text-muted);margin-top:2px;font-size:14px}.rolePill{color:var(--primary);text-transform:uppercase;letter-spacing:.03em;background:#6366f114;border:1px solid #6366f126;border-radius:20px;align-items:center;gap:8px;padding:8px 16px;font-size:12px;font-weight:700;display:flex}.stats{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:25px;display:grid}.stat{border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);background:#0b0f1966;border:1px solid #ffffff0a;padding:20px;transition:all .3s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden}.stat:before{content:"";background:var(--primary);width:3px;height:100%;position:absolute;top:0;left:0}.stat:hover{box-shadow:var(--shadow-md), var(--shadow-glow);background:#0b0f1999;border-color:#ffffff14;transform:translateY(-3px)}.stat svg{color:var(--primary)}.stat p{color:var(--text-muted);margin:12px 0 2px;font-size:13px}.stat h3{color:#fff;margin:0;font-size:24px;font-weight:800}.panel{border-radius:var(--radius-md);box-shadow:var(--shadow-sm);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#0b0f1966;border:1px solid #ffffff0a;margin-bottom:25px;padding:24px}.panel h2{color:#fff;border-left:3px solid var(--primary);margin-top:0;margin-bottom:20px;padding-left:12px;font-size:20px;font-weight:800;line-height:1.1}.formGrid{grid-template-columns:1fr 1fr;gap:15px;display:grid}.formGrid textarea{grid-column:1/-1}.twoCol{grid-template-columns:1fr 1fr;gap:20px;display:grid}.cardsGrid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;display:grid}.dataCard{border-radius:var(--radius-sm);background:#ffffff03;border:1px solid #ffffff0a;padding:16px;transition:all .25s}.dataCard:hover{background:#ffffff05;border-color:#ffffff14;transform:translateY(-2px)}.dataCard h3{color:#fff;margin:0 0 6px;font-size:16px;font-weight:700}.dataCard p{color:var(--text-main);margin:0 0 10px;font-size:13px;line-height:1.5}.dataCard h2{color:var(--primary);margin:10px 0;font-size:28px;font-weight:800}.dataCard.danger{background:#ef444405;border-color:#ef444414}.dataCard.danger h3{color:#ef4444}.line{border-radius:var(--radius-sm);background:#ffffff03;border:1px solid #ffffff08;flex-direction:column;gap:2px;margin-top:8px;padding:10px 12px;display:flex}.line b{color:var(--primary);font-size:12px}.line span{color:var(--text-title);font-size:13px;font-weight:600}table{border-collapse:separate;border-spacing:0;border-radius:var(--radius-sm);background:#ffffff03;border:1px solid #ffffff0a;width:100%;overflow:hidden}th{color:var(--text-title);text-align:left;text-transform:uppercase;letter-spacing:.04em;background:#ffffff05;border-bottom:1px solid #ffffff0a;padding:12px 16px;font-size:12px;font-weight:700}td{color:var(--text-main);border-bottom:1px solid #ffffff08;padding:11px 16px;font-size:13px}tr:last-child td{border-bottom:0}tr:hover td{background:#ffffff05}.tag{color:var(--primary);text-transform:uppercase;letter-spacing:.02em;background:#6366f114;border-radius:4px;padding:3px 8px;font-size:10px;font-weight:700}.chat{flex-direction:column;gap:12px;max-height:400px;padding-right:5px;display:flex;overflow-y:auto}.bubble{border-radius:var(--radius-sm);background:#ffffff05;border:1px solid #ffffff0a;align-self:flex-start;max-width:80%;padding:12px 15px}.bubble b{color:var(--text-title);margin-bottom:4px;font-size:12px;display:block}.bubble p{color:var(--text-main);margin:0;font-size:13px;line-height:1.4}.bubble small{color:var(--primary);text-transform:uppercase;letter-spacing:.04em;margin-top:6px;font-size:9px;font-weight:700;display:block}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-2px)}40%,60%{transform:translate(2px)}}@media (width<=1000px){.authPage{grid-template-columns:1fr;gap:30px;padding:20px}.authHero{text-align:center;padding-left:0}.authHero h1{font-size:48px}.authHero p{margin:0 auto 30px}.heroGrid{margin:0 auto}.shell{grid-template-columns:1fr}.sidebar{border-bottom:1px solid #ffffff0a;border-right:0;height:auto;padding:16px;position:relative}.main{padding:20px}}@media (width<=768px){.twoCol,.formGrid,.heroGrid{grid-template-columns:1fr}.top{flex-direction:column;align-items:flex-start;gap:15px;padding:18px 20px}.top h1{font-size:22px}}