/* Librero 3D de Legalmente Claros — compartido por index.html y panel.html */
/* que el atributo hidden oculte de verdad (lo necesitan el modal y el botón del librero) */
[hidden] { display:none !important; }
.lix:not(.show) { pointer-events:none; }
/* ── Librero 3D ── */
:root {
  --wood-1:#5a2416; --wood-2:#7a3420; --wood-3:#3a160d; --wood-4:#2a0f08;
  --paper-lib:#f4efe2; --gold-dim-lib:#9c7d1c; --gold-soft-lib:rgba(201,162,39,.30);
  --f-display-lib:"Newsreader", Georgia, serif;
}
.lib-wrap { display:flex; flex-direction:column; align-items:center; gap:28px; }
.lib-case {
  position:relative; width:min(100%,820px); padding:22px 22px 0;
  border-radius:6px 6px 2px 2px;
  background:
    repeating-linear-gradient(92deg,rgba(0,0,0,0) 0 7px,rgba(0,0,0,.09) 7px 8px,rgba(255,200,160,.04) 8px 15px),
    linear-gradient(180deg,var(--wood-2),var(--wood-1) 40%,var(--wood-3));
  box-shadow:0 30px 60px -20px rgba(10,5,0,.6),inset 0 0 0 1px rgba(255,210,170,.08),inset 0 2px 0 rgba(255,210,170,.18);
}
.lib-case::before {
  content:""; position:absolute; left:-14px; right:-14px; top:-16px; height:18px;
  border-radius:4px 4px 2px 2px;
  background:linear-gradient(180deg,#8a3d25,var(--wood-1) 60%,var(--wood-3));
  box-shadow:0 6px 10px -4px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,215,180,.25);
}
.lib-case::after {
  content:""; position:absolute; left:-8px; right:-8px; bottom:-20px; height:20px;
  border-radius:0 0 4px 4px;
  background:linear-gradient(180deg,var(--wood-3),var(--wood-4));
  box-shadow:0 14px 24px -8px rgba(0,0,0,.45);
}
.lib-shelf {
  position:relative; height:280px;
  background:
    linear-gradient(90deg,rgba(0,0,0,.55),rgba(0,0,0,.15) 10%,rgba(0,0,0,.15) 90%,rgba(0,0,0,.55)),
    linear-gradient(180deg,#24100a,#3b1a0f 70%,#2a120a);
  box-shadow:inset 0 18px 30px -10px rgba(0,0,0,.7);
  perspective:1300px; perspective-origin:50% 35%;
  display:flex; align-items:flex-end; justify-content:center; gap:3px; padding:0 18px;
}
.lib-board {
  height:20px; margin:0 -22px; position:relative; z-index:3;
  background:repeating-linear-gradient(90deg,rgba(0,0,0,0) 0 40px,rgba(0,0,0,.08) 40px 42px),
    linear-gradient(180deg,#9a4a2c,var(--wood-2) 25%,var(--wood-1) 70%,var(--wood-3));
  box-shadow:0 8px 12px -6px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,220,190,.3);
}
/* Libro */
.lbook {
  --bw:54px; --bh:230px; --bd:164px; --bc:#0f2340; --bc2:#0a1628; --bfs:12.5px;
  position:relative; width:var(--bw); height:var(--bh); flex:0 0 auto;
  transform-style:preserve-3d; cursor:pointer; border:0; padding:0; background:none; color:inherit; z-index:1; outline:none;
}
.lbody {
  position:absolute; inset:0; transform-style:preserve-3d; pointer-events:none;
  transform:translate3d(0,0,0) rotateY(0deg);
  transition:transform .55s cubic-bezier(.16,.84,.3,1); will-change:transform;
}
.lface { position:absolute; top:0; backface-visibility:hidden; }
.lspine {
  left:0; width:var(--bw); height:var(--bh); transform:translateZ(calc(var(--bd)/2));
  /* Cuero: color base + volumen redondeado del lomo + brillo suave arriba */
  background:
    linear-gradient(90deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.22) 7%, rgba(255,235,210,.13) 24%, rgba(255,235,210,.06) 40%, rgba(0,0,0,.05) 60%, rgba(0,0,0,.32) 86%, rgba(0,0,0,.66) 100%),
    linear-gradient(180deg, rgba(255,255,255,.07) 0%, rgba(0,0,0,0) 12%, rgba(0,0,0,0) 85%, rgba(0,0,0,.28) 100%),
    var(--bc);
  border-radius:5px 5px 3px 3px / 3px 3px 2px 2px;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.45), inset 0 1px 1px rgba(255,240,220,.18), inset 0 -2px 3px rgba(0,0,0,.35);
  display:flex; flex-direction:column; align-items:center; justify-content:space-between; padding:14px 0 12px;
  overflow:hidden;
}
/* Grano del cuero (ruido fino) y desgaste en los bordes */
.lspine::before {
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit; mix-blend-mode:soft-light; opacity:.9;
  background:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' seed='7' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncA type='table' tableValues='0 .9'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='p'><feTurbulence type='turbulence' baseFrequency='.22' numOctaves='2' seed='3'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncA type='table' tableValues='0 .55'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23p)'/></svg>");
}
.lspine::after {
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  box-shadow: inset 2px 0 3px rgba(0,0,0,.35), inset -2px 0 3px rgba(0,0,0,.35);
}
/* Nervios: bandas en relieve con filetes dorados, como en una encuadernación real */
.lband {
  position:relative; z-index:1; width:100%; height:8px; flex-shrink:0;
  background: linear-gradient(180deg, rgba(0,0,0,.45) 0, rgba(255,240,220,.22) 18%, rgba(255,240,220,.08) 45%, rgba(0,0,0,.18) 70%, rgba(0,0,0,.55) 100%);
  box-shadow: 0 -3px 0 -2px #b8902c, 0 3px 0 -2px #b8902c;
}
.lband-b { margin-top:4px; }
.lspine .ltitle {
  position:relative; z-index:1;
  writing-mode:vertical-rl; transform:rotate(180deg);
  font-family:var(--f-display-lib); font-weight:700; font-size:var(--bfs); line-height:1.15; letter-spacing:.08em; text-transform:uppercase;
  white-space:nowrap; flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.12em;
  overflow:hidden; max-height:calc(var(--bh) - 84px); margin:6px 0;
  /* Dorado al fuego: degradado metálico hundido en el cuero */
  color:#e7c770;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.75)) drop-shadow(0 -1px 0 rgba(255,236,190,.12));
}
/* Cada renglón lleva su propio brillo metálico (si fuera uno solo, el segundo renglón saldría opaco) */
.lspine .ltitle > span {
  display:block;
  background: linear-gradient(90deg, #8a6a1c 0%, #f3dc8e 34%, #fff3c4 50%, #d4ad45 68%, #8a6a1c 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.lspine .lmark {
  position:relative; z-index:1; font-family:var(--f-display-lib); font-style:italic; font-weight:600; font-size:13px;
  background: linear-gradient(180deg,#f6e3a1,#c9a227 55%,#8c6a12); -webkit-background-clip:text; background-clip:text; color:transparent;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.7));
}
.lcover {
  width:var(--bd); height:var(--bh); left:calc((var(--bw) - var(--bd)) / 2);
  transform:rotateY(-90deg) translateZ(calc(var(--bw)/2));
  background:linear-gradient(100deg,rgba(0,0,0,.35),rgba(255,255,255,.06) 12%,rgba(0,0,0,.12) 100%),var(--bc2);
  border-radius:2px 4px 4px 2px; padding:10px;
}
.lframe {
  height:100%; border:1px solid var(--gold-dim-lib); outline:1px solid var(--gold-soft-lib); outline-offset:-5px;
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:7px; padding:12px 10px 10px;
}
.lbrand { font-family:var(--sans); font-weight:600; font-size:6.5px; letter-spacing:.24em; color:var(--gold); text-transform:uppercase; }
.ljudge {
  width:100%; flex:1; min-height:0; border:1px dashed var(--gold-dim-lib); border-radius:2px;
  display:grid; place-items:center; background:rgba(0,0,0,.18);
  color:var(--gold-dim-lib); font-size:7px; letter-spacing:.12em; text-transform:uppercase; line-height:1.6; padding:4px; text-align:center;
}
.lct { font-family:var(--f-display-lib); font-weight:700; font-size:14px; line-height:1.1; color:var(--gold); }
.ldoc { font-size:8px; color:#e9dfc4; letter-spacing:.04em; }
.lpages {
  width:var(--bd); height:calc(var(--bh) - 6px); top:3px; left:calc((var(--bw) - var(--bd)) / 2);
  transform:rotateY(90deg) translateZ(calc(var(--bw)/2 - 2px));
  background:repeating-linear-gradient(0deg,var(--paper-lib) 0 2px,#d9cdb3 2px 3px);
}
.ltop {
  width:calc(var(--bw) - 4px); left:2px; height:var(--bd); top:calc(var(--bd) / -2);
  transform:rotateX(90deg);
  background:repeating-linear-gradient(90deg,#e8ddc6 0 2px,#cfc2a6 2px 3px);
}
.lcover,.lpages { opacity:0; transition:opacity .22s ease; }
.lbook.lift .lcover,.lbook.lift .lpages { opacity:1; transition-delay:.06s; }
.lbook.lift { z-index:10; }
.lbook.lift .lbody { transform:translate3d(0,-16px,150px) rotateY(58deg); }
.lib-shelf::after { content:""; position:absolute; inset:0; background:rgba(4,8,16,.55); opacity:0; transition:opacity .35s ease; z-index:5; pointer-events:none; }
.lib-shelf.has-lift::after { opacity:1; }
.lbook:focus-visible .lspine { box-shadow:0 0 0 2px var(--gold); }
/* Caption bajo el mueble */
.lib-caption { min-height:80px; display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; }
.lib-caption .lcname { font-family:var(--f-display-lib); font-weight:600; font-size:1.25rem; color:var(--navy); min-height:26px; }
.lib-caption .lcwho { font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--text-muted); min-height:14px; }
.lib-btn {
  font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; font-weight:700;
  height:36px; padding:0 18px; border-radius:999px; border:1px solid var(--gold);
  background:var(--gold); color:#0f2340; cursor:pointer; font-family:var(--sans); transition:opacity .2s;
}
.lib-btn:hover { opacity:.85; }
/* Modal índice */
.lix {
  position:fixed; inset:0; z-index:9800; display:grid; place-items:center;
  padding:24px 16px; background:rgba(5,10,20,.76); backdrop-filter:blur(5px);
  opacity:0; transition:opacity .35s ease; overflow:hidden;
}
.lix.show { opacity:1; }
.lix-stage { --lpw:min(42vw,390px); --lph:min(80vh,550px); perspective:2200px; position:relative; width:calc(var(--lpw)*2); height:var(--lph); max-width:100%; }
.lob { position:absolute; inset:0; transform-style:preserve-3d; transform:translate3d(-25%,30px,0) scale(.86); transition:transform .9s cubic-bezier(.2,.8,.2,1); }
.lix.open .lob { transform:translate3d(0,0,0) scale(1); }
.lpg { position:absolute; top:0; width:50%; height:100%; background:var(--paper-lib); color:#0f2340; overflow:hidden; }
.lpg-right { left:50%; border-radius:2px 6px 6px 2px; box-shadow:0 30px 60px -20px rgba(0,0,0,.6),inset 14px 0 18px -14px rgba(0,0,0,.35); }
.lleaf { position:absolute; top:0; left:50%; width:50%; height:100%; transform-style:preserve-3d; transform-origin:0 50%; transform:rotateY(0deg); transition:transform 1s cubic-bezier(.45,.05,.25,1) .15s; will-change:transform; }
.lix.open .lleaf { transform:rotateY(-180deg); }
.lleaf>div { position:absolute; inset:0; backface-visibility:hidden; border-radius:2px 6px 6px 2px; }
.lleaf-front { background:linear-gradient(100deg,rgba(0,0,0,.35),rgba(255,255,255,.06) 10%,rgba(0,0,0,.12)),var(--lix-c2,#0a1628); padding:16px; }
.lleaf-front .lframe { gap:14px; padding:20px 16px; }
.lleaf-front .lbrand { font-size:10px; }
.lleaf-front .lct { font-size:clamp(18px,2.6vw,26px); }
.lleaf-back { transform:rotateY(180deg); background:var(--paper-lib); border-radius:6px 2px 2px 6px; box-shadow:inset -14px 0 18px -14px rgba(0,0,0,.35); }
.lpg-in { height:100%; overflow-y:auto; overflow-x:hidden; padding:clamp(14px,2.8vw,32px); display:flex; flex-direction:column; gap:12px; overscroll-behavior:contain; }
.lix .lkick { font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-dim-lib); font-weight:600; }
.lix h2 { font-family:var(--f-display-lib); font-weight:700; font-size:clamp(18px,2.2vw,26px); line-height:1.1; margin:0; }
.lix .ldr { font-size:12.5px; color:#4d5b72; }
.lix .lorn { width:42px; height:2px; background:var(--gold); }
.lsum { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:1px; font-size:12px; }
.lsum li { display:flex; justify-content:space-between; gap:8px; padding:5px 0; border-bottom:1px solid rgba(15,35,64,.1); }
.lsum span:last-child { color:#5a6578; }
.ltabs-ix { display:flex; gap:4px; flex-wrap:wrap; }
.ltab-ix {
  font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:600;
  height:28px; padding:0 12px; border-radius:999px; border:1px solid rgba(15,35,64,.22);
  background:transparent; color:#0f2340; cursor:pointer; font-family:var(--sans); transition:background .18s,color .18s;
}
.ltab-ix:hover { border-color:#0f2340; }
.ltab-ix[aria-selected="true"] { background:#0f2340; color:var(--gold); border-color:#0f2340; }
.lphase-title { font-family:var(--f-display-lib); font-style:italic; font-weight:600; font-size:18px; margin:0; color:#0f2340; }
.ltoc { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; font-size:12.5px; line-height:1.4; }
.ltoc li { display:grid; grid-template-columns:auto 1fr; gap:8px; padding:7px 0; border-bottom:1px dotted rgba(15,35,64,.18); opacity:0; transform:translateY(4px); animation:ltocIn .32s ease forwards; }
.ltoc .ln { font-family:var(--f-display-lib); font-weight:700; color:var(--gold-dim-lib); min-width:2em; }
.ltoc li.lph { color:#7b8698; font-style:italic; }
@keyframes ltocIn { to { opacity:1; transform:none; } }
.lix-foot { margin-top:auto; display:flex; gap:7px; flex-wrap:wrap; align-items:center; padding-top:5px; }
.lix-close {
  position:absolute; top:14px; right:14px; z-index:2; width:40px; height:40px; border-radius:50%;
  border:1px solid rgba(255,255,255,.35); background:rgba(15,35,64,.65); color:#fff; font-size:18px; cursor:pointer; line-height:1;
}
.lix-close:hover { background:#0f2340; }
.lmob-head { display:none; }
@media (max-width:700px) {
  .lix-stage { --lpw:min(92vw,420px); width:var(--lpw); }
  .lob { transform:translate3d(0,30px,0) scale(.9); }
  .lix.open .lob { transform:none; }
  .lpg-right { left:0; width:100%; }
  .lleaf { left:0; width:100%; }
  .lleaf-back { visibility:hidden; }
  .lix.open .lleaf { transform:rotateY(-110deg); opacity:0; transition:transform .9s cubic-bezier(.45,.05,.25,1) .1s,opacity .3s ease .7s; }
  .lmob-head { display:flex; flex-direction:column; gap:5px; }
}
@media (max-width:560px) {
  .lib-case { padding:14px 10px 0; }
  .lib-shelf { height:210px; padding:0 4px; gap:2px; }
  .lib-board { margin:0 -10px; }
  .lbook { --bw:34px !important; --bh:168px !important; --bd:130px; }
  .lspine .ltitle { font-size:calc(var(--bfs) * .72); letter-spacing:.05em; max-height:calc(var(--bh) - 70px); }
  .lband { height:6px; }
  .lbook.lift .lbody { transform:translate3d(0,-10px,110px) rotateY(58deg); }
}
@media (prefers-reduced-motion:reduce) {
  .lbody,.lcover,.lpages,.lib-shelf::after,.lob,.lleaf,.lix { transition:none; }
  .ltoc li { animation:none; opacity:1; transform:none; }
}

/* ── Índice dentro del panel del alumno: cada clase es un enlace al visor ── */
.ltoc a.lses { display:grid; grid-template-columns:auto 1fr auto; gap:8px; align-items:center; color:inherit; text-decoration:none; border-radius:4px; transition:background .15s; }
.ltoc a.lses:hover, .ltoc a.lses:focus-visible { background:rgba(201,162,39,.12); outline:none; }
.ltoc .lses-t { min-width:0; }
.ltoc .lses-f { display:block; font-size:11px; color:#6b7689; margin-top:2px; }
.ltoc .lses-go { font-size:10px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:#0f2340; background:var(--gold); border-radius:999px; padding:4px 10px; white-space:nowrap; }
.ltoc li > a.lses { grid-column:1 / -1; }

/* ── Búsqueda de temas: libros y clases con coincidencias ── */
.lbook.lmatch .lspine { box-shadow:0 0 0 2px var(--gold), 0 0 18px 4px rgba(201,162,39,.55); }
.lhit-badge {
  position:absolute; left:50%; top:-12px; z-index:2; min-width:22px; height:22px; padding:0 6px;
  transform:translate3d(-50%,0,calc(var(--bd) / 2 + 2px));
  border-radius:999px; background:var(--gold); color:#0f2340; font:700 11px/22px var(--sans, system-ui); text-align:center;
  box-shadow:0 2px 6px rgba(0,0,0,.4); pointer-events:none; transition:opacity .2s;
}
.lbook.lift .lhit-badge { opacity:0; }
.ltoc li.lhit { background:rgba(255,224,102,.35); border-radius:6px; }
.ltoc .lses-hit { display:block; margin-top:4px; font-size:11.5px; line-height:1.45; color:#3d4757; }
.ltoc .lses-hit mark, .ltoc mark { background:#ffe066; color:inherit; padding:0 2px; border-radius:2px; }

/* ── Portadas ilustradas (public/portadas/<curso>.webp) — dentro del recuadro del juez ── */
.ljudge { position:relative; overflow:hidden; }
.ljudge .lportada { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 32%; }
.ljudge.con-portada { border-style:solid; border-color:var(--gold-soft-lib); padding:0; }

/* ── Botones del índice (landing): en la página izquierda, bajo las fases ── */
.lix-foot .lib-btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; line-height:1; text-align:center; }
#lixLeft .lix-foot { flex-direction:column; align-items:stretch; gap:8px; }
.lmob-head .lix-foot { margin-top:6px; padding-top:0; flex-wrap:nowrap; }
.lmob-head .lix-foot .lib-btn { flex:1 1 0; min-width:0; padding:0 10px; font-size:10px; letter-spacing:.1em; }

/* "Crear cuenta" desde el índice: resalta el formulario de registro */
@keyframes lcDestacar {
  0%, 100% { box-shadow: 0 0 0 0 rgba(201,162,39,0); }
  20%, 60% { box-shadow: 0 0 0 6px rgba(201,162,39,.85), 0 0 34px 8px rgba(201,162,39,.45); }
}
.hero-form-card.lc-destacar { animation: lcDestacar 1.5s ease-in-out 2; }

/* ══ Vitrina: cinta de precio sobre el lomo, precio en la portada y selector de fases ══ */
.lcinta {
  position:absolute; left:50%; top:-16px; z-index:3; transform:translate3d(-50%,0,calc(var(--bd) / 2 + 3px));
  min-width:calc(var(--bw) + 8px); padding:5px 6px 9px; box-sizing:border-box;
  background:linear-gradient(180deg,#e0352b,#b3201a); color:#fff;
  font:800 11px/1.05 var(--sans, system-ui, sans-serif); text-align:center; letter-spacing:.02em; white-space:nowrap;
  clip-path:polygon(0 0,100% 0,100% 100%,50% calc(100% - 6px),0 100%);
  box-shadow:0 3px 8px rgba(0,0,0,.45); pointer-events:none; transition:opacity .2s;
}
.lcinta small { display:block; font-size:8px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; opacity:.9; margin-bottom:1px; }
.lcinta-ok { background:linear-gradient(180deg,#22a35a,#167a40); }
.lbook.lift .lcinta { opacity:0; }
.lbook.lcomprado .lspine { filter:saturate(.55) brightness(.85); }

.lcover-precio {
  position:absolute; top:10px; right:-6px; z-index:2;
  background:#d42b22; color:#fff; padding:5px 10px 5px 12px; border-radius:4px 0 0 4px;
  font:800 13px/1 var(--sans, system-ui, sans-serif); box-shadow:0 3px 8px rgba(0,0,0,.45); text-align:right;
}
.lcover-precio small { display:block; font-size:8px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; opacity:.85; margin-top:2px; }
.lcover-precio.ok { background:#1d8a4d; font-size:11px; }
.lcover-precio::after { content:''; position:absolute; right:0; bottom:-6px; border-top:6px solid #7a1611; border-right:6px solid transparent; }
.lcover-precio.ok::after { border-top-color:#0e4f2b; }

.ltienda { display:flex; flex-direction:column; gap:10px; }
.lfases { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.lfase label, .lfase.lfase-ok, .lfase.lfase-proc { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px;
  padding:9px 11px; border:1px solid rgba(15,35,64,.16); border-radius:8px; background:#fff; cursor:pointer; transition:border-color .15s, background .15s; }
.lfase label:hover { border-color:var(--gold); }
.lfase label:has(input:checked) { border-color:var(--gold); background:rgba(201,162,39,.1); }
.lfase input { width:18px; height:18px; accent-color:#0f2340; margin:0; }
.lfase-n { font-size:13px; font-weight:700; color:#0f2340; min-width:0; }
.lfase-n small { display:block; font-weight:500; font-size:11px; color:#6b7689; }
.lfase-p { font:800 14px/1 var(--sans, system-ui, sans-serif); color:#b3201a; white-space:nowrap; font-variant-numeric:tabular-nums; }
.lfase.lfase-ok { background:rgba(34,163,90,.08); border-color:rgba(34,163,90,.35); cursor:default; }
.lfase-ok .lfase-chk { width:18px; text-align:center; color:#167a40; font-weight:800; }
.lfase-ok .lfase-p { color:#167a40; font-size:12px; }
.ltotal { display:flex; justify-content:space-between; align-items:baseline; padding:8px 2px 0; border-top:1px dashed rgba(15,35,64,.25); font-size:13px; color:#3d4757; }
.ltotal strong { font-size:20px; color:#0f2340; font-variant-numeric:tabular-nums; }
.ltienda-ok { margin:0; color:#167a40; font-weight:700; font-size:13px; }
.lpedir.ldesact { opacity:.45; cursor:not-allowed; }
.lphase-precio { font:800 13px/1 var(--sans, system-ui, sans-serif); font-style:normal; color:#fff; background:#c9281f; padding:4px 8px; border-radius:999px; margin-left:6px; vertical-align:middle; }
.lphase-precio:empty { display:none; }
.lphase-precio.ok { background:#1d8a4d; }
/* en celular el selector va en la cabecera, debajo del curso */
.lmob-head .ltienda { margin-top:8px; }
#lixLeft .ltienda .lix-foot { flex-direction:column; align-items:stretch; gap:8px; }
.lmob-head .ltienda .lix-foot { flex-wrap:wrap; }
.lmob-head .ltienda .lix-foot .lib-btn { flex:1 1 100%; }
.lpedir { text-decoration:none !important; }

/* ── Arrastrar libros entre repisas ── */
.lbook { -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; touch-action:manipulation; }
.lbook.larrastre {
  position:fixed !important; z-index:9999; pointer-events:none; margin:0;
  transform:rotate(-5deg) scale(1.06); filter:drop-shadow(0 18px 22px rgba(0,0,0,.55));
  transition:none;
}
.lbook.larrastre .lbody { transform:none !important; transition:none; }
.lbook.larrastre .lcover, .lbook.larrastre .lpages, .lbook.larrastre .lcinta, .lbook.larrastre .lhit-badge { opacity:0 !important; }
.lhueco { flex:0 0 auto; align-self:flex-end; border-radius:3px; border:2px dashed rgba(201,162,39,.75); background:rgba(201,162,39,.10); }
.lc-arrastrando, .lc-arrastrando * { cursor:grabbing !important; }
.lc-arrastrando .lib-shelf::after { opacity:0 !important; }
.lib-reset { align-self:center; margin-top:-14px; background:none; border:0; color:var(--gold,#c9a227); font:600 12px/1.2 inherit; letter-spacing:.04em; cursor:pointer; padding:4px 8px; opacity:.85; }
.lib-reset:hover { opacity:1; text-decoration:underline; }

/* ── Vitrina: compra con amigos / código de amigo ── */
.lpromo { display:flex; flex-direction:column; gap:6px; padding:8px 10px; border:1px dashed rgba(201,162,39,.6); border-radius:10px; background:rgba(201,162,39,.07); }
.lpromo-f { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:12px; font-weight:600; color:#0f2340; }
.lpromo select, .lpromo input { font:inherit; font-size:12px; padding:5px 8px; border:1px solid rgba(15,35,64,.25); border-radius:8px; background:#fff; color:#0f2340; min-width:0; }
.lpromo input { text-transform:uppercase; letter-spacing:.04em; }
.lpromo input::placeholder { text-transform:none; letter-spacing:0; }
.lpromo-info { font-size:11.5px; line-height:1.35; color:#3d4757; }
.lpromo-info:empty { display:none; }
.lpromo-info b { color:#047857; }

/* ── Curso "En proceso": el juez trabajando en la tapa + cinta ámbar ── */
.ljudge.lproceso { padding:0; border-style:solid; border-color:var(--gold-soft-lib); background:radial-gradient(120% 90% at 50% 30%, rgba(255,233,168,.10), rgba(0,0,0,.25)); }
.ljudge .ljt { width:100%; height:100%; display:block; }
.ljudge .ljt-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 35%; background:#f3f1ea; pointer-events:none; }
.ljt-pluma { transform-origin:82px 67px; animation:ljtEscribe 1.1s ease-in-out infinite; }
.ljt-renglon { stroke-dasharray:14; stroke-dashoffset:14; animation:ljtTrazo 2.6s linear infinite; }
.ljt-renglon.r2 { stroke-dasharray:11; stroke-dashoffset:11; animation-delay:1.3s; }
.ljt-vapor { animation:ljtVapor 2.8s ease-in-out infinite; }
@keyframes ljtEscribe { 0%,100% { transform:translate(0,0) rotate(0); } 30% { transform:translate(2.2px,.4px) rotate(-4deg); } 60% { transform:translate(-1px,-.3px) rotate(3deg); } }
@keyframes ljtTrazo { 0% { stroke-dashoffset:14; opacity:1; } 55% { stroke-dashoffset:0; opacity:1; } 90%,100% { stroke-dashoffset:0; opacity:0; } }
@keyframes ljtVapor { 0% { opacity:0; transform:translateY(2px); } 40% { opacity:.9; } 100% { opacity:0; transform:translateY(-4px); } }
@media (prefers-reduced-motion: reduce) { .ljt-pluma, .ljt-renglon, .ljt-vapor { animation:none; stroke-dashoffset:0; } }
.lcinta-proc { background:linear-gradient(180deg,#f2b33d,#c98512); color:#2b1a00; }
.lproc-aviso { margin:10px 0 4px; padding:10px 12px; border-radius:10px; background:rgba(242,179,61,.14); border:1px solid rgba(242,179,61,.5); font-size:12.5px; line-height:1.5; color:inherit; }
.lproc-aviso b { color:#b7790d; }
.lfase.lfase-proc { background:rgba(242,179,61,.12); border-color:rgba(242,179,61,.55); border-style:dashed; cursor:default; }
.lfase-proc .lfase-chk { width:18px; text-align:center; font-size:13px; }
.lfase-proc .lfase-p { color:#b7790d; font-size:12px; font-weight:800; }
.lcover-precio.proc { background:linear-gradient(180deg,#f2b33d,#c98512); color:#2b1a00; }


/* ── Librero personal: columnas pegadas (un solo mueble) y placas en la madera ── */
.lib-case.lib-case-cols { width:min(100%, max(820px, calc(var(--cols) * 410px))); max-width:1280px; display:grid;
  grid-template-columns:repeat(var(--cols), minmax(0, 1fr)); column-gap:18px; }
.lib-case-cols .lib-col { position:relative; min-width:0; }
/* el poste de madera entre columnas */
.lib-case-cols .lib-col + .lib-col::before { content:""; position:absolute; left:-18px; top:-22px; bottom:0; width:18px;
  background:linear-gradient(90deg,var(--wood-3),var(--wood-2) 30%,#8a3d25 50%,var(--wood-2) 70%,var(--wood-3));
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.25); }
.lib-case-cols .lib-board { margin:0 -9px; }
.lib-case-cols .lib-col:first-child .lib-board { margin-left:-22px; }
.lib-case-cols .lib-col:last-child .lib-board { margin-right:-22px; }
.lib-chapa { position:absolute; left:50%; top:50%; transform:translate(-50%,-42%); z-index:4; max-width:84%;
  padding:4px 16px 3px; font:700 10.5px/1.25 var(--f-display-lib); letter-spacing:.09em; text-transform:uppercase; color:#2a1a02;
  background:linear-gradient(180deg,#f8e7a8,#d6b13c 42%,#a8841f 100%); border-radius:2px;
  box-shadow:0 3px 4px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.75), inset 0 -1px 0 rgba(0,0,0,.25);
  text-shadow:0 1px 0 rgba(255,244,200,.65); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* los clavitos */
.lib-chapa::before, .lib-chapa::after { content:""; position:absolute; top:50%; width:5px; height:5px; margin-top:-2.5px; border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#fff6d0,#6e560f 75%); box-shadow:0 0 0 .5px rgba(0,0,0,.4); }
.lib-chapa::before { left:5px; } .lib-chapa::after { right:5px; }
.lib-editando .lib-chapa { cursor:text; outline:none; }
.lib-editando .lib-chapa:focus { box-shadow:0 0 0 2px #fff3c4, 0 3px 4px rgba(0,0,0,.55); text-overflow:clip; }
.lib-chapa.vacia { background:rgba(255,240,200,.08); border:1px dashed rgba(243,215,122,.75); color:#f3d77a; text-shadow:none;
  text-transform:none; letter-spacing:.02em; font-weight:600; box-shadow:none; }
.lib-chapa.vacia::before, .lib-chapa.vacia::after { display:none; }
/* Barra para organizar el librero */
.lib-organizar { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:10px 18px; margin-bottom:-6px; }
.lib-organizar .lib-btn-org { background:rgba(15,35,64,.06); border:1px solid rgba(15,35,64,.18); color:#0f2340; border-radius:999px;
  font:700 13px/1 inherit; padding:9px 16px; cursor:pointer; }
.lib-organizar .lib-btn-org[aria-pressed="true"] { background:#0f2340; color:#fde68a; border-color:#0f2340; }
.lib-organizar .lib-ctl { display:inline-flex; align-items:center; gap:6px; font:600 13px/1 inherit; color:#334155; }
.lib-organizar .lib-ctl button { width:30px; height:30px; border-radius:50%; border:1px solid rgba(15,35,64,.25); background:#fff; color:#0f2340;
  font:800 16px/1 inherit; cursor:pointer; }
.lib-organizar .lib-ctl button:disabled { opacity:.35; cursor:default; }
.lib-organizar .lib-ctl b { min-width:1.2em; text-align:center; color:#0f2340; }
.lib-organizar .lib-tip { flex-basis:100%; text-align:center; font-size:12px; color:#64748b; }
@media (max-width:560px) {
  .lib-case.lib-case-cols { column-gap:10px; }
  .lib-case-cols .lib-col + .lib-col::before { left:-10px; width:10px; top:-14px; }
  .lib-case-cols .lib-board { margin:0 -5px; }
  .lib-case-cols .lib-col:first-child .lib-board { margin-left:-10px; }
  .lib-case-cols .lib-col:last-child .lib-board { margin-right:-10px; }
  .lib-case-cols .lib-shelf { padding:0 2px; }
  .lib-chapa { font-size:9px; padding:3px 12px 2px; }
}