html,body{background-color:#121214;width:100vw;height:100vh;margin:0;padding:0;overflow:hidden}#root{flex-direction:column;width:100vw;height:100vh;margin:0;padding:0;display:flex;overflow:hidden}:root{--bg-dark:#121214;--bg-surface:#18181b;--bg-sidebar:#1f1f23;--bg-card:#27272a;--border-color:#3f3f46;--accent-blue:#3b82f6;--accent-blue-hover:#2563eb;--accent-green:#10b981;--accent-green-hover:#059669;--accent-purple:#8b5cf6;--accent-purple-hover:#7c3aed;--accent-amber:#f59e0b;--accent-red:#ef4444;--text-main:#f4f4f5;--text-muted:#a1a1aa;--code-font:"Consolas", "Fira Code", "Courier New", monospace;--ui-font:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--ui-font);background-color:var(--bg-dark);color:var(--text-main);flex-direction:column;height:100vh;display:flex;overflow:hidden;-webkit-user-select:none!important;user-select:none!important}.monaco-editor,.monaco-editor *{-webkit-user-select:text!important;user-select:text!important}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:99999;background:#000000e0;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.login-card{background:var(--bg-sidebar);border:1px solid var(--border-color);border-radius:14px;width:100%;max-width:480px;padding:32px;box-shadow:0 25px 50px -12px #000c}.login-card h2{color:#fff;align-items:center;gap:10px;margin-bottom:8px;font-size:1.45rem;display:flex}.login-card p{color:var(--text-muted);margin-bottom:20px;font-size:.9rem;line-height:1.45}.info-banner{color:#93c5fd;background:#3b82f61f;border:1px solid #3b82f64d;border-radius:8px;margin-bottom:18px;padding:10px 14px;font-size:.82rem;line-height:1.4}.form-group{margin-bottom:16px}.form-group label{color:#d4d4d8;text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px;font-size:.82rem;font-weight:600;display:block}.form-group input{background:var(--bg-dark);border:1px solid var(--border-color);width:100%;color:var(--text-main);border-radius:8px;outline:none;padding:11px 14px;font-size:.95rem;transition:border-color .2s,box-shadow .2s}.form-group input:focus{border-color:var(--accent-blue);box-shadow:0 0 0 3px #3b82f633}.login-error{color:#fca5a5;background:#ef444426;border:1px solid #ef44444d;border-radius:6px;margin-bottom:16px;padding:10px 14px;font-size:.86rem;line-height:1.4}.btn-submit{background:var(--accent-blue);color:#fff;cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;padding:13px;font-size:.95rem;font-weight:600;transition:background .2s;display:flex}.btn-submit:hover{background:var(--accent-blue-hover)}header{background:var(--bg-surface);border-bottom:1px solid var(--border-color);-webkit-user-select:none;user-select:none;flex-shrink:0;justify-content:space-between;align-items:center;height:54px;padding:0 16px;display:flex}.brand{align-items:center;gap:12px;display:flex}.brand-title{letter-spacing:.3px;align-items:center;gap:8px;font-size:.95rem;font-weight:700;display:flex}.badge-user{background:var(--bg-dark);border:1px solid var(--border-color);color:#38bdf8;border-radius:9999px;align-items:center;gap:8px;padding:5px 12px;font-size:.82rem;display:inline-flex}.badge-user .dot{background:#22c55e;border-radius:50%;width:8px;height:8px;box-shadow:0 0 6px #22c55e}.badge-sqlite{color:#6ee7b7;background:#10b98126;border:1px solid #10b9814d;border-radius:4px;padding:2px 7px;font-size:.72rem;font-weight:600}.header-actions{align-items:center;gap:10px;display:flex}.btn-header{background:var(--bg-card);color:var(--text-main);border:1px solid var(--border-color);cursor:pointer;border-radius:6px;align-items:center;gap:6px;padding:6px 12px;font-size:.82rem;font-weight:500;transition:all .2s;display:inline-flex}.btn-header:hover{background:#3f3f46}.btn-prof{color:#c4b5fd;background:#8b5cf626;border-color:#8b5cf666}.btn-prof:hover{background:var(--accent-purple);color:#fff}.workspace{flex:1;height:calc(100vh - 54px);display:flex;overflow:hidden}.guide-panel{background:var(--bg-surface);border-right:1px solid var(--border-color);flex-direction:column;flex-shrink:0;width:380px;min-width:320px;max-width:460px;display:flex}.guide-panel-title{border-bottom:1px solid var(--border-color);letter-spacing:.04em;color:#94a3b8;text-transform:uppercase;background:#141416;align-items:center;gap:8px;padding:12px 16px;font-size:.85rem;font-weight:700;display:flex}.guide-scroll{color:#d4d4d8;flex:1;padding:16px;font-size:.88rem;line-height:1.55;overflow-y:auto}.guide-card-box{background:var(--bg-dark);border:1px solid var(--border-color);border-left:3px solid var(--accent-blue);border-radius:0 8px 8px 0;margin-bottom:16px;padding:12px 14px;font-size:.82rem;line-height:1.5}.material-card{background:var(--bg-dark);border:1px solid var(--border-color);border-radius:8px;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px;padding:12px 14px;transition:border-color .2s,transform .1s;display:flex}.material-card:hover{border-color:#60a5fa;transform:translateY(-1px)}.material-info{flex:1;min-width:0}.material-title{color:#f1f5f9;white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;font-weight:600;overflow:hidden}.material-desc{color:#94a3b8;margin-top:3px;font-size:.75rem;line-height:1.35}.btn-open-popup{color:#93c5fd;cursor:pointer;background:#3b82f626;border:1px solid #3b82f666;border-radius:6px;flex-shrink:0;align-items:center;gap:4px;padding:7px 12px;font-size:.78rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-open-popup:hover{background:var(--accent-blue);color:#fff}.md-viewer-overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:60000;background:#000000d1;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.md-viewer-container{border:1px solid var(--border-color);background:#18181b;border-radius:12px;flex-direction:column;width:960px;max-width:95vw;height:88vh;display:flex;box-shadow:0 25px 50px -12px #000000b3}.md-viewer-header{border-bottom:1px solid var(--border-color);background:#141416;justify-content:space-between;align-items:center;padding:14px 20px;display:flex}.md-viewer-header h3{color:#38bdf8;align-items:center;gap:8px;font-size:1.05rem;display:flex}.md-viewer-body{color:#e4e4e7;flex:1;padding:24px 30px;font-size:.95rem;line-height:1.7;overflow-y:auto}.md-viewer-body h1,.md-viewer-body h2,.md-viewer-body h3{color:#f8fafc;border-bottom:1px solid #27272a;margin-top:20px;margin-bottom:12px;padding-bottom:6px}.md-viewer-body pre{font-family:var(--code-font);color:#7dd3fc;background:#09090b;border:1px solid #27272a;border-radius:8px;margin:14px 0;padding:14px;font-size:.88rem;overflow-x:auto}.md-viewer-body code{color:#fbbf24;font-family:var(--code-font);background:#27272a;border-radius:4px;padding:2px 6px}.md-viewer-body table{border-collapse:collapse;width:100%;margin:16px 0}.md-viewer-body th,.md-viewer-body td{text-align:left;border:1px solid #3f3f46;padding:8px 12px}.md-viewer-body th{background:#27272a}.editor-panel{background:var(--bg-dark);flex-direction:column;flex:1;min-width:0;display:flex}.editor-toolbar{background:var(--bg-surface);border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;height:44px;padding-right:12px;display:flex}.tabs{height:100%;display:flex}.tab-btn{color:var(--text-muted);font-size:.85rem;font-family:var(--code-font);cursor:pointer;border:none;border-right:1px solid var(--border-color);background:0 0;border-top:2px solid #0000;align-items:center;gap:8px;padding:0 16px;transition:background .15s,color .15s;display:flex}.tab-btn:hover{color:#fff;background:#ffffff05}.tab-btn.active{background:var(--bg-dark);color:#fff;border-top-color:var(--accent-blue)}.badge-file{border-radius:4px;padding:1px 5px;font-size:.7rem;font-weight:700}.badge-html{color:#f97316;background:#f9731626}.badge-js{color:#facc15;background:#facc1526}.editor-controls{align-items:center;gap:8px;display:flex}.btn-ctrl{cursor:pointer;border:none;border-radius:6px;align-items:center;gap:6px;padding:6px 12px;font-size:.82rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-run{color:#bfdbfe;background:#1e3a8a;border:1px solid #3b82f6}.btn-run:hover{background:var(--accent-blue);color:#fff}.btn-save-step{color:#cbd5e1;background:#1e293b;border:1px solid #475569}.btn-save-step:hover{color:#fff;background:#334155}.btn-final{color:#a7f3d0;background:#064e3b;border:1px solid #10b981}.btn-final:hover{background:var(--accent-green);color:#fff}.code-container{flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.error-diagnostics-bar{border-top:1px solid var(--border-color);background:#18181b;flex-shrink:0;justify-content:space-between;align-items:center;padding:8px 16px;font-size:.82rem;display:flex}.error-badge-ok{color:#34d399;align-items:center;gap:6px;font-weight:500;display:flex}.error-badge-fail{color:#f87171;background:#ef444426;border:1px solid #ef44444d;border-radius:6px;align-items:center;gap:8px;padding:4px 10px;font-weight:500;display:flex}.error-line-tag{color:#fff;font-weight:700;font-family:var(--code-font);background:#ef4444;border-radius:4px;padding:1px 6px}.drawer-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:50000;background:#000000b3;justify-content:flex-end;display:flex;position:fixed;inset:0}.teacher-drawer{background:var(--bg-sidebar);border-left:1px solid var(--border-color);flex-direction:column;width:600px;max-width:95vw;height:100%;animation:.2s ease-out slideIn;display:flex;box-shadow:-8px 0 25px #0009}@keyframes slideIn{0%{transform:translate(100%)}to{transform:translate(0)}}.drawer-header{border-bottom:1px solid var(--border-color);background:#141416;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.drawer-header h3{color:#c4b5fd;align-items:center;gap:10px;font-size:1.1rem;display:flex}.btn-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:4px;font-size:1.3rem}.btn-close:hover{color:#fff}.drawer-body{flex:1;padding:18px;overflow-y:auto}.stats-bar{background:var(--bg-dark);border:1px solid var(--border-color);border-radius:8px;justify-content:space-between;align-items:center;margin-bottom:16px;padding:10px 14px;font-size:.85rem;display:flex}.drawer-nav-tabs{gap:8px;margin-bottom:14px;display:flex}.drawer-nav-btn{background:var(--bg-card);border:1px solid var(--border-color);color:var(--text-muted);cursor:pointer;border-radius:6px;flex:1;padding:8px;font-size:.8rem;font-weight:600}.drawer-nav-btn.active{color:#fff;background:#7c3aed;border-color:#7c3aed}.submission-list{flex-direction:column;gap:12px;display:flex}.submission-card{background:var(--bg-dark);border:1px solid var(--border-color);border-radius:8px;padding:14px;transition:border-color .2s,transform .1s}.submission-card:hover{border-color:var(--accent-purple);transform:translateY(-1px)}.submission-meta{justify-content:space-between;align-items:flex-start;margin-bottom:10px;display:flex}.sub-name{color:#fff;font-size:.95rem;font-weight:600}.sub-dni{color:#38bdf8;margin-top:2px;font-size:.82rem;font-weight:500}.sub-badge-final{color:#6ee7b7;background:#10b98133;border:1px solid #10b98166;border-radius:4px;margin-left:6px;padding:2px 6px;font-size:.72rem;font-weight:700}.sub-date{color:var(--text-muted);background:#27272a;border-radius:4px;padding:2px 8px;font-size:.75rem}.submission-actions{gap:6px;margin-top:10px;display:flex}.btn-sub-act{cursor:pointer;border:none;border-radius:5px;flex:1;justify-content:center;align-items:center;gap:4px;padding:6px 10px;font-size:.78rem;font-weight:500;transition:background .15s;display:flex}.btn-load{color:#fff;background:#2563eb}.btn-load:hover{background:#1d4ed8}.btn-preview{color:#fff;background:#7c3aed}.btn-preview:hover{background:#6d28d9}.toast{color:#ecfdf5;z-index:100000;background:#064e3b;border:1px solid #10b981;border-radius:8px;align-items:center;gap:8px;padding:12px 18px;font-size:.9rem;font-weight:500;animation:.25s ease-out toastFade;display:flex;position:fixed;bottom:24px;right:24px;box-shadow:0 10px 15px -3px #00000080}@keyframes toastFade{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.runner-overlay{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:60000;background:#000000bf;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.runner-card{background:#18181b;border:1px solid #3f3f46;border-radius:12px;flex-direction:column;width:900px;max-width:98vw;height:650px;max-height:94vh;display:flex;overflow:hidden;box-shadow:0 25px 50px -12px #000000d9}.runner-header{background:#141416;border-bottom:1px solid #27272a;justify-content:space-between;align-items:center;padding:12px 18px;display:flex}.runner-title{color:#60a5fa;align-items:center;gap:10px;font-size:.95rem;font-weight:600;display:flex}.runner-actions{align-items:center;gap:8px;display:flex}.btn-runner-reload{color:#e4e4e7;cursor:pointer;background:#27272a;border:1px solid #3f3f46;border-radius:6px;align-items:center;gap:6px;padding:5px 12px;font-size:.8rem;display:flex}.btn-runner-reload:hover{color:#fff;background:#3f3f46}.runner-iframe-wrapper{background:#fff;flex:1;position:relative}.runner-iframe{border:none;width:100%;height:100%}.pin-dialog-overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:100001;background:#000000d9;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.pin-dialog-card{background:var(--bg-sidebar);border:1px solid #7c3aed;border-radius:12px;width:100%;max-width:400px;padding:26px;box-shadow:0 20px 40px #000c}.pin-dialog-card h3{color:#c4b5fd;align-items:center;gap:8px;margin-bottom:8px;font-size:1.15rem;display:flex}.pin-dialog-card p{color:var(--text-muted);margin-bottom:16px;font-size:.85rem}.pin-dialog-actions{justify-content:flex-end;gap:10px;margin-top:18px;display:flex}.btn-pin-cancel{color:#a1a1aa;cursor:pointer;background:0 0;border:1px solid #3f3f46;border-radius:6px;padding:8px 16px}.btn-pin-cancel:hover{color:#fff;background:#27272a}.btn-pin-confirm{color:#fff;cursor:pointer;background:#7c3aed;border:none;border-radius:6px;padding:8px 18px;font-weight:600}.btn-pin-confirm:hover{background:#6d28d9}@media (width<=860px){.workspace{flex-direction:column}.guide-panel{border-right:none;border-bottom:1px solid var(--border-color);width:100%;max-width:100%;height:250px}.header-actions .btn-text{display:none}}.lock-banner{color:#fff;z-index:1000;background:linear-gradient(135deg,#b91c1cf2,#7f1d1dfa);border-bottom:2px solid #ef4444;justify-content:space-between;align-items:center;gap:16px;padding:12px 20px;animation:2s ease-in-out infinite pulse-border;display:flex;box-shadow:0 4px 16px #ef444459}@keyframes pulse-border{0%,to{border-bottom-color:#ef4444}50%{border-bottom-color:#f87171}}.lock-banner-content{align-items:center;gap:14px;display:flex}.lock-banner-icon{font-size:1.8rem;line-height:1}.lock-banner-title{letter-spacing:.02em;color:#fff;margin-bottom:2px;font-size:.95rem;font-weight:700}.lock-banner-desc{color:#fecaca;font-size:.82rem;line-height:1.35}.lock-banner-badge{color:#fca5a5;white-space:nowrap;background:#0006;border:1px solid #ffffff40;border-radius:6px;padding:4px 10px;font-size:.75rem;font-weight:600}.btn-ctrl:disabled{opacity:.35;filter:grayscale(80%);pointer-events:none;cursor:not-allowed!important}.btn-saved-list{color:#fff;cursor:pointer;background:#3b82f6;border:1px solid #60a5fa;border-radius:6px;align-items:center;gap:6px;padding:6px 12px;font-size:.8rem;font-weight:600;transition:all .2s;display:flex}.btn-saved-list:hover{background:#2563eb;box-shadow:0 0 10px #3b82f666}.badge-count{background:#ffffff40;border-radius:10px;padding:1px 6px;font-size:.72rem}.exercises-modal-overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:9999;background:#000000d9;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.exercises-modal-card{background:var(--bg-sidebar);border:1px solid var(--border-color);border-radius:12px;flex-direction:column;width:100%;max-width:650px;max-height:85vh;display:flex;overflow:hidden;box-shadow:0 25px 50px -12px #000c}.exercises-modal-header{border-bottom:1px solid var(--border-color);background:var(--bg-dark);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.exercises-modal-header h3{color:#fff;align-items:center;gap:8px;font-size:1.1rem;display:flex}.exercises-modal-body{flex-direction:column;gap:12px;padding:20px;display:flex;overflow-y:auto}.exercise-item-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:8px;justify-content:space-between;align-items:center;gap:14px;padding:14px 16px;transition:border-color .2s,background .2s;display:flex}.exercise-item-card:hover{background:#2e2e33;border-color:#52525b}.exercise-item-info h4{color:#f4f4f5;margin-bottom:4px;font-size:.95rem}.exercise-item-info p{color:var(--text-muted);font-size:.78rem}.exercise-item-actions{gap:8px;display:flex}.btn-item-action{cursor:pointer;border:1px solid #0000;border-radius:6px;padding:6px 12px;font-size:.8rem;font-weight:500;transition:all .2s}.btn-item-review{color:#93c5fd;background:#3b82f626;border-color:#3b82f659}.btn-item-review:hover{color:#fff;background:#3b82f64d}.btn-item-load{color:#6ee7b7;background:#10b98126;border-color:#10b98159}.btn-item-load:hover{color:#fff;background:#10b9814d}.delivery-success-card{background:var(--bg-sidebar);text-align:center;border:1px solid #10b981;border-radius:14px;width:100%;max-width:500px;padding:28px;box-shadow:0 25px 50px #000000d9}.delivery-success-icon{margin-bottom:12px;font-size:3rem}.delivery-success-card h3{color:#6ee7b7;margin-bottom:8px;font-size:1.3rem}.delivery-success-card p{color:#d4d4d8;margin-bottom:16px;font-size:.9rem;line-height:1.5}.delivery-highlight-box{color:#a7f3d0;text-align:left;background:#10b9811f;border:1px dashed #10b98166;border-radius:8px;margin-bottom:20px;padding:12px;font-size:.85rem}.delivery-highlight-box ul{margin-top:6px;margin-left:20px}.delivery-btn-close{color:#000;cursor:pointer;background:#10b981;border:none;border-radius:8px;padding:10px 24px;font-size:.95rem;font-weight:700;transition:background .2s}.delivery-btn-close:hover{color:#fff;background:#059669}.padron-manager-container{flex-direction:column;gap:16px;display:flex}.padron-card-form{background:var(--bg-dark);border:1px solid var(--border-color);border-radius:8px;padding:14px}.padron-form-title{color:#38bdf8;margin-bottom:4px;font-size:.95rem;font-weight:700}.padron-form-subtitle{color:var(--text-muted);margin-bottom:12px;font-size:.78rem;line-height:1.3}.padron-feedback-alert{border-radius:6px;margin-bottom:12px;padding:8px 12px;font-size:.8rem}.padron-feedback-alert.success{color:#6ee7b7;background:#10b98126;border:1px solid #10b98166}.padron-feedback-alert.error{color:#fca5a5;background:#ef444426;border:1px solid #ef444466}.padron-form-grid{flex-wrap:wrap;gap:10px;display:flex}.padron-input-group{flex-direction:column;flex:1;gap:4px;min-width:140px;display:flex}.padron-input-group label{color:#94a3b8;font-size:.75rem;font-weight:600}.padron-input-group input{color:#f4f4f5;background:#18181b;border:1px solid #3f3f46;border-radius:6px;outline:none;padding:8px 10px;font-size:.85rem}.padron-input-group input:focus{border-color:#38bdf8}.btn-add-padron{color:#fff;cursor:pointer;background:#0284c7;border:none;border-radius:6px;height:35px;padding:8px 16px;font-size:.85rem;font-weight:600;transition:background .2s}.btn-add-padron:hover:not(:disabled){background:#0369a1}.btn-add-padron:disabled{opacity:.6;cursor:not-allowed}.padron-list-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.padron-search-wrapper{flex:1;align-items:center;min-width:200px;display:flex;position:relative}.padron-search-wrapper .search-icon{pointer-events:none;font-size:.85rem;position:absolute;left:10px}.padron-search-wrapper input{background:var(--bg-dark);border:1px solid var(--border-color);color:#fff;border-radius:6px;outline:none;width:100%;padding:8px 30px 8px 32px;font-size:.82rem}.padron-search-wrapper input:focus{border-color:#7c3aed}.btn-clear-search{color:#a1a1aa;cursor:pointer;background:0 0;border:none;font-size:.8rem;position:absolute;right:8px}.padron-counter{color:#94a3b8;font-size:.78rem}.padron-table-wrapper{background:var(--bg-dark);border:1px solid var(--border-color);border-radius:8px;max-height:380px;overflow-x:auto}.padron-table{border-collapse:collapse;text-align:left;width:100%;font-size:.82rem}.padron-table th{color:#94a3b8;border-bottom:1px solid var(--border-color);z-index:1;background:#18181b;padding:10px 12px;font-weight:600;position:sticky;top:0}.padron-table td{color:#e4e4e7;border-bottom:1px solid #27272a;padding:8px 12px}.padron-table tr:hover{background:#ffffff08}.padron-table tr.row-extra{background:#10b9810a}.badge-padron{border-radius:12px;padding:2px 8px;font-size:.72rem;font-weight:600;display:inline-block}.badge-padron.badge-oficial{color:#38bdf8;background:#38bdf826;border:1px solid #38bdf84d}.badge-padron.badge-docente{color:#6ee7b7;background:#10b98126;border:1px solid #10b9814d}.btn-delete-padron{color:#fca5a5;cursor:pointer;background:#ef444426;border:1px solid #ef444459;border-radius:4px;padding:3px 8px;font-size:.72rem;transition:all .2s}.btn-delete-padron:hover{color:#fff;background:#ef44444d}