/* =====================================================================
   Biblos · Skins
   Cada skin es un bloque de variables. Para crear una nueva, copia un
   bloque, cambia el nombre en [data-skin="..."] y ajusta los valores.
   ===================================================================== */

/* ---------- Scriptorium (madera, velas y oro) ---------- */
:root, [data-skin="scriptorium"] {
  --fuente-titulo: 'Cinzel Decorative', Georgia, serif;
  --fuente-texto: 'Crimson Text', Georgia, serif;

  --fondo: #0a0806;
  --texto: #eecfa1;
  --oro: #c5a059;
  --oro-tenue: #8a7341;
  --tinta: #1a120b;
  --tinta-suave: #5d4037;
  --rojo: #740001;
  --rojo-tinta: #740001;
  --verde-tinta: #1a472a;
  --linea: rgba(93, 64, 55, .35);

  --ambiente: radial-gradient(circle at 50% 30%, #1f1209 0%, #000 100%);
  --ambiente-deseados: radial-gradient(circle at 50% 30%, #09121f 0%, #000 100%);
  --velas: radial-gradient(circle at 50% 60%, transparent 40%, rgba(0,0,0,.5) 90%);

  --pared: linear-gradient(rgba(0,0,0,.68), rgba(0,0,0,.68)), url('../assets/scriptorium/pared.webp');
  --pared-tamano: auto, 420px auto;
  --pilar: url('../assets/scriptorium/pilar.webp') repeat-y;
  --balda: url('../assets/scriptorium/balda.webp') repeat-x;
  --cabecera-fondo: url('../assets/scriptorium/cabecera.webp') top center / auto 100% repeat-x, #2a1a12;
  --cenefa: url('../assets/scriptorium/cenefa.webp') bottom center / auto 100% repeat-x;
  --riel: url('../assets/scriptorium/riel.webp') center bottom repeat-x;
  --piedra: url('../assets/scriptorium/piedra.webp') repeat-x;
  --tapa: url('../assets/scriptorium/tapa.webp');
  --tapa-texto: #f3dcae;
  --tapa-relleno: 14% 26% 14% 12%;
  --contador: #c9a96e;
  --buscador-fondo: url('../assets/scriptorium/pergamino.webp') center / 100% 100% no-repeat;
  --buscador-texto: #3e2723;
  --pergamino: #e3dace linear-gradient(135deg, rgba(255,255,255,.18), rgba(120,90,60,.12));

  --placa-fondo: linear-gradient(#d4af37 0%, #a67c00 50%, #8a6200 100%);
  --placa-borde: #5d4037;
  --placa-sombra: 0 1px 3px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.4), inset 0 0 10px rgba(0,0,0,.2);
  --placa-texto: #3e2723;
  --placa-relieve: 0 1px 0 rgba(255,255,255,.4);

  --panel-fondo: #1a100a;
  --panel-borde: #5d4037;
  --panel-texto: #eecfa1;
  --menu-fondo: #1a100a;
  --icono-cabecera: #8a7341;
  --campo-oscuro-fondo: #0a0503;
  --campo-oscuro-borde: #3e2723;
  --campo-oscuro-texto: #eecfa1;
  --boton-fondo: linear-gradient(#2c1a12, #1a0f0a);
  --boton-texto: #c5a059;
  --boton-borde: #5d4037;
  --pestana-activa: #f3dcae;
  --pestana-inactiva: #8d6e63;
  --scroll-pista: #1a100a;
  --scroll-pulgar: linear-gradient(to right, #5d4037, #8a7341, #5d4037);
}

/* ---------- Minimal (claro, limpio y rápido) ---------- */
[data-skin="minimal"] {
  --fuente-titulo: 'Crimson Text', Georgia, serif;
  --fuente-texto: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  --fondo: #f6f3ee;
  --texto: #2b2622;
  --oro: #8c5a2b;
  --oro-tenue: #9a8877;
  --tinta: #2b2622;
  --tinta-suave: #6d625a;
  --rojo: #9b2c2c;
  --rojo-tinta: #8c5a2b;
  --verde-tinta: #2f6b45;
  --linea: rgba(43, 38, 34, .15);

  --ambiente: #f6f3ee;
  --ambiente-deseados: #eef2f6;
  --velas: none;

  --pared: #f6f3ee;
  --pared-tamano: auto;
  --pilar: transparent;
  --pilar-ancho: 8px;
  --pilar-ancho-movil: 0px;
  --balda: linear-gradient(#e7dfd4, #ddd2c4);
  --balda-alto: 42px;
  --balda-borde-sup: 1px solid #cfc3b3;
  --balda-sombra: linear-gradient(rgba(0,0,0,.06), transparent);
  --cabecera-fondo: #fffdf9;
  --cenefa: linear-gradient(transparent calc(100% - 1px), #e2d9cc calc(100% - 1px));
  --riel: transparent;
  --piedra: #fffdf9;
  --tapa: linear-gradient(160deg, #c9b8a3, #9d8670);
  --tapa-texto: #fff;
  --contador: #9a8877;
  --etiqueta-fondo: transparent;
  --etiqueta-texto: #fff;
  --etiqueta-borde: 0;
  --etiqueta-sombra: none;
  --etiqueta-arriba: 28%;
  --etiqueta-izq: 8%;
  --etiqueta-der: 8%;
  --buscador-fondo: #f1ebe3;
  --buscador-texto: #2b2622;
  --pergamino: #fffdf9;

  --placa-fondo: transparent;
  --placa-borde: transparent;
  --placa-sombra: none;
  --placa-texto: #4a4039;
  --placa-relieve: none;
  --placa-clavo: transparent;

  --panel-fondo: #fffdf9;
  --panel-borde: #d8cdbf;
  --panel-texto: #2b2622;
  --menu-fondo: #fffdf9;
  --icono-cabecera: #6d625a;
  --campo-oscuro-fondo: #fff;
  --campo-oscuro-borde: #d8cdbf;
  --campo-oscuro-texto: #2b2622;
  --boton-fondo: #8c5a2b;
  --boton-texto: #fff;
  --boton-borde: #8c5a2b;
  --pestana-activa: #8c5a2b;
  --pestana-inactiva: #9a8877;
  --scroll-pista: #f1ebe3;
  --scroll-pulgar: #cfc3b3;
}
[data-skin="minimal"] .cabecera { box-shadow: 0 1px 0 #e2d9cc; padding-bottom: 1rem; }
[data-skin="minimal"] .cabecera::after { height: 1px; }
[data-skin="minimal"] .cabecera h1 { text-shadow: none; }
[data-skin="minimal"] .buscador { border-radius: 99px; filter: none; padding: 0 16px; height: 40px; }
[data-skin="minimal"] .estanteria-marco, [data-skin="minimal"] .pilar { box-shadow: none; }
[data-skin="minimal"] .balda { box-shadow: none; border-bottom: 0; }
[data-skin="minimal"] .portada { border-radius: 3px; box-shadow: 0 2px 6px rgba(0,0,0,.18); border-color: transparent; }
[data-skin="minimal"] .libro:hover .portada { box-shadow: 0 12px 24px rgba(0,0,0,.2); border-color: var(--brillo-libro); }
[data-skin="minimal"] .chispas, [data-skin="minimal"] .velas { display: none; }
[data-skin="minimal"] .placa span { text-transform: none; font-family: var(--fuente-texto); font-weight: 600; font-size: .7rem; }
[data-skin="minimal"] .placa.brilla span { color: var(--oro); text-shadow: none; }
[data-skin="minimal"] .pie-cuerpo { box-shadow: 0 -1px 0 #e2d9cc; }
[data-skin="minimal"] .medallon img { display: none; }
[data-skin="minimal"] .medallon { background: var(--oro); color: #fff; display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; top: -1.4rem; filter: drop-shadow(0 6px 10px rgba(0,0,0,.25)); }
[data-skin="minimal"] .medallon .icono-medallon { display: block; width: 1.8rem; height: 1.8rem; }
[data-skin="minimal"] .fondo-modal { background: rgba(40,30,20,.45); }
[data-skin="minimal"] .pergamino { border: 1px solid #d8cdbf; border-radius: 10px; box-shadow: 0 20px 60px rgba(0,0,0,.25); }
[data-skin="minimal"] .tarjeta-login { border: 1px solid #d8cdbf; border-radius: 10px; }
[data-skin="minimal"] .tarjeta-login input { background: #f6f3ee; }
[data-skin="minimal"] .pantalla-centro { background: rgba(246,243,238,.92); }
[data-skin="minimal"] .aviso { background: #fffdf9; color: #2b2622; border-color: #d8cdbf; box-shadow: 0 6px 20px rgba(0,0,0,.12); }
[data-skin="minimal"] .aviso.ok { color: #2f6b45; border-color: #2f6b45; }
[data-skin="minimal"] .aviso.error { color: #9b2c2c; border-color: #9b2c2c; }
[data-skin="minimal"] .cabecera .contador { text-shadow: none; }
[data-skin="minimal"] .modos button[aria-pressed="true"] { background: #fff; }

/* ---------- Viñeta (cómic pop-art) ---------- */
@font-face { font-family: 'Bangers'; font-display: swap; src: url('../assets/fuentes/bangers.woff') format('woff'); }
[data-skin="vineta"] {
  --fuente-titulo: 'Bangers', Impact, 'Arial Black', sans-serif;
  --fuente-texto: 'Trebuchet MS', 'Segoe UI', system-ui, sans-serif;
  --tinta-negra: #111;
  --fondo: #fff7d6;
  --texto: #111;
  --oro: #e4002b;
  --oro-tenue: #111;
  --tinta: #111;
  --tinta-suave: #3a3a3a;
  --rojo: #e4002b;
  --rojo-tinta: #e4002b;
  --verde-tinta: #00994d;
  --linea: rgba(0,0,0,.35);
  --ambiente: #fff7d6;
  --ambiente-deseados: #e3f6ff;
  --velas: none;
  --trama: radial-gradient(rgba(0,0,0,.13) 1.2px, transparent 1.6px) 0 0 / 9px 9px;
  --pared: var(--trama), #fff3c4;
  --pared-tamano: auto;
  --pilar: repeating-linear-gradient(0deg, #111 0 6px, #ffd400 6px 30px);
  --pilar-ancho: 18px;
  --pilar-ancho-movil: 8px;
  --balda: #ffd400;
  --balda-alto: 48px;
  --balda-borde-sup: 4px solid #111;
  --balda-sombra: linear-gradient(rgba(0,0,0,.18), transparent);
  --cabecera-fondo: radial-gradient(rgba(0,0,0,.18) 1.4px, transparent 1.8px) 0 0 / 8px 8px, #e4002b;
  --cenefa: repeating-linear-gradient(90deg, #111 0 14px, #ffd400 14px 28px) bottom / 100% 10px no-repeat;
  --riel: repeating-linear-gradient(90deg, #111 0 14px, #ffd400 14px 28px);
  --piedra: radial-gradient(rgba(0,0,0,.15) 1.4px, transparent 1.8px) 0 0 / 8px 8px, #00a3e0;
  --tapa: radial-gradient(rgba(0,0,0,.22) 1.4px, transparent 1.8px) 0 0 / 7px 7px, #00a3e0;
  --tapa-texto: #111;
  --etiqueta-fondo: #fff;
  --etiqueta-texto: #111;
  --etiqueta-borde: 3px solid #111;
  --etiqueta-sombra: 3px 3px 0 #111;
  --etiqueta-izq: 10%; --etiqueta-der: 10%; --etiqueta-arriba: 10%;
  --buscador-fondo: #fff;
  --buscador-texto: #111;
  --pergamino: #fff;
  --placa-fondo: #fff;
  --placa-borde: #111;
  --placa-sombra: 3px 3px 0 #111;
  --placa-texto: #111;
  --placa-relieve: none;
  --placa-clavo: transparent;
  --panel-fondo: #fff;
  --panel-borde: #111;
  --panel-texto: #111;
  --menu-fondo: #fff;
  --icono-cabecera: #fff;
  --campo-oscuro-fondo: #fff;
  --campo-oscuro-borde: #111;
  --campo-oscuro-texto: #111;
  --boton-fondo: #ffd400;
  --boton-texto: #111;
  --boton-borde: #111;
  --pestana-activa: #fff;
  --pestana-inactiva: rgba(255,255,255,.65);
  --lomo-textura: radial-gradient(rgba(0,0,0,.18) 1.2px, transparent 1.6px) 0 0 / 6px 6px;
  --lomo-banda: #111;
  --scroll-pista: #fff3c4;
  --scroll-pulgar: #111;
  --contador: #fff;
}
[data-skin="vineta"] .cabecera { border-bottom: 4px solid #111; padding-bottom: 1.4rem; }
[data-skin="vineta"] .cabecera::after { height: 10px; }
[data-skin="vineta"] .cabecera h1 { color: #ffd400; font-size: 1.9rem; letter-spacing: .04em; text-shadow: 3px 3px 0 #111, -1px -1px 0 #111, 1px -1px 0 #111, -1px 1px 0 #111; }
[data-skin="vineta"] .cabecera .contador { font-family: var(--fuente-titulo); font-size: .85rem; letter-spacing: .06em; text-shadow: 1px 1px 0 #111; }
[data-skin="vineta"] .buscador { border: 3px solid #111; border-radius: 22px; box-shadow: 3px 3px 0 #111; filter: none; height: 42px; padding: 0 18px; }
[data-skin="vineta"] .campo-oscuro, [data-skin="vineta"] .selector-vista { border-width: 2px; box-shadow: 2px 2px 0 #111; font-family: var(--fuente-texto); font-size: .8rem; }
[data-skin="vineta"] .estanteria-marco { box-shadow: none; border-left: 4px solid #111; border-right: 4px solid #111; }
[data-skin="vineta"] .pilar { box-shadow: none; }
[data-skin="vineta"] .balda { border-bottom: 4px solid #111; box-shadow: none; }
[data-skin="vineta"] .placa { border-width: 2px; border-radius: 14px; }
[data-skin="vineta"] .placa::after { /* rabito del bocadillo */
  content: ''; top: -9px; left: 50%; right: auto; width: 12px; height: 9px; border-radius: 0; opacity: 1; transform: translateX(-50%);
  background: #111; clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
[data-skin="vineta"] .placa::before { display: none; }
[data-skin="vineta"] .placa span { font-family: var(--fuente-titulo); font-weight: 400; font-size: .72rem; letter-spacing: .03em; }
[data-skin="vineta"] .placa.brilla { background: #ffd400; }
[data-skin="vineta"] .placa.brilla span { color: #111; text-shadow: none; }
[data-skin="vineta"] .portada { border: 3px solid #111; border-radius: 2px; box-shadow: 5px 5px 0 #111; }
[data-skin="vineta"] .libro:hover .portada { box-shadow: 9px 9px 0 #111; border-color: #111; }
[data-skin="vineta"] .libro::after { display: none; }
[data-skin="vineta"] .libro:hover::before { /* ¡POW! */
  content: '¡POW!'; position: absolute; z-index: 7; top: -18px; right: -14px; padding: .55rem .55rem; transform: rotate(12deg);
  font-family: var(--fuente-titulo); font-size: 1.05rem; color: #e4002b; background: #ffd400; border: 3px solid #111;
  clip-path: polygon(50% 0, 61% 30%, 98% 20%, 72% 47%, 100% 70%, 64% 70%, 58% 100%, 44% 74%, 10% 92%, 28% 62%, 0 42%, 34% 36%, 22% 6%);
}
[data-skin="vineta"] .etiqueta-tapa b { font-family: var(--fuente-titulo); font-weight: 400; font-size: .78rem; letter-spacing: .02em; }
[data-skin="vineta"] .chispas, [data-skin="vineta"] .velas, [data-skin="vineta"] .medallon img { display: none; }
[data-skin="vineta"] .medallon { display: flex; align-items: center; justify-content: center; width: 70px; height: 70px; top: -1.6rem; background: #ffd400; color: #111; border: 4px solid #111; box-shadow: 4px 4px 0 #111; filter: none; }
[data-skin="vineta"] .medallon .icono-medallon { display: block; width: 2rem; height: 2rem; stroke-width: 3; }
[data-skin="vineta"] .pie-cuerpo { border-top: 4px solid #111; box-shadow: none; }
[data-skin="vineta"] .pie-riel { height: 10px; top: -10px; }
[data-skin="vineta"] .pestana { font-family: var(--fuente-titulo); font-size: .9rem; font-weight: 400; letter-spacing: .06em; text-shadow: 1px 1px 0 #111; }
[data-skin="vineta"] .pergamino, [data-skin="vineta"] .tarjeta-login { border: 4px solid #111; border-radius: 4px; box-shadow: 8px 8px 0 #111; }
[data-skin="vineta"] .pergamino-cabecera { background: #ffd400; border-bottom: 3px solid #111; }
[data-skin="vineta"] .pergamino-cabecera h2 { font-weight: 400; font-size: 1.5rem; letter-spacing: .04em; color: #111; }
[data-skin="vineta"] .boton { border-width: 2px; box-shadow: 3px 3px 0 #111; font-family: var(--fuente-titulo); font-weight: 400; font-size: .95rem; letter-spacing: .05em; }
[data-skin="vineta"] .boton:hover { transform: translate(-1px, -1px); box-shadow: 4px 4px 0 #111; }
[data-skin="vineta"] .boton.secundario { background: #fff; color: #111; border-color: #111; }
[data-skin="vineta"] .boton.peligro { background: #e4002b; color: #fff; }
[data-skin="vineta"] .bloque, [data-skin="vineta"] .cifra { border: 2px solid #111; background: #fff; box-shadow: 3px 3px 0 #111; }
[data-skin="vineta"] .pantalla-centro { background: var(--trama), rgba(255,247,214,.94); }
[data-skin="vineta"] .tarjeta-login h1 { color: #e4002b; font-weight: 400; font-size: 2.6rem; text-shadow: 3px 3px 0 #111; }
[data-skin="vineta"] .tarjeta-login input { background: #fff3c4; border: 2px solid #111; }
[data-skin="vineta"] .fondo-modal { background: rgba(0,0,0,.55); }
[data-skin="vineta"] .aviso { background: #fff; color: #111; border: 3px solid #111; box-shadow: 4px 4px 0 #111; font-family: var(--fuente-titulo); font-size: .95rem; letter-spacing: .03em; }
[data-skin="vineta"] .aviso.ok { background: #d9ffe9; }
[data-skin="vineta"] .aviso.error { background: #ffe0e0; }
[data-skin="vineta"] .lomo { border: 2px solid #111; box-shadow: 3px 0 0 #111; border-radius: 2px; }
[data-skin="vineta"] .lomo-titulo { font-family: var(--fuente-titulo); font-weight: 400; font-size: .8rem; text-shadow: none; }
[data-skin="vineta"] .lomo:not(.claro) .lomo-titulo { color: #fff; -webkit-text-stroke: .4px #111; }
[data-skin="vineta"] .rotulo span { font-family: var(--fuente-titulo); font-weight: 400; font-size: 1.3rem; border-width: 3px; border-radius: 16px; }
[data-skin="vineta"] .tabla-libros th { background: #111; color: #ffd400; font-family: var(--fuente-titulo); font-weight: 400; font-size: .9rem; }
[data-skin="vineta"] .tabla-scroll { border: 3px solid #111; box-shadow: 5px 5px 0 #111; }
[data-skin="vineta"] .barra-seleccion { border: 3px solid #111; box-shadow: 5px 5px 0 #111; }
[data-skin="vineta"] .barra-seleccion b { color: #111; }
[data-skin="vineta"] .franja-sin-red { background: #111; color: #ffd400; }

/* ---------- Pixel (videojuego retro de 8 bits) ---------- */
@font-face { font-family: 'Press Start 2P'; font-display: swap; src: url('../assets/fuentes/press-start-2p.woff') format('woff'); }
[data-skin="pixel"] {
  --fuente-titulo: 'Press Start 2P', 'Courier New', monospace;
  --fuente-texto: 'Courier New', ui-monospace, monospace;
  --px: #0d0a1a;
  --fondo: #1b1530;
  --texto: #f4f4f4;
  --oro: #ffcd38;
  --oro-tenue: #b9a3ff;
  --tinta: #f4f4f4;
  --tinta-suave: #b9a3ff;
  --rojo: #ff4f6d;
  --rojo-tinta: #ffcd38;
  --verde-tinta: #3ad16b;
  --linea: rgba(185,163,255,.35);
  --ambiente: #1b1530;
  --ambiente-deseados: #10233a;
  --velas: none;
  --pared: repeating-linear-gradient(0deg, transparent 0 15px, rgba(0,0,0,.25) 15px 16px), repeating-linear-gradient(90deg, transparent 0 31px, rgba(0,0,0,.25) 31px 32px), #2b2150;
  --pared-tamano: auto;
  --pilar: repeating-linear-gradient(0deg, #6b4a2b 0 8px, #8a6238 8px 16px, #5a3c22 16px 24px);
  --pilar-ancho: 24px;
  --pilar-ancho-movil: 10px;
  --balda: repeating-linear-gradient(90deg, #8a6238 0 24px, #7a5530 24px 26px), #8a6238;
  --balda-alto: 32px;
  --balda-borde-sup: 4px solid #c48a4a;
  --balda-sombra: repeating-linear-gradient(180deg, rgba(0,0,0,.6) 0 4px, transparent 4px 8px);
  --cabecera-fondo: #2b2150;
  --cenefa: repeating-linear-gradient(90deg, #ffcd38 0 8px, #ff4f6d 8px 16px, #3ad16b 16px 24px, #4fc3ff 24px 32px) bottom / 100% 6px no-repeat;
  --riel: repeating-linear-gradient(90deg, #ffcd38 0 8px, #ff4f6d 8px 16px, #3ad16b 16px 24px, #4fc3ff 24px 32px);
  --piedra: repeating-linear-gradient(90deg, #3a2e6b 0 16px, #33285f 16px 32px);
  --tapa: repeating-linear-gradient(0deg, transparent 0 6px, rgba(0,0,0,.15) 6px 8px), #4f3a9e;
  --tapa-texto: #ffcd38;
  --etiqueta-fondo: #0d0a1a;
  --etiqueta-texto: #ffcd38;
  --etiqueta-borde: 3px solid #ffcd38;
  --etiqueta-sombra: none;
  --etiqueta-izq: 10%; --etiqueta-der: 10%;
  --buscador-fondo: #0d0a1a;
  --buscador-texto: #ffcd38;
  --pergamino: #241c45;
  --placa-fondo: #0d0a1a;
  --placa-borde: #ffcd38;
  --placa-sombra: none;
  --placa-texto: #ffcd38;
  --placa-relieve: none;
  --placa-clavo: #ffcd38;
  --panel-fondo: #0d0a1a;
  --panel-borde: #ffcd38;
  --panel-texto: #f4f4f4;
  --menu-fondo: #0d0a1a;
  --icono-cabecera: #b9a3ff;
  --campo-oscuro-fondo: #0d0a1a;
  --campo-oscuro-borde: #b9a3ff;
  --campo-oscuro-texto: #f4f4f4;
  --boton-fondo: #ffcd38;
  --boton-texto: #0d0a1a;
  --boton-borde: #0d0a1a;
  --pestana-activa: #ffcd38;
  --pestana-inactiva: #b9a3ff;
  --lomo-textura: repeating-linear-gradient(0deg, transparent 0 6px, rgba(0,0,0,.18) 6px 8px);
  --lomo-banda: #0d0a1a;
  --scroll-pista: #0d0a1a;
  --scroll-pulgar: #ffcd38;
  --contador: #3ad16b;
}
[data-skin="pixel"] * { border-radius: 0 !important; }
[data-skin="pixel"] .cabecera { box-shadow: 0 6px 0 #0d0a1a; padding-bottom: 1.3rem; }
[data-skin="pixel"] .cabecera::after { height: 6px; }
[data-skin="pixel"] .cabecera h1 { font-size: .95rem; line-height: 1.6; color: #ffcd38; text-shadow: 3px 3px 0 #ff4f6d; }
[data-skin="pixel"] .cabecera .contador { font-size: .5rem; margin-top: .3rem; text-shadow: none; }
[data-skin="pixel"] .buscador { border: 3px solid #ffcd38; filter: none; height: 40px; padding: 0 12px; }
[data-skin="pixel"] .buscador input { font-family: var(--fuente-titulo); font-size: .55rem; }
[data-skin="pixel"] .campo-oscuro { font-family: var(--fuente-texto); font-size: .8rem; border-width: 2px; }
[data-skin="pixel"] .estanteria-marco { box-shadow: none; }
[data-skin="pixel"] .pilar { box-shadow: inset -4px 0 0 rgba(0,0,0,.35); }
[data-skin="pixel"] .balda { box-shadow: 0 4px 0 #3a2715; border-bottom: 0; }
[data-skin="pixel"] .placa { border-width: 2px; height: 30px; }
[data-skin="pixel"] .placa::before, [data-skin="pixel"] .placa::after { width: 4px; height: 4px; }
[data-skin="pixel"] .placa span { font-size: .38rem; line-height: 1.5; }
[data-skin="pixel"] .placa.brilla { background: #ffcd38; }
[data-skin="pixel"] .placa.brilla span { color: #0d0a1a; text-shadow: none; }
[data-skin="pixel"] .portada { border: 4px solid #0d0a1a; box-shadow: 4px 4px 0 rgba(0,0,0,.6); image-rendering: auto; }
[data-skin="pixel"] .libro:hover { transform: translateY(-10px); }
[data-skin="pixel"] .libro:hover .portada { box-shadow: 0 0 0 3px #ffcd38, 6px 6px 0 rgba(0,0,0,.6); border-color: #0d0a1a; }
[data-skin="pixel"] .libro::after { display: none; }
[data-skin="pixel"] .etiqueta-tapa b { font-size: .4rem; line-height: 1.6; }
[data-skin="pixel"] .etiqueta-tapa small { font-family: var(--fuente-texto); font-size: .6rem; font-style: normal; color: #f4f4f4; }
[data-skin="pixel"] .chispas, [data-skin="pixel"] .medallon img { display: none; }
[data-skin="pixel"] .medallon { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; top: -1.4rem; background: #ff4f6d; color: #fff; border: 4px solid #0d0a1a; box-shadow: inset -6px -6px 0 rgba(0,0,0,.25), 4px 4px 0 #0d0a1a; filter: none; }
[data-skin="pixel"] .medallon .icono-medallon { display: block; width: 1.8rem; height: 1.8rem; stroke-width: 3; }
[data-skin="pixel"] .pie-riel { height: 6px; top: -6px; filter: none; }
[data-skin="pixel"] .pie-cuerpo { box-shadow: none; }
[data-skin="pixel"] .pestana { font-size: .45rem; line-height: 1.6; }
[data-skin="pixel"] .pergamino, [data-skin="pixel"] .tarjeta-login { border: 4px solid #ffcd38; box-shadow: 8px 8px 0 #0d0a1a; }
[data-skin="pixel"] .pergamino-cabecera { background: #0d0a1a; }
[data-skin="pixel"] .pergamino-cabecera h2 { font-size: .75rem; line-height: 1.6; color: #ffcd38; }
[data-skin="pixel"] .tarjeta-login h1 { font-size: 1.4rem; line-height: 1.6; color: #ffcd38; text-shadow: 3px 3px 0 #ff4f6d; }
[data-skin="pixel"] .tarjeta-login input { background: #0d0a1a; border: 2px solid #b9a3ff; }
[data-skin="pixel"] .tarjeta-login label, [data-skin="pixel"] .campo label, [data-skin="pixel"] .bloque h3, [data-skin="pixel"] details.bloque > summary,
[data-skin="pixel"] .menu-ajustes h3 { font-size: .45rem; line-height: 1.7; }
[data-skin="pixel"] .boton { font-size: .5rem; line-height: 1.6; border-width: 3px; box-shadow: inset -4px -4px 0 rgba(0,0,0,.25), 3px 3px 0 #0d0a1a; }
[data-skin="pixel"] .boton.secundario { background: transparent; color: #f4f4f4; border-color: #b9a3ff; box-shadow: none; }
[data-skin="pixel"] .campo input, [data-skin="pixel"] .campo textarea, [data-skin="pixel"] .campo select { color: #f4f4f4; font-family: var(--fuente-texto); }
[data-skin="pixel"] .campo select option, [data-skin="pixel"] select option { background: #0d0a1a; color: #f4f4f4; }
[data-skin="pixel"] input.titulo-ficha { font-size: .8rem !important; line-height: 1.6; color: #ffcd38 !important; }
[data-skin="pixel"] .bloque, [data-skin="pixel"] .cifra { background: rgba(13,10,26,.5); border: 2px solid #4f3a9e; }
[data-skin="pixel"] .cifra b { font-size: 1rem; line-height: 1.8; }
[data-skin="pixel"] .pantalla-centro { background: rgba(13,10,26,.92); }
[data-skin="pixel"] .aviso { font-size: .5rem; line-height: 1.7; border-width: 3px; }
[data-skin="pixel"] .lomo { border: 3px solid #0d0a1a; box-shadow: none; }
[data-skin="pixel"] .lomo-titulo { font-size: .42rem; line-height: 1.4; text-shadow: none; }
[data-skin="pixel"] .rotulo span { font-size: .6rem; line-height: 1.6; border-width: 3px; }
[data-skin="pixel"] .tabla-libros { font-family: var(--fuente-texto); }
[data-skin="pixel"] .tabla-libros th { font-size: .42rem; line-height: 1.6; }
[data-skin="pixel"] .tabla-libros .col-titulo b { color: #ffcd38; }
[data-skin="pixel"] .resultado, [data-skin="pixel"] .saga-tarjeta, [data-skin="pixel"] .siguiente, [data-skin="pixel"] .registro, [data-skin="pixel"] .color-fila,
[data-skin="pixel"] .enlaces-compra a, [data-skin="pixel"] .chip, [data-skin="pixel"] .candidata { background: rgba(13,10,26,.5); color: #f4f4f4; }
[data-skin="pixel"] .buscar-fila input, [data-skin="pixel"] .lectura-actual input, [data-skin="pixel"] .objetivo input { background: #0d0a1a; color: #f4f4f4; border-color: #b9a3ff; }
[data-skin="pixel"] .franja-sin-red { background: #ff4f6d; color: #0d0a1a; font-family: var(--fuente-titulo); font-size: .45rem; line-height: 1.8; }
[data-skin="vineta"] .selector-vista button { color: #111; }
[data-skin="vineta"] .selector-vista button[aria-pressed="true"] { background: #e4002b; color: #fff; }
[data-skin="vineta"] .boton-icono:hover { color: #ffd400; background: rgba(0,0,0,.15); }