.copyright,
.copyright * {
    font-size: 12px;
    font-weight: bold;
    color: #3366cc !important;
    text-align: center;
    margin-top: 20px;
}

.copyright p {
	color: #3366cc !important;
	font-weight: bold !important;
}
		
header {
    text-align: center;
    margin-bottom: 16px;
}

h1 {
    font-size: 1.8rem;
    background: linear-gradient(120deg, #8ba6b9, #6d8e9f);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.subtitulo, .subtitulo_bold {
    font-size: 0.8rem;
    color: #8b9aad;
}

/* Pestañas */
.tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
}

.tab-btn {
    flex: 1;
    background: #e2e8f0;
    border: none;
    border-radius: 40px;
    padding: 10px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.tab-btn.active {
    background: linear-gradient(135deg, #8ba6b9, #6d8e9f);
    color: white;
}

/* Acciones superiores */
.acciones-superior {
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
}

.btn-parar-todo, .btn-sorpresa {
    flex: 1;
    border: none;
    border-radius: 40px;
    padding: 10px;
    font-size: 0.9rem;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-parar-todo {
    background: linear-gradient(135deg, #e53e3e, #c53030);
    color: white;
}

.btn-sorpresa {
    background: linear-gradient(135deg, #f093fb, #f5576c);
    color: white;
}

/* Botonera compacta de décadas */
.botonera-compacta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}

.btn-mini {
    background: #f0f2f5;
    border: none;
    border-radius: 40px;
    padding: 8px 14px;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    flex: 1 0 auto;
    min-width: 70px;
}

.btn-mini:hover {
    background: #dce3ec;
    transform: translateY(-2px);
}

/* Buscador compacto */
.buscador-compacto {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
}

#campo-busqueda, #campo-busqueda-radio {
    flex: 1;
    padding: 10px 14px;
    font-size: 0.9rem;
    border: 1px solid #ddd;
    border-radius: 40px;
    outline: none;
}

.btn-buscar-mini, .btn-voz-mini {
    background: #b5d3e7;
    border: none;
    border-radius: 40px;
    padding: 0 16px;
    font-size: 1rem;
    cursor: pointer;
}

/* Footer mini */
.footer-mini {
    background: rgba(0,0,0,0.05);
    border-radius: 20px;
    padding: 8px 12px;
    margin-bottom: 16px;
    font-size: 12px;
    text-align: center;
    color: #6c829c;
}

/* Reproductor compacto */
.reproductor-compacto {
    background: rgba(255,255,255,0.8);
    border-radius: 24px;
    padding: 12px;
    margin-bottom: 16px;
}

.info-now-playing {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

#titulo-cancion {
    font-size: 0.9rem;
    color: #5f7a95;
    flex: 1;
}

.star-btn {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
}

.btn-control-mini {
    background: #e3eef9;
    border: none;
    border-radius: 40px;
    padding: 8px 16px;
    font-size: 0.85rem;
    cursor: pointer;
    width: 100%;
}

/* Panel doble (historial + favoritos) */
.panel-doble {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 16px;
}

@media (min-width: 600px) {
    .panel-doble {
        flex-direction: row;
    }
    .seccion-historial-compacta, .seccion-favoritos-compacta {
        flex: 1;
    }
}

.seccion-historial-compacta, .seccion-favoritos-compacta {
    background: rgba(0,0,0,0.03);
    border-radius: 20px;
    padding: 12px;
}

.panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.panel-header h4 {
    font-size: 0.9rem;
    color: var(--text-primary, #4a627a);
}

.btn-mini-icon {
    background: none;
    border: none;
    font-size: 1rem;
    cursor: pointer;
}

.lista-compacta {
    max-height: 150px;
    overflow-y: auto;
}

.historial-card, .favorito-card {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    font-size: 0.75rem;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    cursor: pointer;
}

.historial-card:hover, .favorito-card:hover {
    background: rgba(0,0,0,0.05);
    border-radius: 12px;
}

.historial-info, .favorito-info {
    flex: 1;
}

.historial-nombre, .favorito-nombre {
    font-weight: 500;
}

.historial-fecha {
    font-size: 0.6rem;
    color: #8b9aad;
}

/* Curiosidad compacta */
.curiosidad-compacta {
    background: rgba(255,215,150,0.15);
    border-radius: 20px;
    padding: 10px;
    margin-top: 8px;
}

.curiosidad-card {
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.curiosidad-icono {
    font-size: 1.3rem;
}

.curiosidad-texto {
    font-size: 0.75rem;
    line-height: 1.4;
    color: #5f7a95;
}

.curiosidad-meta {
    display: flex;
    gap: 10px;
    font-size: 0.6rem;
    margin-top: 5px;
}

.curiosidad-decada, .curiosidad-genero {
    background: rgba(0,0,0,0.05);
    padding: 2px 8px;
    border-radius: 20px;
}

/* Emisora compacta */
.emisora-compacta {
    background: #fafcff;
    border-radius: 20px;
    padding: 12px;
    margin: 12px 0;
    text-align: center;
    font-size: 0.85rem;
}

/* Estado búsqueda */
.estado-busqueda {
    text-align: center;
    font-size: 0.75rem;
    margin-top: 10px;
    color: #7e95ab;
}

/* Modo oscuro */
:root {
    --text-primary: #4a627a;
    --card-bg: #fefefe;
}

[data-theme="dark"] {
    --text-primary: #c4d0e0;
    --card-bg: #242538;
}

[data-theme="dark"] .container {
    background: rgba(30, 30, 46, 0.95);
}

[data-theme="dark"] .btn-mini {
    background: #2d2f42;
    color: #c4d0e0;
}

[data-theme="dark"] .footer-mini {
    background: rgba(255,255,255,0.1);
}

/* Notificaciones */
.notificacion {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: #333;
    color: white;
    padding: 8px 16px;
    border-radius: 40px;
    font-size: 0.8rem;
    z-index: 1000;
}

/* Theme toggle */
.theme-toggle {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: var(--card-bg);
    border: none;
    border-radius: 40px;
    padding: 8px 16px;
    font-size: 0.8rem;
    cursor: pointer;
    z-index: 1000;
}

.subtitulo-seccion {
    font-size: 0.8rem;
    font-weight: bold;
    color: #6d8e9f;
    margin: 12px 0 8px 0;
    padding-left: 5px;
    border-left: 3px solid #8ba6b9;
}

/* Info adicional radio */
.info-adicional-radio {
    background: rgba(100, 100, 200, 0.08);
    border-radius: 16px;
    padding: 8px 12px;
    margin: 10px 0;
    font-size: 0.7rem;
    text-align: center;
    color: #5a6e8a;
    border-left: 3px solid #8ba6b9;
}
/* ===== Mejoras radio accesible para personas mayores ===== */
.radio-browser-section h3 {
    color: #4a627a;
    margin: 12px 0 8px;
}

.ayuda-radio {
    background: rgba(139, 166, 185, 0.14);
    border-radius: 18px;
    padding: 12px 14px;
    font-size: 0.95rem;
    line-height: 1.45;
    color: #4a627a;
    margin-bottom: 14px;
}

.botonera-radio {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.btn-radio {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    min-height: 68px;
    background: #f7fafc;
    border: 1px solid rgba(109, 142, 159, 0.25);
    border-radius: 20px;
    padding: 12px;
    cursor: pointer;
    text-align: left;
    color: #40576f;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    transition: transform 0.15s ease, background 0.15s ease;
}

.btn-radio:hover {
    background: #eaf3fb;
    transform: translateY(-2px);
}

.btn-radio .emoji {
    font-size: 1.6rem;
    line-height: 1;
}

.btn-radio .texto {
    font-weight: 700;
    font-size: 0.95rem;
}

.btn-radio small {
    font-weight: 500;
    color: #6c829c;
}

.btn-radio-categoria {
    justify-content: center;
    text-align: center;
    font-size: 1rem;
    font-weight: 700;
}

.buscadores-radio {
    background: rgba(255,255,255,0.75);
    border-radius: 22px;
    padding: 14px;
    margin: 14px 0;
}

.buscador-texto-radio {
    display: flex;
    gap: 8px;
    margin-bottom: 10px;
}

.btn-buscar, .btn-voz-grande, .btn-control {
    border: none;
    border-radius: 40px;
    padding: 12px 16px;
    font-size: 0.95rem;
    font-weight: 700;
    cursor: pointer;
    background: #b5d3e7;
    color: #324b61;
}

.btn-voz-grande {
    width: 100%;
    background: #dceef9;
}

.estado-busqueda.exito { color: #2f855a; font-weight: 700; }
.estado-busqueda.error { color: #c53030; font-weight: 700; }
.estado-busqueda.escuchando { color: #805ad5; font-weight: 700; }

.resultados-radio {
    margin: 12px 0;
}

.resultados-radio-header {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    align-items: center;
    background: rgba(109, 142, 159, 0.10);
    border-radius: 16px;
    padding: 10px 12px;
    margin-bottom: 8px;
    color: #4a627a;
}

.resultados-radio-header small {
    color: #6c829c;
}

.radio-card {
    width: 100%;
    display: flex;
    align-items: stretch;
    gap: 8px;
    margin-bottom: 8px;
}

.radio-card-main {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    background: #ffffff;
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 16px;
    padding: 10px;
    text-align: left;
    cursor: pointer;
    min-width: 0;
}

.radio-card-main:hover {
    background: #eef6fc;
}

.radio-fav-mini {
    width: 48px;
    min-width: 48px;
    border: none;
    border-radius: 16px;
    background: #fff1b8;
    color: #8a6400;
    font-size: 1.4rem;
    cursor: pointer;
}

.radio-fav-mini.activo {
    background: #ffd166;
}

.radio-fav-mini:hover {
    filter: brightness(0.97);
}

.radio-logo {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #edf2f7;
    flex: 0 0 auto;
    overflow: hidden;
}

.radio-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.radio-icono {
    font-size: 1.25rem;
}

.radio-card-info {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.radio-card-info strong {
    font-size: 0.9rem;
    color: #40576f;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.radio-card-info small {
    font-size: 0.72rem;
    color: #718096;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.radio-play {
    font-size: 1rem;
}

.emisora-actual {
    background: #fafcff;
    border-radius: 22px;
    padding: 14px;
    margin: 14px 0;
    text-align: center;
    color: #40576f;
}

.emisora-actual strong {
    font-size: 1.05rem;
}

.controles-radio {
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
}

.controles-radio .btn-control {
    flex: 1;
}

.btn-favorito-radio {
    background: #fff1b8;
}

.btn-favorito-radio:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.panel-radio .lista-radio {
    max-height: 260px;
}

.lista-vacia {
    font-size: 0.78rem;
    color: #718096;
    padding: 8px;
    margin: 0;
}

@media (max-width: 560px) {
    .buscador-texto-radio,
    .controles-radio {
        flex-direction: column;
    }

    .btn-buscar, .btn-voz-grande, .btn-control {
        width: 100%;
    }
}

/* ===== V6: interfaz simplificada para personas mayores ===== */
.tabs { display: none !important; }
.tab-content { display: block !important; opacity: 1 !important; visibility: visible !important; }
.bloque-principal {
    margin: 26px 0;
    padding: 24px;
    border-radius: 24px;
    background: rgba(255,255,255,0.88);
    box-shadow: 0 10px 30px rgba(0,0,0,0.10);
}
.bloque-principal h2 {
    margin: 0 0 10px 0;
    font-size: clamp(1.6rem, 4vw, 2.3rem);
    text-align: center;
}
.acciones-superior {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 16px;
    margin: 22px 0;
}
.btn-parar-todo, .btn-sorpresa {
    min-height: 70px;
    font-size: 1.35rem !important;
    font-weight: 800;
    border-radius: 20px !important;
}
.botonera-compacta, .botonera-radio, .categorias-radio {
    gap: 14px !important;
}
.btn-mini, .btn-radio, .btn-buscar, .btn-voz-grande, .btn-control, .btn-control-mini {
    min-height: 58px;
    font-size: 1.08rem;
    border-radius: 18px !important;
}
.btn-radio {
    cursor: pointer !important;
    pointer-events: auto !important;
    position: relative;
    z-index: 2;
}
.emisora-actual, .reproductor-compacto {
    border: 3px solid rgba(34, 117, 150, 0.25);
    border-radius: 22px;
    padding: 18px;
    background: #f7fbfd;
}
.emisora-actual p, #titulo-cancion {
    font-size: 1.2rem;
    line-height: 1.5;
}
.buscador-compacto, .buscador-texto-radio {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 10px;
    align-items: center;
}
.buscador-texto-radio { grid-template-columns: 1fr auto; }
#campo-busqueda, #campo-busqueda-radio {
    min-height: 54px;
    font-size: 1.1rem;
    border-radius: 16px;
}
@media (max-width: 720px) {
    .buscador-compacto, .buscador-texto-radio { grid-template-columns: 1fr; }
    .bloque-principal { padding: 16px; }
}

/* Botones individuales para borrar favoritos sin afectar al resto de la aplicación */
.favorito-card-con-borrar {
    justify-content: space-between;
}

.favorito-contenido {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
}

.btn-borrar-favorito {
    border: none;
    border-radius: 12px;
    background: #ffe8e8;
    color: #8a2a2a;
    cursor: pointer;
    font-size: 1rem;
    padding: 6px 9px;
    flex: 0 0 auto;
}

.btn-borrar-favorito:hover {
    filter: brightness(0.96);
}

.radio-delete-mini {
    width: 48px;
    min-width: 48px;
    border-radius: 16px;
    margin-left: 4px;
}


/* =========================================================
   V2 - Música, recuerdos y compañía
   ========================================================= */
.bloque-recuerdos-v2 {
    background: linear-gradient(135deg, #fff7e6 0%, #f6fbff 100%);
    border: 3px solid rgba(231, 166, 76, 0.28);
    margin-bottom: 24px;
}

.recuerdos-v2-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.recuerdos-v2-header h2 {
    margin-bottom: 6px;
}

.etiqueta-v2 {
    background: #2f7da0;
    color: white;
    font-weight: 800;
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 0.95rem;
    box-shadow: 0 4px 12px rgba(47,125,160,0.22);
}

.recuerdos-v2-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.recuerdo-card {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    background: rgba(255,255,255,0.88);
    border: 2px solid rgba(47,125,160,0.14);
    border-radius: 24px;
    padding: 18px;
    box-shadow: 0 8px 20px rgba(31, 83, 105, 0.08);
}

.recuerdo-icono {
    font-size: 2.2rem;
    line-height: 1;
    flex: 0 0 auto;
}

.recuerdo-contenido h3 {
    margin: 0 0 8px 0;
    color: #24536b;
    font-size: 1.22rem;
}

.recuerdo-contenido p {
    margin: 0 0 8px 0;
    color: #324b5c;
    font-size: 1.06rem;
    line-height: 1.45;
}

.recuerdo-contenido small {
    display: block;
    margin-bottom: 12px;
    color: #667985;
    line-height: 1.35;
}

.btn-v2-principal, .btn-v2-secundario {
    border: none;
    cursor: pointer;
    border-radius: 18px;
    padding: 12px 16px;
    min-height: 52px;
    font-weight: 800;
    font-size: 1rem;
    transition: transform 0.15s ease, filter 0.15s ease;
}

.btn-v2-principal {
    background: linear-gradient(135deg, #2f7da0 0%, #45a3c7 100%);
    color: white;
}

.btn-v2-secundario {
    background: #fff0cf;
    color: #7a4b00;
    border: 2px solid #ffd98a;
}

.btn-v2-principal:hover, .btn-v2-secundario:hover {
    transform: translateY(-2px);
    filter: brightness(0.98);
}

@media (max-width: 900px) {
    .recuerdos-v2-grid { grid-template-columns: 1fr; }
    .recuerdo-card { align-items: center; }
}


/* ========== V2 PASO 2: RECUERDO VISUAL DEL DÍA ========== */
.recuerdo-visual-card {
    margin-top: 18px;
    display: grid;
    grid-template-columns: minmax(220px, 38%) 1fr;
    gap: 18px;
    background: rgba(255,255,255,0.92);
    border: 2px solid rgba(47,125,160,0.16);
    border-radius: 28px;
    padding: 18px;
    box-shadow: 0 10px 26px rgba(31, 83, 105, 0.10);
    align-items: center;
}

.recuerdo-visual-imagen-wrap {
    width: 100%;
    overflow: hidden;
    border-radius: 22px;
    background: #f3fbff;
    border: 1px solid rgba(47,125,160,0.12);
}

.recuerdo-visual-img {
    width: 100%;
    display: block;
    min-height: 210px;
    object-fit: cover;
}

.recuerdo-visual-texto h3 {
    margin: 8px 0 10px 0;
    color: #24465a;
    font-size: 1.45rem;
    line-height: 1.25;
}

.recuerdo-visual-texto p {
    color: #324b5c;
    font-size: 1.12rem;
    line-height: 1.5;
    margin: 0 0 16px 0;
}

.recuerdo-visual-etiqueta {
    display: inline-block;
    background: #edf9ff;
    color: #2f6f8e;
    border: 1px solid #ccefff;
    border-radius: 999px;
    padding: 8px 12px;
    font-weight: 800;
    font-size: 0.95rem;
}

.recuerdo-visual-acciones {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

@media (max-width: 900px) {
    .recuerdo-visual-card {
        grid-template-columns: 1fr;
    }
    .recuerdo-visual-img {
        min-height: 180px;
    }
    .recuerdo-visual-acciones button {
        width: 100%;
    }
}

/* ========== V2 PASO 3: TELEVISIÓN, RADIO Y ANUNCIOS DE ANTES ========== */
.memoria-tv-card {
    background: linear-gradient(135deg, #fff8ec 0%, #ffffff 100%);
    border-color: rgba(180, 115, 35, 0.20);
}

.memoria-tv-imagen-wrap {
    background: #fff6e8;
    border-color: rgba(180, 115, 35, 0.18);
}

.memoria-tv-card .recuerdo-visual-etiqueta {
    background: #fff3d6;
    color: #865000;
    border-color: #ffd991;
}

.memoria-tv-card .btn-v2-principal {
    background: linear-gradient(135deg, #b56722 0%, #d9903d 100%);
}

.memoria-tv-card .btn-v2-secundario {
    background: #fff7e8;
    color: #7a4b00;
    border-color: #f1c27a;
}


/* =========================================================
   MÚSICA V2 PARTE 3 INTEGRADA
   Mantiene visibles V1, Radio, V2 recuerdos y añade Salas.
   ========================================================= */
html { scroll-behavior: smooth; }
.nav-museo-v2 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
    gap: 10px;
    margin: 18px 0 22px 0;
    padding: 12px;
    border-radius: 22px;
    background: linear-gradient(135deg, #fff7e8, #eef8ff);
    border: 1px solid #e6d5b8;
}
.nav-museo-btn {
    border: 0;
    border-radius: 18px;
    padding: 14px 12px;
    font-size: 17px;
    font-weight: 800;
    cursor: pointer;
    background: white;
    color: #26364a;
    box-shadow: 0 4px 12px rgba(0,0,0,.08);
}
.nav-museo-destacado { background: linear-gradient(135deg, #f97316, #f59e0b); color: white; }
.museo-recuerdos-v2 {
    background: linear-gradient(135deg, #fff7e8 0%, #fffaf2 55%, #eef8ff 100%);
    border: 2px solid #f0c789;
    border-radius: 28px;
    padding: 22px;
    margin: 26px 0;
}
.museo-cabecera {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 18px;
}
.museo-cabecera h2 { margin: 0 0 8px 0; font-size: clamp(28px, 4vw, 46px); }
.btn-museo-sorpresa {
    border: 0;
    border-radius: 999px;
    padding: 16px 24px;
    background: linear-gradient(135deg, #e11d48, #f97316);
    color: white;
    font-size: 18px;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(225,29,72,.2);
}
.salas-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 14px;
    margin: 18px 0 22px;
}
.sala-card {
    min-height: 150px;
    text-align: left;
    border: 2px solid #ead8bf;
    border-radius: 22px;
    padding: 18px;
    background: rgba(255,255,255,.92);
    cursor: pointer;
    box-shadow: 0 6px 18px rgba(0,0,0,.08);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.sala-card:hover, .sala-card.activa { transform: translateY(-3px); border-color: #f59e0b; box-shadow: 0 10px 22px rgba(0,0,0,.12); }
.sala-icono { display:block; font-size: 38px; margin-bottom: 10px; }
.sala-card strong { display:block; font-size: 20px; color:#2b2118; margin-bottom: 8px; }
.sala-card small { display:block; font-size: 14px; color:#6b5a48; line-height:1.35; }
.sala-experiencia {
    display: grid;
    grid-template-columns: minmax(260px, 420px) 1fr;
    gap: 20px;
    align-items: center;
    background: rgba(255,255,255,.9);
    border: 1px solid #e8d7bd;
    border-radius: 26px;
    padding: 18px;
    box-shadow: 0 8px 22px rgba(0,0,0,.08);
}
.sala-hero {
    background: #fff1d5;
    border-radius: 22px;
    padding: 14px;
    border: 2px solid #f3c37a;
}
.sala-hero img { width: 100%; height: auto; display:block; border-radius: 16px; }
.sala-etiqueta {
    display: inline-block;
    border-radius: 999px;
    background: #e0f2fe;
    color: #075985;
    padding: 8px 12px;
    font-weight: 800;
    margin-bottom: 10px;
}
.sala-detalle h3 { font-size: clamp(24px, 3vw, 36px); margin: 6px 0 10px; color:#2b2118; }
.sala-detalle p { font-size: 17px; line-height: 1.5; color:#4b4034; }
.sala-acciones { display:flex; flex-wrap:wrap; gap: 10px; margin-top: 16px; }
.miniaturas-sala {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
    margin-top: 16px;
}
.miniatura-sala {
    border: 1px solid #ead8bf;
    border-radius: 18px;
    background: white;
    padding: 10px;
    cursor: pointer;
    text-align:left;
    box-shadow: 0 4px 12px rgba(0,0,0,.07);
}
.miniatura-sala img { width: 100%; border-radius: 12px; display:block; margin-bottom: 8px; background:#fff3d6; }
.miniatura-sala strong { font-size: 15px; display:block; }
.miniatura-sala small { font-size: 11px; color:#6b7280; text-transform:uppercase; }
.recortables-demo {
    margin-top: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    border-radius: 24px;
    padding: 18px;
    background: linear-gradient(135deg, #fff1f7, #fdf2f8);
    border: 2px dashed #f9a8d4;
}
.recortables-texto h3 { font-size: 26px; margin: 0 0 8px; }
.recortables-texto p { font-size: 16px; line-height: 1.45; }
.recortables-panel { display:grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items:center; }
.muneca-demo {
    min-height: 210px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    font-size: 78px;
    border-radius: 24px;
    background:white;
    border:1px solid #fbcfe8;
}
#vestido-demo { font-size: 56px; margin-top: -18px; }
.vestidos-demo { display:grid; gap: 10px; }
.vestidos-demo button {
    border:0;
    border-radius: 16px;
    padding: 12px;
    background:white;
    font-size: 16px;
    font-weight:800;
    cursor:pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,.08);
}
@media (max-width: 820px) {
    .sala-experiencia, .recortables-demo, .recortables-panel { grid-template-columns: 1fr; }
    .nav-museo-v2 { grid-template-columns: repeat(2, 1fr); }
}

/* =========================================================
   Museo V2 Parte 3 - panel de imagen / vídeo en cada sala
   ========================================================= */
.sala-media-panel {
    background: linear-gradient(135deg, #fff7cc 0%, #fffef2 100%);
    border: 2px dashed #f59e0b;
    border-radius: 22px;
    padding: 14px;
    box-shadow: inset 0 0 14px rgba(245, 158, 11, .18), 0 8px 20px rgba(0,0,0,.08);
}
.sala-media-cabecera {
    font-weight: 900;
    color: #3b2b1e;
    font-size: 18px;
    margin-bottom: 10px;
}
.sala-media-view {
    position: relative;
    width: 100%;
    min-height: 220px;
    border-radius: 18px;
    overflow: hidden;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(120, 80, 30, .2);
}
.sala-media-view img {
    width: 100%;
    height: 100%;
    min-height: 220px;
    object-fit: contain;
    display: block;
    background: #fff8e7;
}
.sala-media-view iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    min-height: 220px;
    border: 0;
    display: block;
    background: #000;
}
.sala-media-botones {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 12px;
}
.sala-media-nota {
    margin-top: 10px;
    font-size: 13px;
    color: #6b5a48;
    line-height: 1.35;
}
@media (min-width: 1000px) {
    .sala-experiencia {
        grid-template-columns: minmax(240px, 330px) minmax(340px, 1fr) minmax(320px, 520px);
        align-items: stretch;
    }
}
@media (max-width: 760px) {
    .sala-media-botones { grid-template-columns: 1fr; }
}