:root{--accent:#ff6ec4;--text-light:#333;--text-dark:#f0f0f0;--shadow:0 4px 12px rgba(0,0,0,0.15)}body{font-family:"Poppins",sans-serif;margin:0;padding:0;transition:background 0.4s,color 0.4s}body.light-mode{background:linear-gradient(135deg,#fbc2eb,#a6c1ee,#d4fc79,#96e6a1);background-size:400% 400%;animation:gradientShift 15s ease infinite;color:var(--text-light)}body.dark-mode{background:#121212;color:var(--text-dark)}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}header{text-align:center;padding:40px 20px 20px;background:blue;color:white;box-shadow:var(--shadow);position:sticky;top:0;z-index:100}header h1{font-size:2.5rem;font-weight:600;color:inherit;text-shadow:1px 1px 3px rgba(0,0,0,0.2)}.header-actions{position:absolute;top:10px;right:20px;height:80px;display:flex;align-items:center;gap:12px}.profile-pic{width:80px;height:80px;border-radius:50%;object-fit:cover;box-shadow:0 0 8px rgba(0,0,0,0.2);transition:transform 0.3s}.profile-pic:hover{transform:scale(1.1)}.logout-btn{background:transparent;border:2px solid var(--accent);color:var(--accent);padding:6px 12px;border-radius:20px;font-size:0.9rem;cursor:pointer;transition:all 0.3s ease}.logout-btn:hover{background:var(--accent);color:white;box-shadow:0 0 10px var(--accent)}.toggle-btn{position:absolute;top:20px;left:20px;background:var(--accent);border:none;color:white;padding:10px 16px;border-radius:30px;cursor:pointer;font-size:0.9rem;transition:background 0.3s}.toggle-btn:hover{background:#ff3fa4}.classes-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:25px;padding:20px;max-width:1100px;margin:auto}.class-card{background:rgba(255,255,255,0.7);backdrop-filter:blur(12px);border-radius:20px;padding:25px;text-align:center;box-shadow:0 12px 30px rgba(0,0,0,0.1);transition:transform 0.4s,box-shadow 0.4s;cursor:pointer}body.dark-mode .class-card{background:rgba(40,40,40,0.6)}.class-card:hover{transform:translateY(-10px);box-shadow:0 16px 40px rgba(0,0,0,0.2)}.class-icon{font-size:40px;margin-bottom:15px}.class-title{font-size:1.4rem;font-weight:600;margin-bottom:10px}.class-info{font-size:0.95rem;color:inherit}.join-section{text-align:center;margin:50px auto}.join-section a{background:var(--accent);color:white;padding:12px 24px;font-size:1.1rem;border-radius:30px;text-decoration:none;box-shadow:0 8px 20px rgba(0,0,0,0.2);transition:background 0.3s}.join-section a:hover{background:#ff3fa4}footer{background:rgba(0,0,0,0.1);color:#fff;text-align:center;padding:30px 20px;margin-top:60px;font-size:0.9rem}footer a{color:#fff;text-decoration:underline;margin:0 8px}#fireworks{position:fixed;top:0;left:0;pointer-events:none;width:100%;height:100%;z-index:999}