*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;overflow:hidden;background:#060a12}body{font-family:"Exo 2",sans-serif;color:#d0dce8}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#0e1420}::-webkit-scrollbar-thumb{background:#2a3a5c;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#3a5a8c}.app{display:flex;height:100vh;flex-direction:column}.topbar{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:linear-gradient(180deg,#0d1528,#0b1022);border-bottom:1px solid #1a2744;flex-shrink:0;z-index:10}.topbar-title{font-family:Orbitron,sans-serif;font-size:28px;font-weight:800;background:linear-gradient(135deg,#ff6b35,#ffc045);-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:1.5px}.topbar-quest{font-size:18px;color:#7a9aba;font-family:JetBrains Mono,monospace;font-weight:500}.quest-dots{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}.quest-dot{width:32px;height:32px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;cursor:pointer;transition:all .2s ease;border:1.5px solid #1a2744;background:#0e1420;color:#4a6a8a}.quest-dot:hover:not(.locked){background:#162040;border-color:#2a4a6a;transform:translateY(-1px)}.quest-dot.active{background:linear-gradient(135deg,#ff6b35,#e8522a);color:#fff;border-color:#ff6b35;box-shadow:0 2px 10px #ff6b354d}.quest-dot.done{background:#2ecc7126;color:#2ecc71;border-color:#2ecc7166}.quest-dot.locked{opacity:.35;cursor:not-allowed}.main{flex:1;display:flex;min-height:0}.arena-col{flex:1;display:flex;flex-direction:column;min-width:0}.quest-bar{padding:14px 24px;background:linear-gradient(180deg,#0c1224,#0b1022);border-bottom:1px solid #1a2744;flex-shrink:0}.quest-title{font-family:Orbitron,sans-serif;font-size:20px;font-weight:700;color:#ff6b35;margin-bottom:5px;letter-spacing:.5px}.quest-desc{font-size:16px;color:#7a9aba;line-height:1.6}.canvas-wrap{flex:1;position:relative;overflow:hidden}.instructions-overlay{position:absolute;top:12px;left:12px;right:12px;z-index:5;pointer-events:none;display:flex;gap:8px;flex-wrap:wrap}.instruction-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:6px;background:#000000b3;border:1px solid rgba(255,255,255,.1);font-family:JetBrains Mono,monospace;font-size:13px;color:#c8d6e5;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.instruction-badge .key{display:inline-block;padding:2px 7px;border-radius:4px;background:#ffffff1f;border:1px solid rgba(255,255,255,.2);font-weight:700;font-size:12px;color:#ffc107;min-width:24px;text-align:center}.instruction-badge .method{color:#81c784;font-weight:600}.console-wrap{flex-shrink:0;padding:0 14px 12px;background:#060a12}.console-label{font-size:12px;color:#3a5a7a;padding:6px 0 5px;font-family:JetBrains Mono,monospace;letter-spacing:1.5px;text-transform:uppercase;font-weight:600}.console-box{height:100px;overflow-y:auto;padding:10px 14px;background:#0a0f1a;border-radius:8px;border:1px solid #152030;font-size:14px;font-family:JetBrains Mono,monospace;line-height:1.7}.console-line{margin-bottom:2px;animation:fadeSlide .2s ease}.console-line .prompt{color:#3a5a7a;margin-right:6px;font-weight:600}.editor-col{width:460px;min-width:400px;max-width:540px;display:flex;flex-direction:column;border-left:1px solid #1a2744;background:#0c1018;flex-shrink:0}.editor-head{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:#0e1420;border-bottom:1px solid #1a2744;flex-shrink:0}.editor-dots{display:flex;gap:6px}.editor-dots span{width:13px;height:13px;border-radius:50%}.editor-filename{font-size:16px;color:#6a8aaa;font-family:JetBrains Mono,monospace;margin-left:12px;font-weight:500}.editor-actions{display:flex;gap:10px}.btn-hint,.btn-run{padding:7px 18px;font-size:15px;border-radius:6px;cursor:pointer;font-family:JetBrains Mono,monospace;border:1px solid;transition:all .2s;font-weight:600}.btn-hint{background:transparent;color:#ffc045;border-color:#4a3a10}.btn-hint:hover{background:#1a1508;border-color:#6a5a20}.btn-run{background:linear-gradient(135deg,#2ecc71,#1ea85a);color:#fff;border-color:transparent;letter-spacing:.5px;box-shadow:0 2px 8px #2ecc7133}.btn-run:hover{filter:brightness(1.15);box-shadow:0 3px 12px #2ecc714d}.hint-panel{padding:12px 16px;background:#14100a;border-bottom:1px solid #2a2010;flex-shrink:0;font-size:15px;font-family:JetBrains Mono,monospace;color:#9a8a60;white-space:pre-wrap;line-height:1.7}.hint-panel .hint-tier{color:#ffc045;font-weight:700;margin-bottom:5px;font-size:13px;letter-spacing:.8px;text-transform:uppercase}.hint-panel button{display:inline-block;margin-top:10px;padding:5px 16px;font-size:13px;background:#ffc0451f;color:#ffc045;border:1px solid #4a3a10;border-radius:5px;cursor:pointer;font-family:JetBrains Mono,monospace;font-weight:600;transition:all .2s}.hint-panel button:hover{background:#ffc04533;border-color:#6a5a20}.editor-body{flex:1;position:relative;min-height:0;overflow:auto}.editor-body .cm-editor{height:100%;font-size:15px!important}.editor-body .cm-scroller{overflow:auto!important}.editor-body .cm-content{font-size:15px!important;line-height:1.7!important}.editor-body .cm-gutters{font-size:14px!important}.editor-body .cm-line{font-size:15px!important}.result-bar{padding:12px 16px;flex-shrink:0;border-top:1px solid #1a2744;min-height:50px}.result-msg{font-size:16px;font-family:JetBrains Mono,monospace;display:flex;align-items:center;gap:10px;font-weight:500}.result-msg.pass{color:#2ecc71}.result-msg.fail{color:#e74c3c}.result-msg.idle{color:#4a6a8a}.btn-next{margin-top:10px;padding:10px 28px;font-size:16px;font-family:Orbitron,sans-serif;font-weight:700;background:linear-gradient(135deg,#ff6b35,#e8522a);color:#fff;border:none;border-radius:7px;cursor:pointer;letter-spacing:1px;box-shadow:0 3px 14px #ff6b3559;transition:all .2s}.btn-next:hover{transform:translateY(-1px);box-shadow:0 4px 18px #ff6b3573}.locked-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#060a12f0;z-index:5;font-family:Orbitron,sans-serif}.locked-overlay .lock-icon{font-size:80px;margin-bottom:20px;filter:drop-shadow(0 4px 12px rgba(0,0,0,.5))}.locked-overlay .lock-text{font-size:20px;color:#6a8aaa;text-align:center;line-height:1.7}.splash{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:100;pointer-events:auto}.splash-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000059;pointer-events:none}.splash-content{position:relative;z-index:1;text-align:center}.splash-title{font-family:Orbitron,sans-serif;font-size:80px;font-weight:900;background:linear-gradient(135deg,#ff6b35,#ffc045,#2ecc71,#3498db);-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:5px;margin-bottom:10px;filter:drop-shadow(0 4px 20px rgba(255,107,53,.3))}.splash-sub{font-size:22px;color:#8aaacc;letter-spacing:7px;text-transform:uppercase;margin-bottom:44px;font-weight:500}.btn-start{padding:18px 58px;font-size:22px;font-family:Orbitron,sans-serif;font-weight:700;background:linear-gradient(135deg,#ff6b35,#e8522a);color:#fff;border:none;border-radius:10px;cursor:pointer;letter-spacing:3px;text-transform:uppercase;box-shadow:0 4px 28px #ff6b3566;transition:all .2s}.btn-start:hover{transform:scale(1.05);box-shadow:0 6px 32px #ff6b3580}.splash-footer{margin-top:32px;font-size:15px;color:#6a8aaa;line-height:1.8}.syntax-ref-toggle{padding:5px 14px;font-size:13px;border-radius:6px;cursor:pointer;font-family:JetBrains Mono,monospace;font-weight:600;background:transparent;color:#42a5f5;border:1px solid #1a3a5a;transition:all .2s}.syntax-ref-toggle:hover{background:#0a1a2a;border-color:#2a5a8a}.syntax-ref-panel{position:absolute;top:0;right:0;bottom:0;width:100%;z-index:10;background:#0a0f18;display:flex;flex-direction:column}.syntax-ref-header{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-bottom:1px solid #1a2744;flex-shrink:0;font-family:JetBrains Mono,monospace;font-size:13px}.syntax-ref-close{background:none;border:none;color:#5a7a9a;font-size:18px;cursor:pointer;padding:2px 6px}.syntax-ref-close:hover{color:#f44336}.syntax-ref-tabs{display:flex;flex-wrap:wrap;gap:4px;padding:8px 12px;border-bottom:1px solid #1a2744;flex-shrink:0}.syntax-ref-tab{padding:4px 10px;font-size:12px;border-radius:4px;cursor:pointer;font-family:JetBrains Mono,monospace;font-weight:500;background:#0e1420;color:#5a7a9a;border:1px solid #1a2744;transition:all .2s}.syntax-ref-tab:hover{background:#162040;border-color:#2a4a6a;color:#8aaacc}.syntax-ref-tab.active{background:#1a3a5a;color:#42a5f5;border-color:#42a5f5}.syntax-ref-code{flex:1;overflow:auto;padding:16px;font-family:JetBrains Mono,monospace;font-size:14px;color:#81c784;line-height:1.8;white-space:pre-wrap}.syntax-ref-code pre{margin:0;font-family:inherit;font-size:inherit;color:inherit}.copyright{text-align:center;font-size:11px;color:#3a4a5a;font-family:JetBrains Mono,monospace;padding:4px 0;background:#060a12;border-top:1px solid #0e1420;flex-shrink:0;letter-spacing:.3px}@keyframes fadeSlide{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.classroom-entry{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#060a12;z-index:100}.classroom-entry-card{background:#0e1420;border-radius:16px;padding:48px 44px;border:1px solid #1a2744;max-width:440px;width:100%;text-align:center;box-shadow:0 8px 40px #00000080}.classroom-entry-icon{font-size:56px;margin-bottom:16px}.classroom-entry-title{font-family:Orbitron,sans-serif;font-size:28px;font-weight:800;background:linear-gradient(135deg,#ff6b35,#ffc045);-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:2px;margin-bottom:8px}.classroom-entry-sub{font-size:15px;color:#5a7a9a;margin-bottom:28px;font-family:JetBrains Mono,monospace}.classroom-input{width:100%;padding:14px 18px;font-size:18px;border-radius:8px;background:#0a0f1a;border:1.5px solid #1a2744;color:#d0dce8;font-family:JetBrains Mono,monospace;font-weight:600;text-align:center;letter-spacing:2px;outline:none;transition:border-color .2s}.classroom-input:focus{border-color:#ff6b35}.classroom-input::placeholder{color:#2a4a6a;font-weight:400;letter-spacing:0}.classroom-error{color:#f44336;font-size:13px;margin-top:10px;font-family:JetBrains Mono,monospace}.classroom-label{display:block;font-size:12px;color:#5a7a9a;font-weight:600;font-family:JetBrains Mono,monospace;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;text-align:left}.classroom-btn{padding:12px 28px;font-size:16px;border-radius:8px;cursor:pointer;font-family:JetBrains Mono,monospace;font-weight:700;border:none;transition:all .2s}.classroom-btn.primary{background:linear-gradient(135deg,#ff6b35,#e8522a);color:#fff;box-shadow:0 2px 12px #ff6b354d}.classroom-btn.primary:hover{transform:translateY(-1px);box-shadow:0 4px 18px #ff6b3566}.classroom-btn.primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.classroom-btn.secondary{background:#1a2744;color:#7a9aba;border:1px solid #2a3a5c}.classroom-btn.secondary:hover{background:#1e2f50;border-color:#3a5a7a}.btn-classroom{display:block;margin:20px auto 0;padding:12px 32px;font-size:16px;font-family:JetBrains Mono,monospace;font-weight:600;background:transparent;color:#7a9aba;border:1.5px solid #2a3a5c;border-radius:8px;cursor:pointer;transition:all .2s;letter-spacing:1px}.btn-classroom:hover{background:#ff6b3514;color:#ff6b35;border-color:#ff6b35;box-shadow:0 2px 16px #ff6b3526}.team-select-card{background:#0e1420;border-radius:16px;padding:36px;border:1px solid #1a2744;max-width:520px;width:100%;box-shadow:0 8px 40px #00000080;max-height:85vh;overflow-y:auto}.classroom-tab{flex:1;padding:10px;font-size:14px;border-radius:6px;cursor:pointer;font-family:JetBrains Mono,monospace;font-weight:600;background:#0a0f1a;color:#4a6a8a;border:1px solid #1a2744;text-align:center;transition:all .2s}.classroom-tab:hover{background:#162040;border-color:#2a4a6a;color:#8aaacc}.classroom-tab.active{background:linear-gradient(135deg,#ff6b3526,#ff6b3514);color:#ff6b35;border-color:#ff6b35}.team-list{display:flex;flex-direction:column;gap:8px;max-height:300px;overflow-y:auto}.team-card{padding:14px 16px;background:#0a0f1a;border:1px solid #1a2744;border-radius:8px;cursor:pointer;transition:all .2s}.team-card:hover{border-color:#ff6b35;background:#0c1224;transform:translate(4px)}.team-card-name{font-weight:700;color:#d0dce8;font-size:15px}.team-card-count{font-size:12px;color:#5a7a9a;font-family:JetBrains Mono,monospace}.team-card-members{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px}.member-chip{padding:3px 10px;background:#ff6b351a;color:#ffc045;border-radius:4px;font-size:12px;font-family:JetBrains Mono,monospace;font-weight:500}.classroom-nav{display:flex;align-items:center;gap:8px}.player-badge,.team-badge{display:flex;align-items:center;gap:5px;padding:4px 12px;border-radius:5px;font-size:13px;font-family:JetBrains Mono,monospace;font-weight:600}.player-badge{background:#42a5f51a;color:#42a5f5;border:1px solid rgba(66,165,245,.25)}.team-badge{background:#ff6b351a;color:#ff6b35;border:1px solid rgba(255,107,53,.25)}.badge-icon{font-size:14px}.nav-icon-btn{padding:4px 8px;font-size:18px;background:none;border:none;cursor:pointer;border-radius:5px;transition:background .2s}.nav-icon-btn:hover{background:#ffffff0f}.classroom-dropdown{position:absolute;top:100%;right:0;margin-top:4px;min-width:160px;background:#0e1420;border:1px solid #1a2744;border-radius:8px;box-shadow:0 4px 20px #00000080;z-index:100;overflow:hidden}.dropdown-item{display:block;width:100%;padding:10px 16px;font-size:14px;font-family:JetBrains Mono,monospace;font-weight:500;background:none;border:none;color:#d0dce8;cursor:pointer;text-align:left;transition:background .2s}.dropdown-item:hover{background:#ffffff0a}.submit-btn{margin-top:10px;padding:10px 24px;font-size:15px;font-weight:700;border-radius:7px;cursor:pointer;transition:all .2s;font-family:JetBrains Mono,monospace;border:none;background:linear-gradient(135deg,#42a5f5,#1976d2);color:#fff;box-shadow:0 2px 10px #42a5f540}.submit-btn:hover{transform:translateY(-1px);box-shadow:0 4px 16px #42a5f559}.submit-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.submit-btn.submitted{background:none;color:#2ecc71;font-size:14px;cursor:default;box-shadow:none;padding:8px 0;font-weight:600}.leaderboard-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#060a12;z-index:100;display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;padding:30px 20px}.leaderboard-container{max-width:700px;width:100%}.leaderboard-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.leaderboard-title{font-family:Orbitron,sans-serif;font-size:28px;font-weight:800;background:linear-gradient(135deg,gold,#ffc107);-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:2px}.leaderboard-error{text-align:center;padding:60px 20px;color:#5a7a9a;font-size:16px;font-family:JetBrains Mono,monospace}.podium{display:flex;justify-content:center;align-items:flex-end;gap:16px;margin-bottom:32px;padding:20px 0}.podium-slot{display:flex;flex-direction:column;align-items:center;width:140px}.podium-slot.podium-0{order:1}.podium-slot.podium-1{order:0}.podium-slot.podium-2{order:2}.podium-medal{font-size:36px;margin-bottom:8px}.podium-name{font-weight:700;font-size:15px;color:#d0dce8;margin-bottom:4px;text-align:center;word-break:break-word}.podium-xp{font-size:13px;color:#ffc045;font-family:JetBrains Mono,monospace;font-weight:600;margin-bottom:8px}.podium-bar{width:80px;border-radius:6px 6px 0 0;animation:barGrow .6s ease-out both}.podium-stats{font-size:11px;color:#5a7a9a;margin-top:8px;font-family:JetBrains Mono,monospace}@keyframes barGrow{0%{height:0!important;opacity:0}to{opacity:1}}.leaderboard-list{display:flex;flex-direction:column;gap:2px;background:#0e1420;border-radius:10px;border:1px solid #1a2744;overflow:hidden}.leaderboard-row{display:flex;align-items:center;gap:12px;padding:12px 16px;cursor:pointer;transition:background .15s}.leaderboard-row:hover{background:#ffffff05}.leaderboard-row.expanded{background:#ff6b350a}.lb-rank{width:36px;text-align:center;font-weight:700;font-family:JetBrains Mono,monospace;font-size:14px;color:#4a6a8a}.lb-name{flex:1;font-weight:600;font-size:15px;color:#d0dce8}.lb-bar-wrap{width:100px;height:6px;background:#1a2744;border-radius:3px;overflow:hidden}.lb-bar-fill{height:100%;border-radius:3px;background:linear-gradient(90deg,#ff6b35,#ffc045);transition:width .4s ease}.lb-xp{width:80px;text-align:right;font-size:14px;color:#ffc045;font-family:JetBrains Mono,monospace;font-weight:600}.lb-meta{width:90px;font-size:11px;color:#4a6a8a;font-family:JetBrains Mono,monospace}.lb-expand{font-size:10px;color:#3a5a7a;width:16px;text-align:center}.lb-members{background:#0a0f1a;border-top:1px solid #152030}.lb-member-row{display:flex;align-items:center;gap:12px;padding:8px 16px 8px 52px;font-size:13px;font-family:JetBrains Mono,monospace}.lb-member-name{flex:1;color:#7a9aba}.lb-member-xp{color:#ffc045;font-weight:600}.lb-member-stars{color:#5a7a9a;font-size:12px}.instructor-page{min-height:100vh;background:#060a12;display:flex;align-items:flex-start;justify-content:center;padding:60px 20px}.instructor-container{max-width:540px;width:100%;text-align:center}.instructor-section{background:#0e1420;border-radius:12px;padding:24px;border:1px solid #1a2744;text-align:left}.instructor-session-card{display:flex;align-items:center;gap:12px;padding:14px 16px;background:#0a0f1a;border:1px solid #1a2744;border-radius:8px;margin-bottom:8px}.session-code-display{display:inline-block;padding:4px 14px;background:#ff6b351a;color:#ff6b35;border-radius:5px;font-family:Orbitron,sans-serif;font-weight:700;font-size:18px;letter-spacing:3px;cursor:pointer;transition:background .2s}.session-code-display:hover{background:#ff6b352e}