/* === Deutsch-Arcade Chapter Arcade - styles.css (extraido verbatim de index.html) === */
body {
            font-family: 'Fredoka', 'Inter', sans-serif;
            background: radial-gradient(circle at center, #1e1b4b 0%, #0f172a 100%);
            min-height: 100vh;
            color: #f8fafc;
        }
        .pixel-font {
            font-family: 'Press Start 2P', monospace;
        }
        .arcade-cabinet {
            box-shadow: 0 25px 60px -12px rgba(0, 0, 0, 0.9), inset 0 2px 8px rgba(255, 255, 255, 0.25);
            border: 6px solid #6366f1;
        }
        .retro-button {
            transition: all 0.15s ease;
            box-shadow: 0 6px 0 #3730a3, 0 10px 20px rgba(0,0,0,0.4);
        }
        .retro-button:active:not(:disabled) {
            transform: translateY(4px);
            box-shadow: 0 2px 0 #3730a3, 0 5px 10px rgba(0,0,0,0.3);
        }
        .slot-card {
            transition: all 0.2s ease;
            background: linear-gradient(145deg, #1e1b4b, #312e81);
            border: 3px solid #4f46e5;
        }
        .slot-card:hover {
            border-color: #fbbf24;
            transform: translateY(-3px);
            box-shadow: 0 10px 25px -5px rgba(99, 102, 241, 0.5);
        }
        .chapter-node {
            transition: all 0.2s ease;
        }
        .chapter-node:hover:not(.locked) {
            transform: scale(1.03);
        }
        @keyframes bounce-slow {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-8px); }
        }
        .animate-bounce-slow {
            animation: bounce-slow 2s infinite;
        }
        @keyframes pulse-audio {
            0%, 100% { transform: scale(1); opacity: 1; }
            50% { transform: scale(1.1); opacity: 0.8; }
        }
        .animate-pulse-audio {
            animation: pulse-audio 1.2s infinite;
        }
        .crt::before {
            content: " ";
            display: block;
            position: absolute;
            top: 0; left: 0; bottom: 0; right: 0;
            background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%);
            background-size: 100% 4px;
            z-index: 40;
            pointer-events: none;
            opacity: 0.35;
            border-radius: 1.5rem;
        }
/* === ADDITIVO v2: estilos para Juegos / Experimentos / Textos / Das kann ich! (no se modifica nada original) === */
.nw-card{background:linear-gradient(145deg,#1e1b4b,#312e81);border:3px solid #4f46e5;border-radius:1rem;padding:1rem}
.nw-badge{display:inline-block;font-size:10px;font-weight:700;padding:.15rem .6rem;border-radius:.6rem;border:1px solid #4f46e5;background:#1e1b4b;color:#fbbf24}
.nw-grid-games{display:grid;grid-template-columns:1fr;gap:.6rem}
@media(min-width:640px){.nw-grid-games{grid-template-columns:1fr 1fr}}
.nw-game-btn{text-align:left;background:#0f172a;border:2px solid #4f46e5;border-radius:1rem;padding:.7rem .9rem;transition:all .15s ease}
.nw-game-btn:hover{border-color:#fbbf24;transform:translateY(-2px)}
.nw-chip{font-size:10px;font-weight:700;background:#312e81;border:1px solid #6366f1;color:#e0e7ff;border-radius:.5rem;padding:.1rem .5rem}
.nw-exp-step{background:#020617;border:1px solid #334155;border-radius:.75rem;padding:.6rem .8rem;font-size:12px;line-height:1.5}
.nw-conjuro{background:#451a03;border:1px solid #f59e0b;color:#fde68a;border-radius:.75rem;padding:.6rem .8rem;font-style:italic;font-size:12px}
.nw-text-line{display:flex;justify-content:space-between;align-items:center;gap:.5rem;background:#020617;border:1px solid #334155;border-radius:.75rem;padding:.5rem .7rem;font-size:12px}
.nw-tabs{display:flex;gap:.4rem;justify-content:center;margin-bottom:.6rem;flex-wrap:wrap}
.nw-tab{font-size:11px;font-weight:700;padding:.4rem .8rem;border-radius:.7rem;border:1px solid #4f46e5;background:#1e1b4b;color:#c7d2fe;cursor:pointer}
.nw-tab.active{background:#4f46e5;color:#fff}
.nw-check{display:flex;align-items:flex-start;gap:.6rem;background:#020617;border:1px solid #334155;border-radius:.75rem;padding:.55rem .7rem;font-size:12px;text-align:left;width:100%}
.nw-check.done{border-color:#10b981;background:rgba(6,78,59,.5)}
/* === ADITIVO nav: barra de salida unificada Slots > Mapa > Hub (no altera estilos originales) === */
.nw-exitbar{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;align-items:center;margin-top:.6rem;padding-top:.6rem;border-top:1px solid rgba(99,102,241,.3)}
.nw-exitbar .nw-exitbtn{font-size:11px;font-weight:700;padding:.5rem .9rem;border-radius:.75rem;border:1px solid #4f46e5;background:#1e1b4b;color:#c7d2fe;transition:all .15s ease}
.nw-exitbar .nw-exitbtn:hover{border-color:#fbbf24;color:#fff;transform:translateY(-1px)}
.nw-exitbar .nw-exitbtn.primary{background:#4f46e5;color:#fff}
.nw-exit-hint{font-size:10px;color:#818cf8;text-align:center;margin-top:.25rem}
/* === ADDITIVO idioma: iconos de audio por frase y globito de traduccion.
   Se anaden desde js/i18n-help.js (sin tocar la logica original).
   Color base ambar (#f59e0b) con texto slate, para que sea legible tanto sobre
   el fondo indigo de 2g como sobre los bloques de gramatica. === */
.nw-say-icon{background:#f59e0b;color:#1e293b;border:0;border-radius:8px;padding:1px 6px;font-size:12px;cursor:pointer;vertical-align:middle;line-height:1.4}
#nw-i18n-tip{position:fixed;z-index:9999;display:none;max-width:280px;background:#0f172a;color:#fde047;border:2px solid #6366f1;border-radius:12px;padding:8px 10px;font-size:12px;line-height:1.4;box-shadow:0 8px 24px rgba(0,0,0,.5);pointer-events:auto;text-align:left}
#nw-i18n-tip .nw-tip-es{font-weight:700;margin-bottom:4px}
#nw-i18n-tip button{background:#f59e0b;color:#1e293b;border:0;border-radius:8px;padding:3px 8px;font-weight:700;cursor:pointer;font-size:11px}

