@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap";:root{--color-primario: #fb2c36;--color-fondo: #1a1a1a;--color-superficie: #2c2c2c;--color-borde: #444;--color-texto-principal: #f0f0f0;--color-texto-secundario: #a0a0a0}*{box-sizing:border-box}body{margin:0;font-family:Inter,sans-serif;background-color:var(--color-fondo);color:var(--color-texto-principal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.nodo{width:25px;height:25px;outline:1px solid #2c2c2c;display:flex;justify-content:center;align-items:center;position:relative;transition:background-color .2s ease,transform .1s ease;font-size:10px;font-weight:500;color:var(--color-texto-principal)}.nodo-inicio{background-color:#05c46b}.nodo-final{background-color:var(--color-primario)}.nodo-parada{background-color:#8e44ad}.nodo-muro{background-color:#34495e;border:1px solid #2c3e50;animation:animacionMuro .2s ease-out}@keyframes animacionMuro{0%{transform:scale(.7);background-color:var(--color-primario)}to{transform:scale(1);background-color:#34495e}}.nodo-visitado{background-color:#2980b9;animation:pulsoVisitado .4s ease-out}@keyframes pulsoVisitado{0%{transform:scale(.5);border-radius:50%;opacity:.7}to{transform:scale(1);border-radius:0;opacity:1}}.nodo-arena{background-color:#c2b280}.nodo-agua{background-color:#5f9ea0}.nodo-parada span{color:#fff;font-size:12px;font-weight:700;-webkit-user-select:none;user-select:none}.nodo-camino-corto{animation:pulsoCamino .5s ease-out}@keyframes pulsoCamino{0%{transform:scale(.7)}to{transform:scale(1)}}.tramo-0{background-color:#ffadad!important}.tramo-1{background-color:#ffd6a5!important}.tramo-2{background-color:#fdffb6!important}.tramo-3{background-color:#caffbf!important}.tramo-4{background-color:#9bf6ff!important}.tramo-5{background-color:#a0c4ff!important}.tramo-6{background-color:#bdb2ff!important}.tramo-7{background-color:#ffc6ff!important}.modal-ayuda{text-align:left;max-width:650px;position:relative;max-height:90vh;overflow:hidden;display:flex;flex-direction:column}.btn-cerrar{position:absolute;top:10px;right:15px;background:none;border:none;font-size:2.5rem;color:var(--color-texto-secundario);cursor:pointer;transition:color .2s ease,transform .2s ease;line-height:1;padding:0;z-index:10}.btn-cerrar:hover{color:var(--color-texto-principal);transform:scale(1.1)}.contenido-paso{padding:10px;overflow-y:auto;flex-grow:1}.contenido-paso h3{text-align:center;color:var(--color-texto-principal);margin-top:0;padding-right:25px}.contenido-paso p{text-align:center;line-height:1.6;margin-bottom:25px}.navegacion-ayuda{display:flex;justify-content:space-between;align-items:center;padding:20px 10px 10px;border-top:1px solid var(--color-borde);flex-shrink:0}.navegacion-ayuda button{background-color:#4d4d4d;color:var(--color-texto-principal);border:none;padding:10px 20px;border-radius:8px;cursor:pointer;transition:background-color .2s ease}.navegacion-ayuda button:disabled{opacity:.4;cursor:not-allowed}.navegacion-ayuda button:not(:disabled):hover{background-color:#666}.navegacion-ayuda .btn-confirmar{background-color:var(--color-primario);color:#fff}.navegacion-ayuda .btn-confirmar:hover{background-color:#e0202b}.indicadores-paso{display:flex;gap:8px}.indicador{width:10px;height:10px;border-radius:50%;background-color:var(--color-borde);transition:background-color .3s ease}.indicador.activo{background-color:var(--color-primario)}.comparacion-diagonal,.comparacion-algoritmos{display:flex;justify-content:space-around;align-items:flex-start;gap:20px;background-color:var(--color-fondo);padding:15px;border-radius:8px;margin-top:10px}.comparacion-diagonal h4,.comparacion-algoritmos h4{text-align:center;border-bottom:none;margin-bottom:10px}.grid-ejemplo{display:grid;grid-template-columns:repeat(3,30px);grid-template-rows:repeat(3,30px);gap:2px}.grid-celda{width:30px;height:30px;background-color:var(--color-borde);display:flex;justify-content:center;align-items:center;font-size:1.2rem;border-radius:4px}.celda-centro{background-color:var(--color-superficie)}.celda-valida{background-color:#05c46b}.lista-herramientas{list-style-type:none;padding-left:0}.lista-herramientas li{display:flex;align-items:center;gap:10px;margin-bottom:15px}.demo-color{width:25px;height:25px;border-radius:4px;flex-shrink:0;border:1px solid var(--color-borde)}.demo-borrador{background:repeating-linear-gradient(45deg,#4d4d4d,#4d4d4d 5px,#666 5px 10px)}.demo-svg{width:100%;height:80px;background-color:var(--color-borde);border-radius:4px}.nodo-inicio-svg{fill:#05c46b}.nodo-final-svg{fill:var(--color-primario)}.onda-dijkstra{fill:#2980b9;animation:expandir-dijkstra 2s infinite ease-out}@keyframes expandir-dijkstra{0%{r:0;opacity:1}90%{r:80;opacity:.5}to{r:80;opacity:0}}.onda-astar{fill:#2980b9;animation:expandir-astar 2s infinite ease-out}@keyframes expandir-astar{0%{rx:0;ry:0;opacity:1}90%{rx:70;ry:30;opacity:.5}to{rx:70;ry:30;opacity:0}}.contenedor-principal{display:flex;flex-direction:column;align-items:center;gap:20px;padding:1.5rem}.panel-controles{display:flex;flex-wrap:wrap;gap:1.5rem;justify-content:center;align-items:center;padding:1rem 1.5rem;background-color:var(--color-superficie);border-radius:12px;width:auto;max-width:95%;border:1px solid var(--color-borde)}.grupo-controles{display:flex;flex-wrap:wrap;gap:15px;align-items:center}.grupo-controles:not(:last-child){border-right:1px solid var(--color-borde);padding-right:1.5rem}.grupo-controles label,.control-item{display:flex;align-items:center;gap:8px;font-size:.9rem}.grupo-controles input[type=number]{width:65px;padding:8px;background-color:var(--color-fondo);color:var(--color-texto-principal);border:1px solid var(--color-borde);border-radius:5px;text-align:center}.panel-controles button{padding:10px 18px;font-size:.9rem;font-weight:500;cursor:pointer;border:1px solid var(--color-borde);border-radius:8px;color:var(--color-texto-principal);background-color:#3c3c3c;transition:all .2s ease}.panel-controles button:disabled{opacity:.5;cursor:not-allowed}.panel-controles button:not(:disabled):hover{background-color:#4d4d4d;border-color:#666}.panel-controles button.activo{background-color:var(--color-primario);border-color:var(--color-primario);color:#fff;font-weight:700}.panel-controles .btn-principal{background-color:var(--color-primario);border-color:var(--color-primario);font-weight:700;color:#fff}.panel-controles .btn-principal:not(:disabled):hover{background-color:#e0202b;border-color:#e0202b}.panel-controles .btn-secundario{background-color:transparent}.btn-ayuda{font-weight:700;border-radius:50%!important;width:38px;height:38px;padding:0!important}.grupo-controles select,.grupo-controles .checkbox-label{font-size:.9rem;background-color:var(--color-fondo);color:var(--color-texto-principal);border:1px solid var(--color-borde);border-radius:5px;padding:8px}.grupo-controles .checkbox-label{display:flex;align-items:center;gap:5px;padding:8px 12px;cursor:pointer}.grupo-controles input[type=range]{cursor:pointer}.tooltip-container{position:relative}.tooltip{position:absolute;bottom:125%;left:50%;transform:translate(-50%);background-color:#111;color:var(--color-texto-principal);padding:10px 15px;border-radius:8px;border:1px solid var(--color-borde);font-size:.85rem;width:280px;text-align:left;z-index:10;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease;pointer-events:none}.tooltip-container:hover .tooltip{opacity:1;visibility:visible}.panel-estadisticas{display:flex;gap:30px;padding:10px 20px;background-color:var(--color-superficie);border-radius:8px;border:1px solid var(--color-borde);font-size:.9rem;color:var(--color-texto-secundario)}.panel-estadisticas b{color:var(--color-texto-principal);font-weight:700}.tablero{display:flex;flex-direction:column;border:1px solid var(--color-borde)}.fila-tablero{display:flex}.App{text-align:center;display:flex;flex-direction:column;min-height:100vh}.app-header{padding:1rem;background-color:var(--color-superficie);border-bottom:1px solid var(--color-borde)}.app-header h1{margin:0;color:var(--color-primario);font-weight:700;font-size:2.5rem}.author-info{margin-top:8px;color:var(--color-texto-secundario);display:flex;flex-direction:column;align-items:center;gap:8px}.social-links{display:flex;gap:20px}.social-links a{color:var(--color-texto-principal);text-decoration:none;font-weight:500;transition:color .2s ease}.social-links a:hover{color:var(--color-primario)}.app-footer{margin-top:auto;padding:1.5rem;background-color:var(--color-superficie);border-top:1px solid var(--color-borde);font-size:.9rem;color:var(--color-texto-secundario)}.app-footer p{margin:0 0 1rem}.app-footer a{color:var(--color-primario);text-decoration:none;font-weight:500;transition:text-decoration .2s ease}.app-footer a:hover{text-decoration:underline}.tech-stack{display:flex;flex-direction:column;align-items:center;gap:8px}.tech-icons{display:flex;flex-wrap:wrap;gap:15px;justify-content:center}.tech-icons span{background-color:var(--color-borde);padding:4px 12px;border-radius:15px;font-size:.8rem;font-weight:500}
