a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#1a1f35,#2d325a);min-height:100vh;color:#e0e0e0;position:relative;overflow-x:hidden}body:before{content:"";position:fixed;top:0;left:0;width:100vw;height:100vh;background:linear-gradient(90deg,rgba(120,219,255,.07) 1px,transparent 1px),linear-gradient(180deg,rgba(120,219,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,119,198,.04) 1px,transparent 1px),linear-gradient(180deg,rgba(255,119,198,.04) 1px,transparent 1px);background-size:40px 40px,40px 40px,80px 80px,80px 80px;background-position:0 0,0 0,0 0,0 0;pointer-events:none;z-index:-1}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.bg-grid{position:fixed;inset:auto 0% 0%;overflow:hidden;width:100%;height:70vh;-webkit-perspective:56.25vh;perspective:56.25vh;z-index:-2}.bg-grid-mask{position:fixed;inset:0%;background-color:transparent;background-image:linear-gradient(180deg,#000000 25%,transparent),radial-gradient(circle farthest-corner at 50% 0%,transparent 60%,#000000 95%);z-index:-1}.bg-grid-lines{position:absolute;inset:0%;z-index:0;width:100%;height:200%;background-image:linear-gradient(to right,rgba(255,255,255,.4) 1px,transparent 0),linear-gradient(to bottom,rgba(255,255,255,.4) 1px,transparent 0);background-size:4vh 3vh;background-repeat:repeat;transform-origin:100% 0 0;animation:play 30s linear infinite}.bg-grid-lines.stop{animation:none;transform:rotateX(45deg) translateY(-50%)}@keyframes play{0%{transform:rotateX(45deg) translateY(-50%)}to{transform:rotateX(45deg) translateY(0)}}.header{text-align:center;background:#121223f2;border:1px solid rgba(120,219,255,.3);border-radius:20px;padding:30px;margin-bottom:30px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);box-shadow:inset 0 1px 1px #78dbff33;position:relative;overflow:hidden}.header:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(120,219,255,.1) 0%,transparent 50%);border-radius:20px;pointer-events:none}.header h1{color:#78dbff;font-size:2.8em;margin-bottom:10px;text-shadow:0 0 20px rgba(120,219,255,.5);font-weight:700}.header p{color:#b0b0b0;text-shadow:0 0 10px rgba(255,255,255,.3);font-size:1.2em;margin-bottom:15px}.fun-fact{background:linear-gradient(45deg,#ff77c633,#78dbff33);border:1px solid rgba(255,119,198,.3);border-radius:15px;padding:12px 20px;margin:15px auto;max-width:600px;font-size:1.1em;color:#fff;transition:all .3s ease;transform:translateY(0)}.fun-fact.visible{opacity:1;transform:translateY(0)}.fun-fact.hidden{opacity:0;transform:translateY(-10px)}.header-animation{position:absolute;inset:0;pointer-events:none;overflow:hidden}.cute-robot{position:relative;top:25px;right:250px;animation:float 3s ease-in-out infinite;filter:drop-shadow(0 0 10px rgba(120,219,255,.4));transition:all .3s ease}.cute-robot:hover{filter:drop-shadow(0 0 20px rgba(120,219,255,.8));transform:scale(1.1)}.robot-head{width:50px;height:45px;background:linear-gradient(145deg,#78dbff,#4facfe);border-radius:20px 20px 15px 15px;position:relative;margin:0 auto 5px;box-shadow:0 4px 15px #78dbff4d;border:2px solid rgba(255,255,255,.4)}.robot-eyes{display:flex;justify-content:space-between;padding:8px 10px 0}.eye{width:10px;height:10px;background:#0f0f23;border-radius:50%;animation:blink 4s ease-in-out infinite;position:relative}.eye:after{content:"";position:absolute;top:2px;left:2px;width:3px;height:3px;background:#fffc;border-radius:50%}.left-eye{animation-delay:0s}.right-eye{animation-delay:.1s}.robot-mouth{width:14px;height:7px;background:#0f0f23;border-radius:0 0 14px 14px;position:absolute;bottom:6px;left:50%;transform:translate(-50%);animation:smile 4s ease-in-out infinite}.robot-antenna{position:absolute;top:-8px;left:50%;transform:translate(-50%);width:2px;height:8px;background:#78dbff;border-radius:1px}.antenna-ball{width:6px;height:6px;background:#ff6b35;border-radius:50%;position:absolute;top:-3px;left:-2px;animation:pulse 2s ease-in-out infinite}.robot-body{width:40px;height:35px;background:linear-gradient(145deg,#78dbff,#4facfe);border-radius:8px;position:relative;margin:0 auto;box-shadow:0 4px 15px #78dbff4d;border:2px solid rgba(255,255,255,.3)}.robot-chest{width:8px;height:8px;background:#ff6b35;border-radius:50%;position:absolute;top:8px;left:50%;transform:translate(-50%);animation:heartbeat 2s ease-in-out infinite}.robot-arms{position:absolute;top:5px;width:100%}.arm{width:6px;height:20px;background:linear-gradient(145deg,#78dbff,#4facfe);border-radius:3px;position:absolute;border:1px solid rgba(255,255,255,.3)}.left-arm{left:-8px;animation:wave-left 3s ease-in-out infinite}.right-arm{right:-8px;animation:wave-right 3s ease-in-out infinite}.sparkle{position:relative;top:-40px;left:220px;font-size:1.5em;animation:sparkle 2s linear infinite}.rocket{position:absolute;bottom:10px;right:40px;font-size:2em;animation:rocket 4s ease-in-out infinite}.gear{position:absolute;bottom:20px;left:40px;font-size:1.8em;animation:spin 3s linear infinite}.heart{position:relative;top:50px;left:80px;font-size:1.2em;animation:heartFloat 2.5s ease-in-out infinite;display:none}.star{position:absolute;bottom:50px;right:80px;font-size:1.3em;animation:twinkle 3s ease-in-out infinite}@keyframes glow{0%{text-shadow:0 0 20px rgba(120,219,255,.5)}to{text-shadow:0 0 30px rgba(120,219,255,.8),0 0 40px rgba(120,219,255,.3)}}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-15px) rotate(5deg)}}@keyframes sparkle{0%,to{opacity:1;transform:scale(1) rotate(0)}50%{opacity:.5;transform:scale(1.2) rotate(180deg)}}@keyframes rocket{0%,to{transform:translateY(0) rotate(-10deg)}25%{transform:translateY(-8px) rotate(-5deg)}75%{transform:translateY(-12px) rotate(-15deg)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes blink{0%,90%,to{transform:scaleY(1)}95%{transform:scaleY(.1)}}@keyframes smile{0%,50%,to{width:12px}25%,75%{width:16px}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.3);opacity:.7}}@keyframes heartbeat{0%,to{transform:translate(-50%) scale(1)}50%{transform:translate(-50%) scale(1.2)}}@keyframes wave-left{0%,to{transform:rotate(0)}25%{transform:rotate(-15deg)}75%{transform:rotate(10deg)}}@keyframes wave-right{0%,to{transform:rotate(0)}25%{transform:rotate(15deg)}75%{transform:rotate(-10deg)}}@keyframes heartFloat{0%,to{transform:translateY(0) scale(1);opacity:.8}50%{transform:translateY(-10px) scale(1.1);opacity:1}}@keyframes twinkle{0%,to{transform:scale(1) rotate(0);opacity:.7}50%{transform:scale(1.2) rotate(180deg);opacity:1}}.footer{text-align:center;background:linear-gradient(135deg,#1a1f35,#2d325a);padding:10px;color:#78dbff;box-shadow:0 -4px 10px #0000004d;position:fixed;bottom:0;width:100%}.welcome-overlay{position:fixed;inset:0;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .5s ease}.welcome-container{background:linear-gradient(135deg,#1a1f35,#2d325a);border:2px solid rgba(120,219,255,.3);border-radius:25px;padding:40px;max-width:600px;width:90%;text-align:center;position:relative;overflow:hidden;animation:slideIn .6s ease}.welcome-container:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(120,219,255,.1) 0%,transparent 50%);pointer-events:none}.welcome-progress{display:flex;justify-content:center;gap:10px;margin-bottom:30px}.progress-dot{width:12px;height:12px;border-radius:50%;background:#78dbff4d;transition:all .3s ease}.progress-dot.active{background:#78dbff;box-shadow:0 0 15px #78dbff80;transform:scale(1.2)}.welcome-animation{margin-bottom:25px;height:60px;display:flex;justify-content:center;align-items:center;gap:15px}.floating-emoji{font-size:3em;animation:float 2s ease-in-out infinite}.welcome-content h2{color:#78dbff;font-size:2.2em;margin-bottom:20px;text-shadow:0 0 20px rgba(120,219,255,.5);line-height:1.2}.welcome-content p{color:#e0e0e0;font-size:1.2em;line-height:1.6;margin-bottom:25px}.welcome-tip{background:#ffd7001a;border:1px solid rgba(255,215,0,.3);border-radius:15px;padding:15px 20px;margin-bottom:30px;color:gold;font-size:1em;line-height:1.4}.welcome-actions{display:flex;justify-content:space-between;gap:20px;margin-bottom:20px}.skip-btn{background:#78dbff33;color:#78dbff;border:1px solid rgba(120,219,255,.3);padding:12px 25px;border-radius:25px;cursor:pointer;font-weight:700;transition:all .3s ease;flex:1}.skip-btn:hover{background:#78dbff4d;transform:translateY(-2px)}.next-btn{background:linear-gradient(45deg,#78dbff,#4facfe);color:#0f0f23;border:none;padding:12px 25px;border-radius:25px;cursor:pointer;font-weight:700;transition:all .3s ease;flex:2;font-size:1.1em}.next-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #78dbff66}.welcome-footer{color:#b0b0b0;font-size:.9em}@keyframes float{0%,to{transform:translateY(0) rotate(0)}33%{transform:translateY(-10px) rotate(5deg)}66%{transform:translateY(-5px) rotate(-3deg)}}@media (max-width: 768px){.welcome-container{padding:25px;margin:20px}.welcome-content h2{font-size:1.8em}.welcome-content p{font-size:1em}.floating-emoji{font-size:2.5em}.welcome-actions{flex-direction:column}.skip-btn,.next-btn{flex:none}}.notification-container{position:fixed;top:20px;right:20px;z-index:1000;display:flex;flex-direction:column;gap:10px;max-width:400px}.notification{display:flex;align-items:center;padding:15px 20px;border-radius:15px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border:2px solid;animation:slideInRight .5s ease,pulse .5s ease .5s;position:relative;overflow:hidden}.notification:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:shimmer 2s ease-in-out}.notification-achievement{background:#ffd7001a;border-color:#ffd70080;color:gold}.notification-milestone{background:#78dbff1a;border-color:#78dbff80;color:#78dbff}.notification-challenge{background:#ff6b351a;border-color:#ff6b3580;color:#ff6b35}.notification-social{background:#bf5af21a;border-color:#bf5af280;color:#bf5af2}.notification-default{background:#78dbff1a;border-color:#78dbff4d;color:#78dbff}.notification-icon{font-size:2em;margin-right:15px;animation:bounce 1s ease infinite}.notification-content{flex:1}.notification-content h4{margin:0 0 5px;font-size:1.1em;font-weight:700}.notification-content p{margin:0;font-size:.9em;opacity:.9;line-height:1.3}.notification-close{background:none;border:none;color:inherit;font-size:1.2em;cursor:pointer;padding:5px;border-radius:50%;transition:all .3s ease;margin-left:10px}.notification-close:hover{background:#fff3;transform:rotate(90deg)}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-5px)}60%{transform:translateY(-3px)}}@keyframes shimmer{0%{left:-100%}to{left:100%}}@media (max-width: 768px){.notification-container{top:10px;right:10px;left:10px;max-width:none}.notification{padding:12px 15px}.notification-icon{font-size:1.5em;margin-right:10px}.notification-content h4{font-size:1em}.notification-content p{font-size:.8em}}.curriculum{padding-top:80px;padding-bottom:50px}.curriculum{padding:30px;margin-bottom:20px;color:#e0e0e0}.curriculum h2{color:#78dbff;text-shadow:0 0 10px rgba(120,219,255,.5);margin-bottom:20px}.week-card ul{margin-left:0;text-align:left;list-style-type:none}.week-card{opacity:0;animation:fadeIn .5s ease-in forwards;background:linear-gradient(135deg,#1a1f35,#2d325a)}.graffiti{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);font-size:2.5em;color:#ff77c6;text-shadow:0 0 10px #ff77c6,0 0 20px #ff77c6,0 0 30px #ff77c6;animation:graffitiFade 3s ease-in-out;z-index:1000}@keyframes graffitiFade{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}50%{opacity:.8;transform:translate(-50%,-50%) scale(1.2)}to{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}.curriculum-header{text-align:center;margin-bottom:40px;padding:30px;background:#121223f2;border:2px solid rgba(120,219,255,.3);border-radius:20px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}.curriculum-header h2{color:#78dbff;font-size:2.5em;margin-bottom:15px;text-shadow:0 0 20px rgba(120,219,255,.5)}.curriculum-header p{color:#b0b0b0;font-size:1.2em;margin-bottom:25px;line-height:1.5}.journey-stats{display:flex;justify-content:center;gap:40px;flex-wrap:wrap}.journey-stats .stat{text-align:center}.journey-stats .stat-number{display:block;font-size:2.5em;font-weight:700;color:#78dbff;margin-bottom:5px}.journey-stats .stat-label{color:#b0b0b0;font-size:.9em;text-transform:uppercase;letter-spacing:1px}.graffiti-content{display:flex;flex-direction:column;align-items:center;gap:15px;font-size:1.3em;font-weight:700}.week-card{position:relative;overflow:hidden}.week-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(120,219,255,.05) 0%,transparent 50%);pointer-events:none;opacity:0;transition:opacity .3s ease}.week-card:hover:before{opacity:1}.week-card:hover{transform:translateY(-5px);box-shadow:0 15px 35px #78dbff33}@media (max-width: 768px){.journey-stats{gap:20px}.curriculum-header h2{font-size:2em}.curriculum-header p{font-size:1em}}.games{padding:30px 20px 20px;margin-bottom:20px;color:#e0e0e0}.games h2{color:#78dbff;text-shadow:0 0 10px rgba(120,219,255,.5);margin-bottom:20px}.game-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin:20px 0}.game-card{background:linear-gradient(135deg,#1a1f35,#2d325a);border:1px solid rgba(120,219,255,.3);border-radius:15px;padding:20px;text-align:center;box-shadow:0 5px 15px #0000004d;transition:transform .3s ease,box-shadow .3s ease;transform:translateY(20px);animation:fadeIn .5s ease-in forwards}.game-card:hover{transform:translateY(-5px);box-shadow:0 10px 20px #78dbff66}.game-card h3{color:#78dbff;margin-bottom:10px}.game-card p{color:#e0e0e0;margin-bottom:15px}.game-card button{background:linear-gradient(45deg,#78dbff,#4facfe);color:#0f0f23;border:none;padding:10px 20px;border-radius:25px;cursor:pointer;font-weight:700;transition:all .3s ease}.game-card button:hover{transform:translateY(-2px);box-shadow:0 5px 15px #78dbff66}.game-details{background:linear-gradient(135deg,#1a1f35,#2d325a);border:1px solid rgba(120,219,255,.3);border-radius:15px;padding:20px;box-shadow:0 5px 15px #0000004d;color:#e0e0e0;margin-top:20px}.game-details h3{color:#78dbff;margin-bottom:10px}.game-details p{margin-bottom:15px}.game-details ul{list-style:none;padding:0}.game-details ul li{margin-bottom:10px}.game-details ul li{list-style:none;margin:10px 0}.game-details ul li button{width:100%;padding:10px;font-size:16px;cursor:pointer;border-radius:5px;transition:all .3s ease}.game-details ul li button:disabled{cursor:not-allowed;opacity:.6;color:#0f0f23}.game-details button{background:linear-gradient(45deg,#78dbff,#4facfe);color:#0f0f23;border:none;padding:10px 20px;border-radius:25px;cursor:pointer;font-weight:700;transition:all .3s ease}.game-details button:hover{transform:translateY(-2px);box-shadow:0 5px 15px #78dbff66}.highlight-correct{background-color:#d4edda;border:1px solid #c3e6cb;box-shadow:0 0 10px #28a745;color:#0f0f23}.highlight-incorrect{background-color:#f8d7da;border:1px solid #f5c6cb;box-shadow:0 0 10px #dc3545;color:#0f0f23}.quiz-progress{display:flex;justify-content:center;margin-bottom:20px}.progress-circle{width:40px;height:40px;border-radius:50%;background-color:#f0f0f0;border:2px solid #ccc;display:flex;align-items:center;justify-content:center;margin:0 5px;font-size:16px;font-weight:700;color:#333;transition:all .3s ease}.progress-circle.answered{background-color:#d4edda;border-color:#28a745;color:#28a745}.progress-circle.current{background-color:#fff3cd;border-color:#ffc107;color:#856404}.progress-circle.correct{background-color:#d4edda;border-color:#28a745;color:#28a745}.progress-circle.incorrect{background-color:#f8d7da;border-color:#dc3545;color:#dc3545}.progress{padding:30px;margin-bottom:20px;color:#e0e0e0}.progress h2{color:#78dbff;text-shadow:0 0 10px rgba(120,219,255,.5);margin-bottom:20px}.level-indicator{text-align:center;margin:20px 0;transform:translateY(20px);animation:fadeIn .5s ease-in forwards}.level-circle{display:inline-block;width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#16213e,#1a1a2e);border:2px solid rgba(120,219,255,.4);color:#78dbff;line-height:56px;font-size:1.5em;font-weight:700;margin:0 10px;position:relative;overflow:hidden;transition:all .3s ease}.level-circle.completed{background:linear-gradient(135deg,#78dbff,#4facfe);color:#0f0f23;border-color:#78dbff;box-shadow:0 0 30px #78dbff99}.progress-bar{background:#121223cc;border:1px solid rgba(120,219,255,.2);height:10px;border-radius:5px;margin:15px 0;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#78dbff,#4facfe,#00f2fe);border-radius:5px;transition:width .5s ease;box-shadow:0 0 10px #78dbff99}.progress-actions button{font-size:x-small}.achievements{padding:30px 30px 50px;margin-bottom:20px;color:#e0e0e0;position:relative;z-index:1}.achievements h2{color:#78dbff;text-shadow:0 0 10px rgba(120,219,255,.5);margin-bottom:20px}.achievement-badge{display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(45deg,#ff77c6,#78dbff);color:#0f0f23;padding:20px;border-radius:15px;margin:10px;font-weight:700;font-size:1.2em;width:120px;height:120px;box-shadow:0 5px 20px #ff77c666;border:1px solid rgba(255,255,255,.2);animation:glow 2s ease-in-out infinite alternate;transition:all .3s ease;text-align:center;transform:translateY(20px);animation:fadeIn .5s ease-in forwards;position:relative;overflow:visible}.achievement-badge span{display:block;margin-top:5px}.achievement-badge span:first-child{font-size:2em}.achievement-badge.disabled{background:#444;color:#888;box-shadow:none;animation:none;opacity:.5;cursor:not-allowed;transform:translateY(20px);animation:fadeIn .5s ease-in forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes glow{0%{box-shadow:0 5px 20px #ff77c666;text-shadow:0 0 5px rgba(15,15,35,.8)}to{box-shadow:0 5px 30px #ff77c6cc;text-shadow:0 0 10px rgba(15,15,35,1)}}.badge-share-icon{position:absolute;top:8px;right:8px;width:24px;height:24px;background:#ffffffe6;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8em;cursor:pointer;opacity:.3;transition:all .3s ease;z-index:10;box-shadow:0 2px 8px #0003}.badge-share-icon:hover{background:#fff;transform:scale(1.1);box-shadow:0 4px 12px #0000004d}.achievement-badge.earned:hover .badge-share-icon{opacity:1}.achievement-badge.earned{position:relative;overflow:visible;z-index:1}.achievement-badge.earned:after{content:"✨";position:absolute;top:-5px;right:-5px;font-size:1.2em;animation:sparkle 2s ease-in-out infinite;z-index:2}#badges-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;justify-content:center;margin-top:20px;overflow:visible}.achievement-badge.earned:hover{transform:translateY(-3px);box-shadow:0 8px 25px #ff77c699}@keyframes sparkle{0%,to{opacity:1;transform:scale(1) rotate(0)}50%{opacity:.7;transform:scale(1.2) rotate(180deg)}}.achievement-share-overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:3000;animation:fadeIn .3s ease}.close-share-overlay{position:absolute;top:20px;right:30px;background:#fff3;border:none;color:#fff;font-size:1.5em;cursor:pointer;padding:10px;border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;transition:all .3s ease;z-index:3001}.close-share-overlay:hover{background:#ffffff4d;transform:rotate(90deg)}.social-share{position:relative;display:inline-block}.share-trigger{background:linear-gradient(45deg,#ff7ac6,#bf5af2);color:#fff;border:none;padding:12px 24px;border-radius:25px;font-weight:700;cursor:pointer;font-size:1.1em;transition:all .3s ease;animation:pulse 2s infinite;display:flex;align-items:center;gap:8px}.share-icon{font-size:1.2em;display:inline-block;animation:sparkleIcon 2s ease-in-out infinite}@keyframes sparkleIcon{0%,to{transform:scale(1) rotate(0)}50%{transform:scale(1.1) rotate(10deg)}}.share-trigger:hover{transform:translateY(-2px);box-shadow:0 8px 25px #ff7ac666}@keyframes pulse{0%{box-shadow:0 0 #ff7ac6b3}70%{box-shadow:0 0 0 10px #ff7ac600}to{box-shadow:0 0 #ff7ac600}}.share-popup{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.share-content{background:linear-gradient(135deg,#1a1f35,#2d325a);border:2px solid rgba(120,219,255,.3);border-radius:20px;padding:30px;max-width:500px;width:90%;position:relative;animation:slideIn .3s ease}.share-content h3{color:#78dbff;text-align:center;margin-bottom:20px;font-size:1.5em}.share-preview{background:#78dbff1a;border:1px solid rgba(120,219,255,.3);border-radius:10px;padding:15px;margin-bottom:20px;color:#e0e0e0;font-style:italic;line-height:1.4}.share-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:20px}.share-btn{padding:12px 16px;border:none;border-radius:10px;font-weight:700;cursor:pointer;transition:all .3s ease;font-size:.9em}.share-btn:hover{transform:translateY(-2px)}.twitter{background:#1da1f2;color:#fff}.twitter:hover{box-shadow:0 5px 15px #1da1f266}.facebook{background:#4267b2;color:#fff}.facebook:hover{box-shadow:0 5px 15px #4267b266}.linkedin{background:#0077b5;color:#fff}.linkedin:hover{box-shadow:0 5px 15px #0077b566}.whatsapp{background:#25d366;color:#fff}.whatsapp:hover{box-shadow:0 5px 15px #25d36666}.copy{background:#6c757d;color:#fff}.copy:hover{box-shadow:0 5px 15px #6c757d66}.close-share{position:absolute;top:10px;right:15px;background:none;border:none;color:#78dbff;font-size:1.5em;cursor:pointer;padding:5px;border-radius:50%;transition:all .3s ease}.close-share:hover{background:#78dbff33;transform:rotate(90deg)}.resources{padding:30px;margin-bottom:20px;color:#e0e0e0}.resources h2{color:#78dbff;text-shadow:0 0 10px rgba(120,219,255,.5);margin-bottom:20px}.week-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin:20px 0}.week-card{border:1px solid rgba(120,219,255,.3);border-radius:15px;padding:20px;color:#e0e0e0;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.week-card h3{color:#78dbff;text-shadow:0 0 10px rgba(120,219,255,.5)}.week-card ul{margin-left:15px}.login-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;color:#fff;font-family:Segoe UI,Roboto,system-ui}.login-container h2{margin-bottom:20px;color:#78dbff}.login-container form{display:flex;flex-direction:column;gap:15px;width:300px}.login-container input{padding:10px;border:none;border-radius:5px;font-size:16px}.login-container button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:border-color .25s;width:300px}.login-container button:hover{border-color:#646cff}.login-container .error{color:#ff6b6b;font-size:14px;margin-top:10px}.link-button{background:none;border:none;color:#a8a8e3;text-decoration:underline;cursor:pointer;padding:0;font:inherit}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;overflow:auto}.modal-content{background:#070707;padding:1.5rem;border-radius:8px;max-width:900px;width:90%;box-shadow:0 2px 10px #0000004d;text-align:left}.close-button{margin-top:20px;display:block;margin-left:auto;margin-right:auto}.daily-challenges{max-width:800px;margin:0 auto;padding:20px}.challenge-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;flex-wrap:wrap;gap:20px}.challenge-header h2{color:#78dbff;font-size:2.2em;margin:0;text-shadow:0 0 20px rgba(120,219,255,.5)}.streak-counter{display:flex;align-items:center;background:linear-gradient(45deg,#ff6b35,#f7931e);padding:12px 20px;border-radius:25px;box-shadow:0 4px 15px #ff6b354d}.streak-fire{font-size:1.5em;margin-right:8px;animation:flicker 1.5s ease-in-out infinite alternate}.streak-number{font-size:1.8em;font-weight:700;color:#fff;margin-right:8px}.streak-label{color:#fff;font-weight:600;font-size:.9em}@keyframes flicker{0%{transform:scale(1) rotate(-2deg)}to{transform:scale(1.1) rotate(2deg)}}.celebration{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.celebration-content{background:linear-gradient(45deg,#ff6b35,#f7931e);color:#fff;padding:30px 50px;border-radius:20px;font-size:1.5em;font-weight:700;text-align:center;animation:bounce .6s ease;box-shadow:0 10px 30px #ff6b3580}.challenge-card{background:#121223f2;border:2px solid rgba(120,219,255,.3);border-radius:20px;padding:30px;margin-bottom:30px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);position:relative;overflow:hidden}.challenge-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(120,219,255,.05) 0%,transparent 50%);pointer-events:none}.challenge-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;flex-wrap:wrap;gap:10px}.challenge-title h3{color:#78dbff;font-size:1.6em;margin:0}.difficulty-badge{padding:6px 12px;border-radius:15px;color:#fff;font-weight:700;font-size:.8em;text-transform:uppercase}.challenge-description{color:#e0e0e0;font-size:1.1em;line-height:1.6;margin-bottom:20px}.challenge-details{display:flex;gap:30px;margin-bottom:25px;flex-wrap:wrap}.points{color:#fbbf24;font-weight:700;font-size:1.1em}.hint{color:#a78bfa;font-style:italic;flex:1;min-width:200px}.code-starter{background:#0000004d;border:1px solid rgba(120,219,255,.2);border-radius:10px;padding:20px;margin-bottom:25px}.code-starter h4{color:#78dbff;margin:0 0 15px;font-size:1.1em}.code-starter pre{margin:0;overflow-x:auto}.code-starter code{color:#a8e6cf;font-family:Courier New,monospace;font-size:.9em;line-height:1.4}.challenge-actions{text-align:center}.complete-challenge-btn{background:linear-gradient(45deg,#10b981,#059669);color:#fff;border:none;padding:15px 30px;border-radius:25px;font-size:1.1em;font-weight:700;cursor:pointer;transition:all .3s ease;animation:pulse 2s infinite}.complete-challenge-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #10b98166}.completed-status{display:flex;flex-direction:column;align-items:center;gap:15px;color:#10b981;font-weight:700;font-size:1.1em}.challenge-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;margin-top:30px}.stat{background:#121223cc;border:1px solid rgba(120,219,255,.3);border-radius:15px;padding:20px;text-align:center;transition:all .3s ease}.stat:hover{transform:translateY(-5px);box-shadow:0 10px 25px #78dbff33}.stat-number{display:block;font-size:2em;font-weight:700;color:#78dbff;margin-bottom:5px}.stat-label{color:#b0b0b0;font-size:.9em;text-transform:uppercase;letter-spacing:1px}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-20px)}60%{transform:translateY(-10px)}}@keyframes pulse{0%{box-shadow:0 0 #10b981b3}70%{box-shadow:0 0 0 10px #10b98100}to{box-shadow:0 0 #10b98100}}@media (max-width: 768px){.challenge-header{flex-direction:column;text-align:center}.challenge-details{flex-direction:column;gap:15px}.challenge-title{flex-direction:column;align-items:flex-start}}.community-showcase{max-width:1200px;margin:0 auto;padding:20px}.showcase-header{text-align:center;margin-bottom:40px}.showcase-header h2{color:#78dbff;font-size:2.5em;margin-bottom:10px;text-shadow:0 0 20px rgba(120,219,255,.5)}.showcase-header p{color:#b0b0b0;font-size:1.2em;margin-bottom:25px}.submit-project-btn{background:linear-gradient(45deg,#ff6b35,#f7931e);color:#fff;border:none;padding:15px 30px;border-radius:25px;font-size:1.1em;font-weight:700;cursor:pointer;transition:all .3s ease;animation:pulse 2s infinite}.submit-project-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #ff6b3566}.featured-section,.projects-section{margin-bottom:50px}.featured-section h3,.projects-section h3{color:#78dbff;font-size:1.8em;margin-bottom:25px;text-align:center}.featured-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:25px;margin-bottom:40px}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:20px}.project-card{background:#121223f2;border:2px solid rgba(120,219,255,.3);border-radius:15px;padding:25px;transition:all .3s ease;position:relative;overflow:hidden}.project-card:hover{transform:translateY(-5px);box-shadow:0 15px 35px #78dbff33;border-color:#78dbff80}.project-card.featured{border-color:#ffd70080;background:#19192df2}.project-card.featured:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,215,0,.1) 0%,transparent 50%);pointer-events:none}.project-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px;flex-wrap:wrap;gap:10px}.project-header h4{color:#78dbff;font-size:1.3em;margin:0;flex:1}.featured-badge{background:linear-gradient(45deg,gold,#ffed4e);color:#1a1a1a;padding:4px 12px;border-radius:12px;font-size:.8em;font-weight:700;animation:shimmer 2s ease-in-out infinite}@keyframes shimmer{0%,to{opacity:1}50%{opacity:.8}}@keyframes shimmerSlide{0%{left:-100%}to{left:100%}}.project-author{color:#a78bfa;font-style:italic;margin-bottom:15px;font-size:.9em}.project-description{color:#e0e0e0;line-height:1.5;margin-bottom:20px}.project-stats{display:flex;gap:15px;align-items:center;margin-bottom:15px;flex-wrap:wrap}.project-stats span{color:#b0b0b0;font-size:.9em}.difficulty-tag{padding:4px 10px;border-radius:10px;color:#fff;font-weight:700;font-size:.8em;text-transform:uppercase}.project-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.tag{background:#78dbff33;color:#78dbff;padding:4px 10px;border-radius:12px;font-size:.8em;border:1px solid rgba(120,219,255,.3)}.view-project-btn{background:linear-gradient(45deg,#16213e,#0f3460);color:#78dbff;border:1px solid rgba(120,219,255,.3);padding:10px 20px;border-radius:20px;cursor:pointer;font-weight:700;transition:all .3s ease;width:100%}.view-project-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #78dbff4d}.project-modal,.submission-modal{position:fixed;inset:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;animation:fadeIn .3s ease}.modal-content{background:linear-gradient(135deg,#1a1f35,#2d325a);border:2px solid rgba(120,219,255,.3);border-radius:20px;padding:30px;max-width:800px;width:100%;max-height:90vh;overflow-y:auto;position:relative;animation:slideIn .3s ease}.close-modal{position:absolute;top:15px;right:20px;background:none;border:none;color:#78dbff;font-size:1.5em;cursor:pointer;padding:5px;border-radius:50%;transition:all .3s ease}.close-modal:hover{background:#78dbff33;transform:rotate(90deg)}.modal-content h3{color:#78dbff;font-size:1.8em;margin-bottom:10px}.modal-author{color:#a78bfa;font-style:italic;margin-bottom:20px}.modal-video{margin-bottom:25px}.modal-video iframe{width:100%;height:300px;border-radius:10px}.coming-soon-video{width:100%;height:300px;background:linear-gradient(135deg,#78dbff1a,#ff77c61a);border:2px dashed rgba(120,219,255,.3);border-radius:10px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.coming-soon-video:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(120,219,255,.1),transparent);animation:shimmerSlide 3s ease-in-out infinite}.coming-soon-content{text-align:center;z-index:1}.coming-soon-icon{font-size:3em;margin-bottom:15px;animation:bounce 2s ease-in-out infinite}.coming-soon-content h3{color:#78dbff;font-size:1.5em;margin-bottom:10px}.coming-soon-content p{color:#b0b0b0;font-size:1em;margin:0}.modal-description{color:#e0e0e0;line-height:1.6;margin-bottom:25px;font-size:1.1em}.modal-code{background:#0000004d;border:1px solid rgba(120,219,255,.2);border-radius:10px;padding:20px;margin-bottom:25px}.modal-code h4{color:#78dbff;margin:0 0 15px}.modal-code pre{margin:0;overflow-x:auto}.modal-code code{color:#a8e6cf;font-family:Courier New,monospace;line-height:1.4}.modal-actions{text-align:center}.form-group{margin-bottom:20px}.form-group label{display:block;color:#78dbff;margin-bottom:8px;font-weight:700}.form-group input,.form-group textarea{width:100%;padding:12px;border:1px solid rgba(120,219,255,.3);border-radius:8px;background:#121223cc;color:#e0e0e0;font-size:1em;transition:all .3s ease}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#78dbff99;box-shadow:0 0 10px #78dbff33}.submit-btn{background:linear-gradient(45deg,#10b981,#059669);color:#fff;border:none;padding:15px 30px;border-radius:25px;font-size:1.1em;font-weight:700;cursor:pointer;transition:all .3s ease;width:100%}.submit-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #10b98166}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:translateY(-50px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes pulse{0%{box-shadow:0 0 #ff6b35b3}70%{box-shadow:0 0 0 10px #ff6b3500}to{box-shadow:0 0 #ff6b3500}}@media (max-width: 768px){.featured-grid,.projects-grid{grid-template-columns:1fr}.project-stats{flex-direction:column;align-items:flex-start;gap:8px}.modal-content{margin:10px;padding:20px}.modal-video iframe{height:200px}}#root{max-width:995px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.app{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:100vh;color:#e0e0e0}.app .logout-link,.app .login-link:link,.app .login-link:visited{color:#84578a;text-decoration:none;font-weight:700;font-size:.7em}.app-header{text-align:center;margin-bottom:20px}.app-nav{display:flex;justify-content:center;gap:10px;margin-bottom:20px;flex-wrap:wrap}.app-nav button{background:linear-gradient(45deg,#16213e,#0f3460);color:#78dbff;border:1px solid rgba(120,219,255,.3);padding:12px 25px;border-radius:25px;cursor:pointer;font-weight:700;transition:all .3s ease;position:relative;overflow:hidden}.app-nav button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(120,219,255,.2),transparent);transition:left .5s ease}.app-nav button:hover:before{left:100%}.app-nav button.active{background:linear-gradient(45deg,#78dbff,#4facfe);color:#0f0f23;transform:scale(1.05);animation:activeGlow 2s ease-in-out infinite alternate}.app-nav button:hover{transform:translateY(-2px);box-shadow:0 5px 20px #78dbff66;border-color:#78dbff99}@keyframes activeGlow{0%{box-shadow:0 0 20px #78dbff4d}to{box-shadow:0 0 30px #78dbff99}}.app-content{width:100%;max-width:1200px;flex:1;padding-bottom:50px}.welcome-message{font-size:1.5em;margin:20px;color:#78dbff}button{background:linear-gradient(45deg,#16213e,#0f3460);color:#78dbff;border:1px solid rgba(120,219,255,.3);padding:12px 25px;border-radius:25px;cursor:pointer;font-weight:700;transition:all .3s ease}button:hover{transform:translateY(-2px);box-shadow:0 5px 20px #78dbff66;border-color:#78dbff99}button:active{transform:translateY(0);box-shadow:none}button:disabled{background:#78dbff33;color:#78dbff80;cursor:not-allowed;box-shadow:none}.otto-image{position:fixed;bottom:10px;left:10px;width:150px;height:auto;z-index:1000;transition:all .3s ease;animation:ottoBounce 3s ease-in-out infinite;cursor:pointer}.otto-image:hover{transform:scale(1.1) rotate(5deg);filter:drop-shadow(0 0 20px rgba(120,219,255,.5))}@keyframes ottoBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.admin-page{padding:20px;font-family:Segoe UI,Roboto,system-ui;color:#78dbff}.admin-page h2{text-align:center;color:#ff77c6;margin-bottom:20px}.admin-page table{width:100%;border-collapse:collapse;margin:0 auto;background-color:#2d325a;color:#fff;box-shadow:0 4px 8px #0003}.admin-page th,.admin-page td{padding:10px;text-align:left;border:1px solid #78dbff}.admin-page th{background-color:#1a1f35;color:#78dbff;font-weight:700}.admin-page tr:nth-child(2n){background-color:#2d325a}.admin-page tr:nth-child(odd){background-color:#1a1f35}.admin-page tr:hover{background-color:#3a3f6b;cursor:pointer}.feedback{padding:20px;font-family:Segoe UI,Roboto,system-ui;color:#78dbff;border-radius:8px;max-width:600px;margin:20px auto;box-shadow:0 4px 8px #0003}.feedback h2{text-align:center;color:#ff77c6;margin-bottom:20px}.feedback form{display:flex;flex-direction:column}.feedback textarea{resize:none;height:100px;margin-bottom:10px;padding:10px;border:1px solid #78dbff;border-radius:4px;background-color:#2d325a;color:#fff;font-size:16px}.feedback button{padding:12px 20px;border:2px solid #78dbff;border-radius:25px;background:linear-gradient(135deg,#78dbff,#ff77c6);color:#1a1f35;font-size:16px;font-weight:700;cursor:pointer;transition:background .3s,transform .2s;box-shadow:0 4px 6px #0000001a}.feedback button:hover{background:linear-gradient(135deg,#ff77c6,#78dbff);transform:scale(1.05)}.feedback button:active{background:linear-gradient(135deg,#78dbff,#ff77c6);transform:scale(.95);box-shadow:0 2px 4px #0003}