:root{--void:#FFFFFF;--ink:#FBFAF7;--panel-2:#F5F3EE;--line:#E7E3DA;--sep-borde:#CFC8B6;--sep-sombra:rgba(23,23,15,.3);--borde-campo:#97948F;--borde-foco:#17170F;--line-soft:#F0EDE6;--vellum:#17170F;--dim:#3F3E36;--ash:#6B695E;--pista:#6A7286;--muted:#55534A;--gold:#A67C0B;--punto-ia:#A67C0B;--num:#9C7408;--w-chat:100%;--gold-hi:#3F3E36;--gold-deep:#DCD7CB;--lapis:#1D4E89;--lapis-hi:#2A5D9E;--jade:#0B7A54;--crimson:#B32D22;--mark:#FBF0BC;--radius:10px;--t-display:clamp(2.3rem,5.2vw,3.4rem);--t-titulo:clamp(1.75rem, 4vw, 2.4rem);--t-h2:1.5rem;--t-h3:1.25rem;--t-lead:1.125rem;--t-body:1rem;--t-ui:.875rem;--t-sm:.8125rem;--t-xs:.75rem;--pad-x:clamp(10px, 6.88vw - 14.8px, 38px);--hueco-chat:max(12px, 20.11vw - 54.4px);--s-05:.2rem;--s-1:.4rem;--s-15:.6rem;--s-2:.8rem;--s-3:1.2rem;--s-4:1.6rem;--s-5:2.4rem;--s-6:3.2rem;--s-7:4.8rem;--card:1.2rem;--f-disp:"Literata",Georgia,serif;--f-read:"Literata","Frank Ruhl Libre",Georgia,serif;--f-ui:"Literata",Georgia,serif;--f-heb:"Frank Ruhl Libre","Literata",Georgia,serif;--w-read:min(760px, calc(100% - var(--pad-x) * 2));--w-mid:min(1320px, calc(100% - var(--pad-x) * 2));--w-wide:min(1100px, calc(100% - var(--pad-x) * 2));--m-land1:#F4F0E6;--m-land2:#EDE7D9;--m-sea1:#DEE9F3;--m-sea2:#CCDCEC;--m-coast:#7FA3C4;--m-sierra:#C9BFA8;--m-region:#6B5F49;--m-halo:rgba(251,250,247,.85);--m-desierto:#E4D9BE;--m-fosa:#B8A88C;--m-river:#6C97BC;--m-grid:#E6E2D8;--m-wlabel:#5B7E9C;--m-ilabel:#7C776B;--m-peak:#B0A894;--m-site:#17170F;--m-site2:#4A4840;--sg:#6C5BA8;color-scheme:light;--r-control:9px;--r-tarjeta:14px;--r-pildora:99px;--alto-control:54px;--alto-control-min:44px}.cdx[data-theme=dark]{--libro:#a79cff;--void:#242423;--ink:#1A1A19;--panel-2:#2E2E2C;--line:#494846;--sep-borde:#5E5C57;--sep-sombra:rgba(0,0,0,.55);--borde-campo:#827D73;--borde-foco:#F3EEE4;--line-soft:#2C2C2A;--vellum:#EFEEEB;--dim:#CFC7B9;--ash:#8F8F8A;--pista:#9AA3B5;--muted:#B8B7B2;--gold:#E0B93C;--punto-ia:#E0B93C;--num:#C9A227;--w-chat:100%;--gold-hi:#CFC7B9;--gold-deep:#4E4840;--lapis:#8FB4DE;--lapis-hi:#A0C0E4;--jade:#54CFA0;--crimson:#F0776C;--mark:#3D3520;--m-land1:#232120;--m-land2:#1C1B19;--m-sea1:#1B2836;--m-sea2:#16202C;--m-coast:#557B9C;--m-sierra:#3A362C;--m-region:#B9AE97;--m-halo:rgba(20,19,17,.8);--m-desierto:#332F26;--m-fosa:#4A4335;--m-river:#5583A6;--m-grid:#2C2925;--m-wlabel:#7EA3C0;--m-ilabel:#8F887A;--m-peak:#5E574B;--m-site:#F3EEE4;--m-site2:#9A9284;--sg:#A796DC;color-scheme:dark}.cdx[data-theme=dark] .badge.ok{background:#123024}.cdx[data-theme=dark] .badge.no{background:#331714}.cdx[data-theme=dark] .status.confirmado{background:#123024}.cdx[data-theme=dark] .status.corroborado,.cdx[data-theme=dark] .kindtag.biblia{color:#dca84e;background:#2e2411}.cdx[data-theme=dark] .kindtag.diccionario{color:#8faee6;background:#1a2333}.cdx[data-theme=dark] .kindtag.comentario{background:#123024}.cdx[data-theme=dark] .kindtag.libro{background:#786ec829;color:var(--libro,#5a4fa8)}.kindtag.referencias{color:#c89bd8;background:#2a1f31}.cdx[data-theme=dark] .xref .r{color:#c89bd8}.cdx[data-theme=dark] .avoid{background:#331714}.cdx[data-theme=dark] .avoid ul{color:#e9b0aa}.cdx[data-theme=dark] .shimmer{background:linear-gradient(90deg,#232220 25%,#2e2c29,#232220 75%);background-size:200% 100%}.cdx[data-theme=dark] .askbar input,.cdx[data-theme=dark] .cite{box-shadow:none}.cdx[data-theme=dark] .results,.cdx[data-theme=dark] .sitecard{box-shadow:0 18px 50px #0000008c}.cdx[data-theme=dark] .btn.primary:hover:not(:disabled){background:#fff;border-color:#fff}.cdx[data-theme=dark] .palwrap{position:fixed;inset:0;z-index:400;background:#17170f52;display:flex;align-items:flex-start;justify-content:center;padding:calc(12vh + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left))}.pallista{max-height:46vh;overflow-y:auto}.palpie{padding:var(--s-1) var(--s-3);border-top:1px solid var(--line-soft);font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted)}.lang{order:2;display:inline-flex;background:var(--panel-2);border-radius:var(--r-control);padding:2px;flex:0 0 auto}.lang button{background:none;border:0;cursor:pointer;border-radius:var(--r-control);padding:.28rem .55rem;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--ash);letter-spacing:.04em}.lang button[data-on="1"]{background:var(--void);color:var(--vellum);box-shadow:0 1px 3px #14120a1a}.themebtn{order:2;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:var(--r-control);background:none;border:1px solid var(--line);color:var(--vellum);cursor:pointer;transition:all .16s;margin-left:.4rem}.themebtn:hover:not(:disabled){background:var(--panel-2);border-color:var(--ash)}.themebtn:disabled{opacity:.3;cursor:default}.themebtn:focus-visible{outline:2px solid var(--vellum);outline-offset:2px}.themebtn svg{width:17px;height:17px;display:block}.menu3p-sep{border:0;border-top:1px solid var(--line);margin:4px 2px} .menu3p-copy{padding:.35rem .6rem .2rem;font-size:var(--t-xs);color:var(--muted);text-align:center}*{box-sizing:border-box}html,body{height:100%;width:100%;margin:0;padding:0;overflow:hidden;overflow-x:hidden;overscroll-behavior:none;background:var(--ink)}html{overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}.cdx{background:var(--ink);color:var(--vellum);font-family:var(--f-ui);letter-spacing:.002em;position:fixed;inset:0;height:auto;padding-top:env(safe-area-inset-top);background-clip:border-box;box-sizing:border-box;display:flex;flex-direction:column;overflow:hidden;-webkit-font-smoothing:antialiased;font-size:var(--t-body)}.cdx em,.cdx i,.cdx cite,.cdx address{font-style:normal}.disp{font-family:var(--f-disp);font-weight:400;letter-spacing:-.018em}h1,h2,h3,h4{font-optical-sizing:auto}.auto,textarea,input,select,button{font-family:inherit}.mono{font-family:var(--f-ui);font-variant-numeric:tabular-nums}.topbar{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s-1);flex:0 0 auto;padding:0 calc(var(--s-3) + env(safe-area-inset-right)) 0 calc(var(--s-3) + env(safe-area-inset-left));min-height:auto;padding-top:var(--s-1);padding-bottom:var(--s-1);row-gap:var(--s-1);background:var(--void)} /* v588: sin línea divisoria —a pedido de Giovani, para que el encabezado se sienta parte de la misma hoja, no un bloque aparte encima—. */ @media (min-width:900px){ /* v594: --ink es el color real de la página (el que trae .cdx), no --panel-2 —que es el de tarjetas/paneles, un tono distinto aunque parecido—. El encabezado y el panel usan --ink los dos, para que se vea de verdad el mismo color en cualquier módulo. */ .topbar{border-bottom:0;background:var(--ink)} .finder input{background:var(--panel-2)} }.brandmark{width:23px;height:23px;flex:0 0 auto;display:block}.brand{display:flex;align-items:center;gap:var(--s-1);padding-right:.8rem;order:1;background:none;border:0;padding:0;cursor:pointer;font:inherit;color:inherit;text-align:left;-webkit-tap-highlight-color:transparent;min-width:0}.brand:hover{opacity:.75}.brand:focus-visible{outline:2px solid var(--vellum);outline-offset:3px;border-radius:var(--r-control)}.brand b{font-family:var(--f-disp);font-size:var(--t-lead);font-weight:400;letter-spacing:.09em;text-transform:uppercase;color:var(--vellum);white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}.brand .ai{width:23px;height:23px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:700;letter-spacing:.06em;color:var(--void);background:var(--vellum);border-radius:var(--r-control);padding:0}.tabs{display:flex;gap:var(--s-1);overflow-x:auto;scrollbar-width:none;order:3;flex:1 1 100%;min-width:0;padding-top:var(--s-1);border-top:1px solid var(--line-soft)}.tabs::-webkit-scrollbar{display:none}.topcontrol{order:2;display:flex;align-items:center;gap:var(--s-1);margin-left:auto;flex:0 0 auto;flex-wrap:nowrap}@media (max-width:480px){.brand{padding-right:.2rem;gap:.3rem;min-width:0}.brand b{font-size:var(--t-body);letter-spacing:.08em}.brandmark{width:22px;height:22px}.brand .ai{width:21px;height:21px;font-size:var(--t-min);border-radius:var(--r-control)}.topcontrol{gap:.25rem}.topcontrol .themebtn{margin-left:0;width:32px;height:32px;border-radius:var(--r-control)}.lang button{padding:.28rem .4rem}.topcontrol .tab{padding:var(--s-1) .45rem;font-size:var(--t-xs)}}.tab{background:none;border:0;color:var(--ash);cursor:pointer;white-space:nowrap;font-family:var(--f-ui);font-size:var(--t-ui);font-weight:500;letter-spacing:0;text-transform:none;padding:var(--s-1) var(--s-2);border-radius:var(--r-control);transition:background .14s,color .14s}.tab:hover{color:var(--vellum);background:var(--panel-2)}.tab[data-on="1"]{color:var(--void);background:var(--vellum)}.tab:focus-visible{outline:2px solid var(--vellum);outline-offset:1px}.finder{order:4;flex:1 1 100%;display:flex;padding-left:0;position:relative;padding-top:var(--s-1)}.finder input{width:100%;background:var(--ink);border:1px solid var(--borde-campo);color:var(--vellum);font-family:var(--f-ui);font-size:var(--t-ui);padding:var(--s-1) var(--s-2);border-radius:var(--r-control);transition:background .16s,border-color .16s}.finder input:focus{outline:0;background:var(--void);border-color:var(--vellum)}.finder input::placeholder{color:var(--pista)}.results{position:absolute;top:calc(100% + 8px);left:0;right:0;max-height:64vh;overflow-y:auto;background:var(--void);border:1px solid var(--line);border-radius:var(--radius);z-index:500;box-shadow:0 18px 50px #14120a21,0 2px 6px #14120a0f}.res-head{padding:var(--s-2) var(--s-2);font-size:var(--t-sm);color:var(--ash);border-bottom:1px solid var(--line-soft);display:flex;justify-content:space-between}.res{display:block;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line-soft);padding:var(--s-2) var(--s-2);cursor:pointer;color:var(--dim);transition:background .12s}.res:last-child{border-bottom:0}.res:hover{background:var(--panel-2)}.res .rr{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;letter-spacing:0;color:var(--vellum)}.res .rt{font-family:var(--f-read);font-size:var(--t-body);line-height:1.6;margin-top:var(--s-1);color:var(--dim)}.res mark{background:var(--mark);color:var(--vellum);padding:0 .12em;border-radius:2px}.body{display:flex;flex:1;min-height:0;position:relative;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);box-sizing:border-box}/* v623 (a pedido de Giovani): sin esto, cada vez que el contenido cambiaba de alto —elegir un plan, entrar a Memorizar—, la barra de scroll aparecía o desaparecía, y todo lo centrado (.plan-wrap y cualquier otro ancho fijo) se corría unos píxeles de golpe. Reservar el espacio siempre, haya o no barra, quita ese salto. */ .center{flex:1;min-width:0;min-height:0;display:block;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable}.side{flex:0 0 auto;border-left:1px solid var(--line);display:flex;flex-direction:column;background:var(--void);overflow-y:auto;overscroll-behavior:contain}.bookrow i{font-family:var(--f-ui);font-variant-numeric:tabular-nums;font-style:normal;font-size:var(--t-xs);color:var(--ash);width:2.1rem;flex:0 0 2.1rem}.bookrow[data-on="1"] i{color:#ffffff8c}.bookrow:focus-visible{outline:2px solid var(--vellum);outline-offset:-2px}.rmode-legacy{display:none}.readhead h2{margin:0;font-family:var(--f-disp);font-size:var(--t-h2);font-weight:400;letter-spacing:-.02em;line-height:1}.readhead h2 em{font-style:normal;color:var(--ash)}.step{background:var(--void);border:1px solid var(--line);color:var(--vellum);width:28px;height:28px;cursor:pointer;border-radius:var(--r-control);font-size:var(--t-ui);line-height:1;transition:all .14s}.step:hover:not(:disabled){background:var(--panel-2);border-color:var(--ash)}.step:disabled{opacity:.35;cursor:default}.chip{background:var(--void);border:1px solid var(--line);color:var(--dim);font-family:var(--f-ui);font-size:var(--t-sm);padding:.32rem .6rem;cursor:pointer;border-radius:var(--r-control);transition:all .14s;white-space:nowrap}.chip:hover{border-color:var(--ash);color:var(--vellum)}.chip[data-on="1"]{background:var(--vellum);border-color:var(--vellum);color:var(--void);font-weight:500}.chip:focus-visible{outline:2px solid var(--vellum);outline-offset:1px}.chipscroll{display:flex;gap:var(--s-1);overflow-x:auto;max-width:100%;padding-bottom:var(--s-1)}.chipscroll::-webkit-scrollbar{height:0}.sidesep{flex:0 0 1px;align-self:stretch;min-height:1.6rem;background:var(--line);margin:0 .3rem}.pselect{width:100%;margin:var(--s-2) 0 var(--s-3);background:var(--void);border:1px solid var(--borde-campo);border-radius:var(--r-control);padding:.5rem .6rem;font-family:var(--f-ui);font-size:var(--t-sm);color:var(--vellum)}.pselect:focus{outline:0;border-color:var(--borde-foco)}/* LA BARRA SE QUEDA ARRIBA, y esto va y viene: en la v422 se le quitó el pegado porque parecía culpable de que «una cosa se moviera y la otra no». No lo era. Lo que se quedaba clavado eran las CABECERAS DE LOS PANELES —el de versiones y el de «Ir a un pasaje»—, que tenían su propio desplazamiento en la lista de dentro. Eso se arregló en la v423 y la v427, atacando el contenedor. Con aquello resuelto, la barra vuelve a estar pegada, que es lo que quiere quien lee: pasar de capítulo o cambiar de versión sin subir arrastrando media pantalla. */ /* v642 (a pedido de Giovani): esta barra —Génesis 4:1, RV1909, Recursos, Comparar— quedaba blanca, distinta al resto del encabezado. Mismo color real de la página, --ink, que ya usan el encabezado y el panel. */ .rmode{display:flex;align-items:center;justify-content:flex-start;gap:var(--s-1);flex-wrap:nowrap;flex:0 0 auto;position:sticky;top:0;left:0;padding:var(--s-1) 16px;background:var(--ink);border-bottom:1px solid var(--line);z-index:40}.rmode>*{flex:0 0 auto}.rmode .rbtn{flex:0 0 auto;min-width:0;white-space:nowrap;font-size:var(--t-lead)}.step+.rsel,.rsel+.step{margin-left:calc(var(--s-1) * -.5)}.rmode .vsel{flex:0 0 auto;min-width:0;white-space:nowrap}.vozgrupo{display:inline-flex;align-items:center;gap:.25rem;flex:0 0 auto}.vozbtn{padding:.35rem .55rem;display:inline-flex;align-items:center;justify-content:center}.vozbtn svg{width:15px;height:15px;display:block}.vozcarga{flex:0 0 auto;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--muted);white-space:nowrap;padding:0 .3rem}.vozrango{width:100%;accent-color:var(--vellum)}.basecarga{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translate(-50%);z-index:500;display:flex;align-items:center;gap:.6rem;background:var(--void);border:1px solid var(--line);border-radius:99px;padding:.6rem 1.1rem;box-shadow:0 10px 34px #14120a38;font-family:var(--f-ui);font-size:var(--t-sm);color:var(--vellum);max-width:92vw}.basecarga em{font-style:normal;color:var(--muted);margin-left:.4rem}.basecarga-giro{width:14px;height:14px;flex:0 0 auto;border-radius:50%;border:2px solid var(--line);border-top-color:var(--vellum);animation:girar .8s linear infinite}@keyframes girar{to{transform:rotate(360deg)}}.cat{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card);margin-bottom:var(--s-4);max-width:var(--w-mid);margin-left:auto;margin-right:auto;box-sizing:border-box}.cat-cab{margin-bottom:var(--s-3)}.cat-cab h3{font-size:var(--t-h3);font-weight:600;letter-spacing:-.02em;color:var(--vellum);margin:0}.cat-cab span{font-family:var(--f-ui);font-size:var(--t-sm);color:var(--muted)}.cat-rejilla{display:grid;gap:var(--s-2);grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}.cat-item{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-2);background:var(--panel-2);border-radius:var(--r-control);padding:var(--s-3)}.cat-item .chip{align-self:flex-start;margin-top:auto}.cat-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}.cat-txt b{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum)}.cat-txt span{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted)}.cat-txt em{font-family:var(--f-read);font-size:var(--t-xs);font-style:normal;color:var(--ash)}.cat-pie{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);margin:var(--s-3) 0 0}.aj-pasos{background:var(--panel-2);border-radius:var(--r-control);padding:var(--s-3);margin:var(--s-2) 0 var(--s-3)}.aj-pasos>span{display:block;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--muted);margin-bottom:var(--s-2)}.aj-pasos ol{margin:0 0 var(--s-3);padding-left:1.15rem;font-family:var(--f-ui);font-size:var(--t-sm);color:var(--dim);line-height:1.6}.aj-pasos li{margin-bottom:.25rem}.tabs{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 2.2rem),transparent 100%);mask-image:linear-gradient(to right,#000 calc(100% - 2.2rem),transparent 100%)}@media (min-width:1240px){.tabs{-webkit-mask-image:none;mask-image:none}}/* v665 (a pedido de Giovani): «organizar mejor la fila del play». Con una referencia larga («Jeremías 26:5», con la letra grande que trae esta fila en el teléfono) y una sigla de versión también larga, la fila no alcanza a entrar completa aunque se recorte la sigla —hay más elementos después (Recursos, Comparar…) que YA se resolvían con desplazamiento horizontal a propósito—. Lo que no se resolvía era que el corte, a los 2rem de esta máscara, quedaba casi pegado al borde: se notaba poco y el texto se veía tajado en seco, no difuminado. Se ensancha a 3rem para que el desvanecido sea visible de verdad y lo que asoma a medias lea como «hay más, desliza», no como un corte a mitad de palabra. */ @media (max-width:900px){.rmode[data-desborda="1"]{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 3rem),transparent 100%);mask-image:linear-gradient(to right,#000 calc(100% - 3rem),transparent 100%)}} /* v668: este desvanecido estaba puesto siempre, sin mirar si «.rmode» realmente tenía algo que desplazar. Con la referencia y la sigla ya más chicas (ver el bloque «v668» más abajo), el «•••» del final suele caber entero sin desplazamiento —y ese desvanecido fijo lo apagaba de todas formas, apenas por estar en el último tramo de la fila: el mismo «no se ven los 3 puntos» de siempre, esta vez causado por el aviso de scroll y no por falta de sitio—. Ahora sólo se aplica cuando «data-desborda="1"» (lo calcula Reader, en el .jsx, comparando «scrollWidth» y «clientWidth» de verdad), así que el desvanecido vuelve a significar «hay más, desliza» y desaparece en cuanto deja de ser cierto. */ .puntos,.solo-estrecho{display:none}.palbox.busca{width:min(640px,94vw)}/* v595: el campo de texto sí tenía margen propio (var(--s-3)); los títulos de sección y las filas de resultado no tenían ninguno —sólo el botón de cada fila, no la sección que lo envuelve—, así que el texto quedaba pegado al borde. Un solo margen aquí, para todo lo de adentro por igual. */ .palres{max-height:min(62vh,520px);overflow-y:auto;overscroll-behavior:contain;margin-top:var(--s-2);padding:0 var(--s-3) var(--s-3)}.palg{margin-bottom:var(--s-3)}.palg h4{display:flex;align-items:center;gap:.45rem;margin:0 0 .3rem;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.palg h4 span{font-weight:600;color:var(--ash);background:var(--panel-2);border-radius:99px;padding:.02rem .4rem;letter-spacing:0;text-transform:none;font-variant-numeric:tabular-nums}.palit{display:block;width:100%;text-align:left;background:none;border:0;cursor:pointer;padding:.5rem .6rem;border-radius:var(--r-control);color:var(--dim)}.palit:hover,.palit:focus-visible{background:var(--panel-2);outline:0}.palit b{display:block;font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum)}.palv{margin-left:.5rem;font-weight:500;font-size:var(--t-xs);color:var(--muted);letter-spacing:.02em}.palit em{display:block;font-family:var(--f-read);font-size:var(--t-xs);font-style:normal;color:var(--ash);line-height:1.5;margin-top:.1rem;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}@media (max-width:640px){html{font-size:110%}input,textarea,select,.field,.auto{font-size:max(16px,1em)}.palbox.busca{max-width:none}.palres{max-height:64vh}}@media (max-width:380px){html{font-size:106%}input,textarea,select,.field,.auto{font-size:max(16px,1em)}.topcontrol{flex-wrap:wrap;justify-content:flex-end;row-gap:.3rem;max-width:100%}}.pasaje{padding-bottom:var(--s-4)}.bloq{border-top:1px solid var(--line-soft);padding:var(--s-2) 0}.bloq:first-of-type{border-top:0}.bloq-cab{display:flex;align-items:center;gap:.5rem;width:100%;background:none;border:0;cursor:pointer;padding:.35rem 0;text-align:left;color:var(--vellum)}.bloq-fl{display:inline-block;transition:transform .16s;color:var(--ash);font-size:var(--t-body);line-height:1}.bloq[data-abierto="1"] .bloq-fl{transform:rotate(90deg)}.bloq-t{font-family:var(--f-ui);font-size:var(--t-body);font-weight:700;color:var(--vellum);letter-spacing:.01em}.bloq-n{margin-left:auto;font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--muted);background:var(--panel-2);border-radius:99px;padding:.05rem .45rem;font-variant-numeric:tabular-nums}.bloq-cuerpo{padding-top:var(--s-2)}.bloq[data-vacio="1"] .bloq-cab{cursor:default}.bloq[data-vacio="1"] .bloq-fl{opacity:.3}.link-inline{background:none;border:0;padding:0;font:inherit;color:var(--lapis);cursor:pointer;text-decoration:underline;text-underline-offset:2px}.link-inline:hover{opacity:.75}.ia-aparte{margin-top:1.4rem;padding-top:.9rem;border-top:1px solid var(--line)}.ia-aparte-t{display:block;margin-bottom:.5rem;font-family:var(--f-ui);font-size:var(--t-xs);letter-spacing:.09em;text-transform:uppercase;color:var(--ash)}.bloq-nada{margin:.2rem 0 0 1.5rem;font-family:var(--f-read);font-size:var(--t-ui);color:var(--ash);line-height:1.6}.pasaje .pasaje .dmodh,.pasaje .dmodh b{font-weight:400;color:var(--ash)}.pasaje .dmodh:hover,.pasaje .dmodh:hover b{color:var(--dim)}.cmt{margin-bottom:var(--s-3)}.cmt-h{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--muted);margin-bottom:.2rem}.cmt-t{font-family:var(--f-read);font-size:var(--t-ui);line-height:1.65;color:var(--dim)}.bienvenida{margin:var(--s-7) auto var(--s-5);background:var(--panel-2);border:0;border-radius:var(--r-tarjeta);padding:var(--card);text-align:left}.bienvenida h2{font-size:var(--t-h2);font-weight:600;letter-spacing:-.02em;color:var(--vellum);margin:0 0 var(--s-2)}.bienvenida p{font-family:var(--f-read);font-size:var(--t-ui);line-height:1.7;color:var(--dim);margin:0 0 var(--s-2)}.bienvenida .ficha-botones{margin-top:var(--s-3)}/* v612: «--card» no existe —esa variable nunca se declaró—, así que el relleno de esta caja no hacía nada; ganaba lo que fuera que viniera después. Aquí queda consolidado en una sola regla, con el mismo radio y relleno que .hl-caja, la caja de abajo con la que se comparaba. */ .faltaclave{display:flex;flex-direction:column;align-items:flex-start;gap:.45rem;background:var(--panel-2);border-radius:var(--r-tarjeta);padding:var(--s-3);margin-block:var(--s-4) var(--s-5);box-sizing:border-box;margin-inline:auto}.faltaclave b{font-family:var(--f-ui);font-size:var(--t-ui);font-weight:600;color:var(--vellum)}.faltaclave span{font-family:var(--f-read);font-size:var(--t-sm);color:var(--dim);line-height:1.5}.faltaclave .btn{margin-top:.35rem}.themebtn{position:relative}.themebtn[data-pendiente="1"]:after{content:"";position:absolute;top:5px;right:5px;width:7px;height:7px;border-radius:50%;background:var(--punto-ia);box-shadow:0 0 0 2px var(--void)}.aj-nota[data-gratis="1"] b{color:var(--oro-texto)}.aj-pista{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);margin:.35rem 0 0;line-height:1.45}.rmode .vbtn{min-width:0;overflow:hidden;white-space:nowrap} /* v665 (a pedido de Giovani): «organizar mejor la fila del play». La sigla de una versión es texto libre —«SPANISH NBLA» es tan válida como «RV60»— y esta regla, sin un ancho definido, no recortaba nada de verdad: «overflow:hidden» en un elemento que sigue creciendo con su contenido no tiene nada que esconder. El botón entero se salía de «.rmode» —que se desplaza en horizontal a propósito, ver más abajo— y el borde de la pantalla lo cortaba a la mitad, sin puntos suspensivos ni forma de píldora: se veía roto, no recortado. El recorte de verdad vive en «.vbtn-label» —el texto solo, no el botón con su flechita—, con un ancho tope que en pantalla ancha no molesta a ninguna sigla normal (tres a seis letras) y en el teléfono, donde el espacio es corto, se ajusta un poco más. */ .vbtn-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:11rem} @media (max-width:900px){.vbtn-label{max-width:9rem}} /* v665: en el teléfono la referencia («Jeremías 26:5») ya usa la letra grande de «.rmode .rbtn» y por sí sola deja poco sitio libre antes del borde. Un tope de 5.5rem para la sigla todavía no bastaba —el botón completo, con su flechita y su relleno, seguía saliéndose de la pantalla en un caso real («Jeremías 26:5» + «SPANISH NBLA»)—; se aprieta a 4rem, que a una sigla normal de tres a seis letras (RV60, NBLA, KJV) no le recorta nada —sólo entra en juego con las siglas inusualmente largas que de verdad lo necesitan. v666: con «reproducir», Recursos, Comparar, Interlineal y Códigos ya mudados al menú «•••», la fila libera bastante sitio. v667: además, el «•••» ya no vive al final de la fila sino ANTES de la versión (ver el componente Reader) —así que la sigla, aunque sea larga, nunca vuelve a tapar el acceso al menú—. Eso permite aflojar el tope todavía más, sin ningún riesgo: 7.5rem cubre con margen un caso real que a Giovani le tocó de verdad («SPANISH RV-BRG», que a 6.5rem seguía recortándose por apenas unos píxeles) y sigue sin tocar ninguna sigla normal. Un tope completo no es realista: «Jeremías 26:5» solo, con la letra grande del teléfono, ya ocupa buena parte de un iPhone chico, así que una sigla de verdad larga puede seguir necesitando un pequeño desplazamiento para leerse entera —pero ese desplazamiento ya no esconde ningún control: el «•••», con todo lo que contiene, se ve siempre sin moverse. */ @media (max-width:640px){.vbtn-label{max-width:7.5rem}}@media (max-width:900px){.rmode{gap:.3rem;overflow-x:auto;scrollbar-width:none}.rmode::-webkit-scrollbar{display:none}.rmode .step{width:26px;height:26px}}.rsel{display:inline-flex}.rbtn{display:inline-flex;align-items:baseline;gap:.3rem;background:none;border:1px solid transparent;border-radius:var(--r-control);cursor:pointer;padding:.18rem .45rem;color:var(--vellum);font-family:var(--f-disp);font-size:var(--t-sm);font-weight:600;letter-spacing:-.022em;white-space:nowrap}.rbtn:hover{background:var(--panel-2);border-color:var(--line)}.rbtn b{font-weight:600} /* v706 (a pedido de Giovani): «por qué el versículo y la versión tienen un punto?» —en pantalla ANCHA, donde «RefPicker»/«VersionPicker» se ven completos, no dentro del menú «•••» de teléfono—. No era un punto: es la misma flechita «▾» que en v669/v672 ya se había identificado como el problema (a font-size:var(--t-xs) y opacity:.5 se lee como un puntito gris, no como un triángulo), pero aquellas dos correcciones sólo la ocultaban dentro de «@media (max-width:900px)» —pensando que en pantalla ancha, más grande, sí se vería bien—. No es así: el mismo tamaño reducido y la misma opacidad hacen que se vea igual de mal ahí también. Se oculta aquí, en la regla base, así que ya no hace falta la que la ocultaba sólo en angosto —la de abajo, en «@media (max-width:900px)», queda sin efecto pero no estorba—. */ .rbtn .caret{display:none} /* v676 (a pedido de Giovani): al quitar la cabecera «Ir a un pasaje» / «X» del panel de pantalla angosta, cerrar quedó en manos del segundo toque sobre este mismo botón —«.rbtn», ya marcado con «data-on="1"» mientras el panel/menú está abierto (ver el comentario en `RefPicker`: «el segundo toque cierra, como el botón de versión desde v508»)—. Pero medido con Playwright, ese «data-on="1"» no cambiaba nada visible: las reglas de «botón presionado» que ya existen en la hoja de estilos están todas prendidas a la clase «.chip» (`.chip[data-on="1"]{...}`), y «.rbtn» nunca llevó esa clase —a diferencia de «.vbtn» («chip vbtn»), cuyo estado presionado SÍ se veía siempre—. Sin esta regla, quitar la «X» habría dejado el cierre funcionando pero invisible. Mismo aspecto que «.chip[data-on="1"]», para que ambos botones de la fila —referencia y versión— se sientan de la misma familia al estar «abiertos». */ .rbtn[data-on="1"]{background:var(--vellum);border-color:var(--vellum);color:var(--void)} .rmenu{position:fixed;z-index:600;display:flex;flex-direction:column;background:var(--void);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 20px 60px #14120a38;overflow:hidden}.rfiltro{padding:var(--s-2) var(--s-3);border-bottom:1px solid var(--line-soft);flex:0 0 auto}/* v608 (a pedido de Giovani): «se ve anticuado» —la caja rellena con borde se cambia por una línea simple abajo, igual que el buscador flotante (Paleta), letra más grande, sin fondo de tarjeta. */ .rcols{display:flex;flex:1;min-height:0;min-width:0;overflow:hidden}.rmenu[data-estrecho="1"]{position:fixed;inset:0;width:auto;height:auto;max-height:none;border:0;border-radius:0;box-shadow:none;z-index:80;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);box-sizing:border-box}.rtitulo{display:flex;align-items:flex-start;gap:var(--s-2);justify-content:space-between;flex:0 0 auto;padding:var(--s-2) var(--s-2) var(--s-2) var(--s-3);border-bottom:1px solid var(--line-soft)}.rtitulo span{font-family:var(--f-ui);font-size:var(--t-lead);font-weight:600;color:var(--vellum);min-width:0;line-height:1.3}.rtitulo button{flex:0 0 34px;background:var(--panel-2);border:0;border-radius:50%;width:34px;height:34px;cursor:pointer;color:var(--dim);font-size:var(--t-h3);line-height:1}.rmenu[data-estrecho="1"] .rfiltro{padding:var(--s-2)} /* v608 (a pedido de Giovani): el campo se refresca con el mismo look de la ventana flotante —sin caja completa, sólo la línea de abajo—, con micrófono, «ventana moderna y simple». */ .rfiltro{position:relative} .rfiltro-mic{position:absolute;top:50%;right:var(--s-2);transform:translateY(-50%); width:30px;height:30px;border-radius:50%;background:none;border:0;cursor:pointer; display:flex;align-items:center;justify-content:center;color:var(--muted)} .rfiltro-mic svg{width:18px;height:18px} .rfiltro-mic[data-on="1"]{color:#c0392b;background:#c0392b1a}.panelref{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0;overflow-x:hidden;background:var(--void);border-top:1px solid var(--line-soft)}.panelref .rlist,.panelref .rgrid{flex:1;min-height:0;overflow-y:auto;max-height:none}.panelref .rgrid{display:flex;flex-wrap:wrap;gap:var(--s-1);padding:var(--s-2);align-content:flex-start}.rmigas{display:flex;align-items:center;gap:var(--s-05);padding:var(--s-2) var(--s-3);border-bottom:1px solid var(--line-soft);flex:0 0 auto;overflow-x:auto;scrollbar-width:none}.rmigas::-webkit-scrollbar{display:none}.rmigas span{color:var(--line);flex:0 0 auto}.rmigas button{background:none;border:0;cursor:pointer;padding:var(--s-1) var(--s-1);border-radius:var(--r-control);color:var(--muted);font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;white-space:nowrap;flex:0 0 auto}.rmigas button[data-on="1"]{background:var(--vellum);color:var(--void)}.rcols[data-paso=libro] .rcol:not([data-col=libro]),.rcols[data-paso=capitulo] .rcol:not([data-col=capitulo]),.rcols[data-paso=versiculo] .rcol:not([data-col=versiculo]){display:none}.rcols:not([data-paso=todo]) .rcol{border-right:0;min-width:0}.rcols[data-paso=todo] .rcol{flex:0 0 220px;min-width:0}.rcols:not([data-paso=todo]) .rcol{flex:1 1 100%;max-width:100%}.rcols:not([data-paso=todo]) .rcolh{display:none}.rcols:not([data-paso=todo]) .rlist,.rcols:not([data-paso=todo]) .rgrid{max-height:none;flex:1}.rcol{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--line-soft)}.rcol:first-child,.rcol.rnum{min-width:0}.rcol:last-child{border-right:0}.rcolh{padding:.4rem var(--s-2);font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--muted);border-bottom:1px solid var(--line-soft);flex:0 0 auto}.rlist{overflow-y:auto;overscroll-behavior:contain;flex:1;min-height:0}.rgrid{overflow-y:auto;overscroll-behavior:contain;flex:1;min-height:0;display:flex;flex-wrap:wrap;gap:var(--s-05);padding:var(--s-1);align-content:flex-start}.rit{display:flex;align-items:baseline;gap:.5rem;width:100%;background:none;border:0;cursor:pointer;padding:.35rem var(--s-2);text-align:left;color:var(--dim);font-family:var(--f-ui);font-size:var(--t-sm)}.rit:hover{background:var(--panel-2);color:var(--vellum)}.rit[data-on="1"]{background:var(--vellum);color:var(--void)}.rab{font-size:var(--t-xs);font-weight:600;opacity:.6;flex:0 0 2.2rem}/* v608: sin borde —más suave, menos «botón de formulario»—. El fondo es la única señal: transparente en reposo, un tinte leve al pasar el mouse, sólido cuando está elegido. */ .rnu{min-width:2rem;padding:var(--s-1) var(--s-05);background:none;border:0;border-radius:var(--r-control);cursor:pointer;color:var(--dim);font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;font-variant-numeric:tabular-nums;text-align:center;transition:background .14s,color .14s}.rnu:hover{background:var(--panel-2);color:var(--vellum)}.rnu[data-on="1"]{background:var(--vellum);color:var(--void)}.rvacio{padding:var(--s-2);color:var(--muted);font-size:var(--t-xs);line-height:1.7}.rvacio b{color:var(--vellum)}.rmini{display:inline-block;margin:.1rem .15rem 0 0;padding:.08rem .35rem;background:var(--panel-2);border:0;border-radius:var(--r-control);cursor:pointer;color:var(--vellum);font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;font-variant-numeric:tabular-nums}.rmini:hover{background:var(--vellum);color:var(--void)}.rnu[data-hay="0"]{opacity:.38}.rnu[data-hay="1"]{color:var(--vellum)}.rmode h2{margin:0;font-family:var(--f-disp);font-weight:400;font-size:var(--t-h3);letter-spacing:-.025em;line-height:1;white-space:nowrap}.rmode h2 em{font-style:normal;color:var(--ash)}.seg{display:inline-flex;align-self:flex-start;background:var(--panel-2);border-radius:var(--r-control);padding:2px}.seg button{background:none;border:0;color:var(--ash);cursor:pointer;border-radius:var(--r-control);font-family:var(--f-ui);font-size:var(--t-sm);font-weight:500;padding:var(--s-1) var(--s-2);transition:all .14s}.seg button:hover{color:var(--vellum)}.seg button[data-on="1"]{background:var(--void);color:var(--vellum);box-shadow:0 1px 3px #14120a1a}.vbtn{display:inline-flex;align-items:center;gap:.3rem}.vsel{display:inline-flex}.vsel .caret{display:none}/* v706: mismo motivo que «.rbtn .caret», justo arriba —el botón de versión también se veía con un «punto» en pantalla ancha. */.vmenu{position:fixed;z-index:600;display:flex;flex-direction:column;background:var(--void);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 20px 60px #14120a38;overflow:hidden}.vhead,.vadd{flex:0 0 auto}.vhead{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;padding:var(--s-2);font-size:var(--t-xs);color:var(--muted);border-bottom:1px solid var(--line-soft)}.vcuenta{display:flex;align-items:baseline;gap:.3rem;font-size:var(--t-sm);color:var(--muted)}.vcuenta b{color:var(--vellum);font-weight:600;font-variant-numeric:tabular-nums}.vcuenta em{font-style:normal;color:var(--line);margin:0 .15rem}.vacc{display:flex;gap:.3rem;margin-left:auto}.vacc button{background:none;border:1px solid var(--line);border-radius:var(--r-control);cursor:pointer;padding:.18rem .45rem;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--vellum)}.vacc button:hover:not(:disabled){background:var(--panel-2)}.vacc button:disabled{opacity:.35;cursor:default}.panes::-webkit-scrollbar{height:6px}.panes::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}.vlista{overflow-y:auto;overscroll-behavior:contain;flex:1;min-height:0}.vfiltro{padding:var(--s-1) var(--s-2);border-bottom:1px solid var(--line-soft);flex:0 0 auto}.vfiltro input{width:100%;background:var(--panel-2);border:1px solid transparent;border-radius:var(--r-control);padding:.4rem .6rem;color:var(--vellum);font-family:var(--f-ui);font-size:var(--t-sm)}.vfiltro input:focus{outline:0;background:var(--void);border-color:var(--vellum)}.vvacio{padding:var(--s-3) var(--s-2);color:var(--muted);font-size:var(--t-sm)}.vrow{display:flex;align-items:center;width:100%;border-bottom:1px solid var(--line-soft)}.vrow:last-child{border-bottom:0}.vrow:hover{background:var(--panel-2)}.vtog{display:flex;align-items:center;gap:var(--s-2);flex:1;min-width:0;background:none;border:0;cursor:pointer;padding:var(--s-2);text-align:left;color:var(--dim);font-family:var(--f-ui);font-size:var(--t-sm)}.vsolo{flex:0 0 auto;margin-right:var(--s-2);background:none;border:1px solid var(--line);border-radius:99px;cursor:pointer;padding:.16rem .5rem;color:var(--muted);font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;white-space:nowrap}.vsolo:hover{border-color:var(--vellum);color:var(--vellum)}.vsolo[data-unica="1"]{background:var(--vellum);border-color:var(--vellum);color:var(--void)}.vrow[data-on="1"]{color:var(--vellum)}.vbox{width:16px;height:16px;border:1px solid var(--line);border-radius:var(--r-control);display:inline-flex;align-items:center;justify-content:center;font-size:var(--t-xs);flex:0 0 16px}.vrow[data-on="1"] .vbox{background:var(--vellum);border-color:var(--vellum);color:var(--void)}.vab{font-weight:600;flex:0 1 auto;min-width:2.6rem;white-space:nowrap}@media (min-width:560px){.vab{flex:0 0 96px}}.vnm{color:var(--ash);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.vcov{font-size:var(--t-xs);color:var(--muted);white-space:nowrap;background:var(--panel-2);padding:.1rem .4rem;border-radius:99px}.vcov.falta{color:var(--crimson);background:transparent}@media (max-width:560px){.vhead{align-items:flex-start}.vcuenta{flex:1 1 100%}.vacc{margin-left:0;flex:1 1 100%;flex-wrap:wrap}.vacc button{flex:1 1 auto;padding:.3rem .5rem;white-space:nowrap}.vcov{display:none}.vcov.falta{display:inline;font-weight:600}.vtog{padding:var(--s-2) var(--s-1)}.vsolo{margin-right:var(--s-1)}}.vadd{display:block;width:100%;text-align:left;background:var(--panel-2);border:0;cursor:pointer;padding:var(--s-2);border-top:1px solid var(--line);font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum)}.vadd:hover{background:var(--line-soft)}.vadd span{display:block;font-weight:400;font-size:var(--t-xs);color:var(--muted);margin-top:.15rem;white-space:normal;line-height:1.5}.sbar{display:flex;flex-direction:column;align-items:stretch;margin:0 0 var(--s-4)}.sbar .field{flex:0 0 auto;min-width:0;min-height:100px;padding-top:var(--s-2);padding-bottom:var(--s-2);resize:none}.scount{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);letter-spacing:0;text-transform:none;margin-bottom:var(--s-2);font-size:var(--t-sm)}.sres{display:block;width:100%;text-align:left;background:none;border:0;cursor:pointer;border-bottom:1px solid var(--line-soft);padding:var(--s-2) var(--s-2);transition:background .12s;max-width:var(--w-read)}.sres:hover{background:var(--panel-2)}.sres[data-now="1"]{background:var(--mark)}.sres .rr{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum);letter-spacing:0;margin-bottom:var(--s-1)}.sres .rt{font-family:var(--f-read);font-size:var(--t-body);line-height:1.68;color:var(--dim)}.sres mark{background:var(--mark);color:var(--vellum);padding:0 .12em;border-radius:2px}.xcard{padding:var(--s-2) 0;border-bottom:1px solid var(--line-soft)}.xcard:last-child{border-bottom:0}/* QUE NO SE PARTA EN DOS. «Proverbios 8:22» rompía la referencia Y el sello en dos líneas cada uno, porque la fila no admitía salto y los dos se estrujaban. Ahora la fila salta si hace falta y ninguna de las dos piezas se parte por dentro. */ .xtop{display:flex;align-items:baseline;gap:var(--s-1);flex-wrap:wrap; margin-bottom:var(--s-1)} .xtop .xref-b,.xtop .badge{white-space:nowrap;flex:0 0 auto} .xtop .quitaref{margin-left:auto}.xref-b{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--lapis);letter-spacing:0;background:none;border:0;cursor:pointer;padding:0}.xref-b:hover,.xv:hover{text-decoration:underline;color:var(--lapis-hi)} /* v682 (a pedido de Giovani): la FUENTE (qué diccionario habla) con el mismo lenguaje de color en todos lados: dorado, versalita, con tracking —igual que «.lexgrupo-t» en Recursos—, no la píldora gris que traía antes y que no se parecía a nada más de la app. */ .xsrc{font-family:var(--f-ui);font-size:var(--t-xs);font-weight:400;letter-spacing:.08em;text-transform:uppercase;color:var(--oro-texto);background:none;padding:0;border-radius:0}.xtxt{font-family:var(--f-read);font-size:var(--t-body);line-height:1.72;color:var(--dim);max-width:64ch}.xnexo{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);letter-spacing:0;text-transform:none;line-height:1.6;margin-top:var(--s-1);font-size:var(--t-sm)}.xrow{display:flex;gap:var(--s-2);align-items:flex-start;padding:var(--s-2) 0;border-bottom:1px solid var(--line-soft);max-width:var(--w-mid)}.xv{flex:0 0 auto;font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum);letter-spacing:0;background:none;border:0;cursor:pointer;flex:0 1 92px;min-width:0;text-align:left;padding-top:var(--s-1)}.xv:hover{text-decoration:underline}.selbar{position:fixed;z-index:150;transform:translate(-50%,calc(-100% - 10px));display:flex;align-items:center;gap:.15rem;background:var(--vellum);border-radius:99px;padding:.25rem .3rem;box-shadow:0 8px 28px #14120a4d;animation:sube .13s ease;flex-wrap:wrap;min-width:0}@keyframes sube{0%{opacity:0;transform:translate(-50%,calc(-100% - 2px))}}.selbar:after{content:"";position:absolute;left:50%;bottom:-5px;width:10px;height:10px;background:var(--vellum);transform:translate(-50%) rotate(45deg)}.selbar button{position:relative;z-index:1;background:none;border:0;cursor:pointer;color:var(--void);font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;padding:.34rem .7rem;border-radius:99px;white-space:nowrap}.selbar button:hover{background:#ffffff29}.selsep{width:1px;height:15px;background:#ffffff38}.avisocopia{position:fixed;left:50%;bottom:var(--s-4);transform:translate(-50%);z-index:120;background:var(--vellum);color:var(--void);border-radius:99px;padding:.4rem .9rem;font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;box-shadow:0 8px 30px #14120a3d}.panes{display:flex;flex:1 1 auto;min-width:0;background:var(--ink);align-items:stretch;overflow-x:auto;overscroll-behavior-x:contain}.pane{flex:1 1 clamp(280px,32vw,520px);min-width:0;padding:var(--s-3) 16px var(--s-6);position:relative}.pane+.watermark{display:none}.panetag{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;letter-spacing:.01em;text-transform:none;color:var(--muted);margin-bottom:var(--s-2)}.verse{display:block;cursor:pointer;padding:var(--s-1) 0;border-radius:var(--r-control);transition:background .16s,opacity .3s;max-width:min(104ch,100%)}.verse:hover{background:var(--panel-2);box-shadow:-.4rem 0 0 var(--panel-2),.4rem 0 0 var(--panel-2)}.verse[data-sel="1"]{background:var(--mark);box-shadow:-.4rem 0 0 var(--mark),.4rem 0 0 var(--mark)}.verse .num{font-family:var(--f-ui);font-variant-numeric:tabular-nums;font-size:.72em;font-weight:700;color:var(--oro-texto);vertical-align:super;line-height:0;user-select:none;margin-right:.28em;letter-spacing:0}.verse[data-sel="1"] .num{color:var(--oro-texto);font-weight:600}.cmp .verse .num{font-family:var(--f-ui);font-variant-numeric:tabular-nums;font-size:.72em;font-weight:700;color:var(--oro-texto);vertical-align:super;line-height:0;user-select:none;margin-right:.28em;letter-spacing:0}.verse .txt{display:inline;user-select:text;-webkit-user-select:text;font-family:var(--f-read);font-size:var(--t-lead);line-height:1.75;color:var(--vellum);font-weight:400}.verse .txt.en{color:var(--dim)}.sg{font-family:var(--f-ui);font-variant-numeric:tabular-nums;font-size:.58em;font-weight:600;color:var(--sg);background:none;border:0;padding:0 .12em 0 .04em;cursor:pointer;vertical-align:.42em;line-height:1;letter-spacing:0}.sg:hover{color:var(--crimson);text-decoration:underline}.dlista{margin-top:var(--s-2)}.dmod{border-bottom:1px solid var(--line-soft)}.dmodh{display:flex;align-items:center;gap:var(--s-2);width:100%;background:none;border:0;cursor:pointer;padding:var(--s-2) 0;text-align:left;font-family:var(--f-ui);font-size:var(--t-ui);color:var(--ash)}.dmodh:hover .dnom{text-decoration:underline;text-underline-offset:3px}.dmodh:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:3px}.dnom{flex:1;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dn{font-size:var(--t-xs);color:var(--muted);background:var(--panel-2);padding:.1rem .4rem;border-radius:99px;font-variant-numeric:tabular-nums}.dcar{color:var(--muted);width:1rem;text-align:center}.dents{display:flex;flex-wrap:wrap;gap:.25rem;padding:0 0 var(--s-2)}.dent{background:var(--panel-2);border:0;border-radius:var(--r-control);cursor:pointer;padding:.16rem .45rem;color:var(--dim);font-family:var(--f-ui);font-size:var(--t-xs)}.dent:hover{background:var(--vellum);color:var(--void)}/* v662: «.multilex» se retira —era la caja propia de la vista de un Strong suelto, ahora reemplazada por «.lexgrupo»/«.lexgrupo-t», el mismo encabezado por diccionario que ya usaba la búsqueda por palabra más abajo—. Sin usos, se quita en vez de dejarla muerta. */.sgcode{display:flex;align-items:baseline;gap:var(--s-2);padding-bottom:var(--s-2);margin-bottom:var(--s-3);border-bottom:1px solid var(--line)}.sgcode b{font-family:var(--f-disp);font-weight:400;font-size:2rem;letter-spacing:-.02em} /* v682 (a pedido de Giovani): la MIGA DE PAN entre números Strong. Cada paso es un botón —el código donde se estuvo— y una flecha separadora muda; el actual va al final, en el mismo tono apagado que el resto de la miga, sin botón porque ya está a la vista arriba en «.sgcode». */ .migaja{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem;margin:calc(-1 * var(--s-2)) 0 var(--s-3);font-family:var(--f-ui);font-size:var(--t-xs)} .migaja-paso{display:inline-flex;align-items:center;gap:.2rem} .migaja-b{background:none;border:0;padding:0;cursor:pointer;color:var(--ash);font-family:inherit;font-size:inherit;font-variant-numeric:tabular-nums} .migaja-b:hover{color:var(--vellum);text-decoration:underline} .migaja-sep{color:var(--ash);opacity:.6} .migaja-actual{color:var(--muted);font-variant-numeric:tabular-nums}.dot{display:inline-block;width:5px;height:5px;border-radius:50%;margin-left:.4rem;vertical-align:.32em}.dot.note{background:var(--vellum)}.dot.app{background:var(--crimson)}.cmp-ref{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h2);margin:0 0 var(--s-3);letter-spacing:-.025em;color:var(--vellum)}.cmp{padding:0 0 var(--s-3);margin-bottom:var(--s-3);border-bottom:1px solid var(--line-soft);max-width:min(104ch,100%)}.cmp:last-child{border-bottom:0}.cmp .src{font-size:var(--t-sm);font-weight:600;color:var(--ash);margin-bottom:var(--s-1)}.cmp-txt{font-family:var(--f-read);font-size:var(--t-lead);line-height:1.75;color:var(--vellum)}.empty{font-family:var(--f-read);font-size:var(--t-body);line-height:1.68;color:var(--muted)}.sidescroll{display:flex;align-items:center;gap:.45rem;flex:1;min-width:0;flex-wrap:wrap;row-gap:.45rem}.divisoria{flex:0 0 10px;cursor:col-resize;display:flex;align-items:center;justify-content:center;background:var(--ink);position:relative;touch-action:none}.divisoria span{width:2px;height:34px;border-radius:2px;background:var(--line);transition:background .14s,height .14s}.divisoria:hover span,.divisoria:focus-visible span{background:var(--vellum);height:64px}.divisoria:focus-visible{outline:2px solid var(--vellum);outline-offset:-2px}.sidex{flex:0 0 30px;background:none;border:0;cursor:pointer;color:var(--ash);font-size:var(--t-lead);line-height:1;border-radius:var(--r-control)}.sidex:hover{background:var(--panel-2);color:var(--vellum)}.sidetabs{display:flex;align-items:center;gap:var(--s-1);background:var(--void);padding:var(--s-1) 16px;border-bottom:1px solid var(--line)}.sidetab{flex:0 0 auto;white-space:nowrap;background:var(--panel-2);border:0;color:var(--ash);padding:.5rem 1.1rem;cursor:pointer;border-radius:var(--r-control);font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;transition:background .14s,color .14s}.sidetab[data-on="1"],.sidetab[data-on="1"]:hover{background:var(--vellum);color:var(--void)}.sidetab:hover{color:var(--vellum)}.sidetab[data-on="1"]:hover{color:var(--void)}.sidebody{padding:var(--s-3) var(--s-3) var(--s-6) var(--s-2)}.sidehead:first-child,.pane>.sidehead:first-of-type{margin-top:0}/* v643 (a pedido de Giovani): «.sidehead» estaba declarado dos veces —una vieja sin font-family, y ésta, más nueva, que le ganaba—. Consolidado en una sola regla con los valores que de verdad ganaban. */ .sidehead{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;letter-spacing:.01em;text-transform:none;color:var(--vellum);margin:var(--s-4) 0 var(--s-2)}.qbloque{margin:var(--s-4) 0}.qbloque-t{margin:0 0 var(--s-2);font-family:var(--f-ui);font-size:var(--t-xs);letter-spacing:.09em;text-transform:uppercase;color:var(--oro-texto);border-bottom:1px solid var(--line);padding-bottom:.3rem}.qterms{display:grid;gap:var(--s-2)}.qterm{display:grid;grid-template-columns:auto auto auto 1fr;gap:.1rem .5rem;align-items:baseline;width:100%;text-align:left;background:none;border:1px solid var(--line);border-radius:var(--radius);padding:var(--s-2) var(--s-3);cursor:pointer;transition:border-color .16s ease}.qterm:hover:not(:disabled){border-color:var(--gold)}.qterm:disabled{cursor:default}.qterm-o{font-family:var(--f-heb);font-size:var(--t-lead);color:var(--vellum)}.qterm-tr{font-family:var(--f-ui);font-size:var(--t-ui);color:var(--ash);font-style:italic}.qterm-c{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--oro-texto);border:1px solid var(--line);border-radius:99px;padding:.05rem .45rem;font-variant-numeric:tabular-nums}.qterm-g{grid-column:1/-1;color:var(--dim)}.qterm-m{grid-column:1/-1;font-size:var(--t-ui);color:var(--ash)}.qdisc{border-left:2px solid var(--line);padding:.1rem 0 .1rem var(--s-3);margin-bottom:var(--s-3)}.qdisc-p{color:var(--vellum)}.qdisc-q{font-family:var(--f-ui);font-size:var(--t-ui);color:var(--ash);margin-top:.15rem}.qtemas{display:flex;flex-wrap:wrap;gap:.4rem}.qtema{background:none;border:1px solid var(--line);border-radius:99px;padding:.25rem .7rem;font-family:var(--f-ui);font-size:var(--t-ui);color:var(--lapis);cursor:pointer}.qtema:hover{border-color:var(--lapis)}.lexgrupo{margin-bottom:var(--s-4)}.lex-def{margin:0 0 .5rem}.lex-fuente{display:inline-block;margin-right:.4rem;padding:.05rem .4rem;border-radius:3px;background:var(--line-soft);font-family:var(--f-ui);font-size:var(--t-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--ash);vertical-align:.1em}.lexgrupo-t{display:flex;align-items:baseline;gap:.5rem;margin:0 0 var(--s-2);font-family:var(--f-ui);font-size:var(--t-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--oro-texto);border-bottom:1px solid var(--line);padding-bottom:.3rem}.lexgrupo-n{margin-left:auto;font-variant-numeric:tabular-nums;color:var(--ash);letter-spacing:0;text-transform:none}.lex-cab{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.25rem}.lex-num{flex:none;min-width:1.3em;font-family:var(--f-ui);font-size:var(--t-xs);font-variant-numeric:tabular-nums;color:var(--ash)}.lex-code{margin-left:auto;background:none;border:1px solid var(--line);border-radius:99px;padding:.05rem .45rem;font-family:var(--f-ui);font-size:var(--t-xs);color:var(--oro-texto);cursor:pointer;font-variant-numeric:tabular-nums}.lex-code:hover{border-color:var(--gold);color:var(--oro-texto)}.lex{padding:0 0 var(--s-3);margin-bottom:var(--s-3);border-bottom:1px solid var(--line-soft)}.lex:last-child{border-bottom:0}/* v682 (a pedido de Giovani): estándar único para el TÍTULO de cualquier entrada de diccionario, la viva la vea donde la vea —Léxico («.lex-cab»), Concordancia y Estudio («.xtop»)—. Antes «.orig» sólo funcionaba dentro de «.lex» y a dos tamaños distintos según la vista (h2 en la búsqueda por palabra, 1.15rem puesto a mano en la vista de un Strong): la misma palabra hebrea se veía más grande o más chica según por dónde se entrara. Se saca del scope de «.lex» —así sirve también en las tarjetas de Concordancia y Estudio, que no viven dentro de un «.lex»— y se fija en el tamaño ya afinado a mano. */ .orig{font-family:var(--f-heb);font-size:var(--t-body);color:var(--vellum);line-height:1.3}.lex .translit{font-size:var(--t-ui);color:var(--ash)}.lex .code{font-family:var(--f-ui);font-variant-numeric:tabular-nums;font-size:var(--t-sm);color:var(--ash)}.lex p{font-family:var(--f-read);font-size:var(--t-body);line-height:1.72;color:var(--dim);margin:var(--s-1) 0 0}.lex .occ{font-size:var(--t-sm);color:var(--ash);margin-top:var(--s-1)}.fmt{font-family:var(--f-read);font-size:var(--t-body);line-height:1.72;color:var(--dim)}.fmt-h2{font-family:var(--f-ui);font-size:var(--t-lead);font-weight:600;color:var(--vellum);margin:var(--s-4) 0 var(--s-2);padding-bottom:.3rem;border-bottom:1px solid var(--line-soft)}.fmt-h2:first-child{margin-top:0}.fmt-h2{display:flex;align-items:baseline;gap:.55rem}.fmt-n{flex:none;min-width:1.4em;color:var(--oro-texto);font-variant-numeric:tabular-nums}.fmt-h3{font-family:var(--f-ui);font-size:var(--t-body);font-weight:600;color:var(--dim);margin:var(--s-3) 0 .3rem}.fmt-p{margin:0 0 var(--s-2)}.prosa,.ev-head p.prosa,.cc-head /* v646 (a pedido de Giovani): Hilo, Evidencia y Módulos pasaron a «sub prosa» también —los once módulos comparten ya una sola clase, sin la mención especial de «.prosa» sola que hacía falta antes. */ .sub.prosa,.wd-head .sub.prosa,.sc-head .sub.prosa,.tl-head .sub.prosa{max-width:85%}@media (max-width:640px){.cc-head .sub.prosa,.wd-head .sub.prosa,.sc-head .sub.prosa,.tl-head .sub.prosa,.thread-hero .sub.prosa,.ev-head .sub.prosa{max-width:none}}.fmt h2,.fmt h3{font-family:var(--f-ui);font-size:var(--t-body);font-weight:700;color:var(--vellum);letter-spacing:-.005em;line-height:1.45;margin:var(--s-3) 0 var(--s-1)}.fmt h2:first-child,.fmt h3:first-child{margin-top:0}.fmt strong{color:var(--vellum);font-weight:600}.fmt-ul,.fmt-ol{margin:0 0 var(--s-2);padding-left:1.1rem}.fmt-ul li,.fmt-ol li{margin:.25rem 0}.fmt-dl{display:flex;gap:var(--s-2);align-items:baseline;margin:0 0 .4rem}.fmt-ref{flex:0 0 auto;background:var(--panel-2);border:0;border-radius:var(--r-control);cursor:pointer;padding:.1rem .4rem;color:var(--vellum);font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600}.fmt-ref:hover{background:var(--vellum);color:var(--void)}.ai-out{font-family:var(--f-read);font-size:var(--t-body);line-height:1.7;color:var(--dim);white-space:pre-wrap}.ai-out h4{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;letter-spacing:0;text-transform:none;color:var(--vellum);margin:var(--s-3) 0 var(--s-1)}.btn{display:inline-flex;align-items:center;gap:var(--s-1);background:var(--void);border:1px solid var(--line);color:var(--vellum);font-family:var(--f-ui);font-size:var(--t-ui);font-weight:500;letter-spacing:0;padding:var(--s-1) var(--s-2);cursor:pointer;border-radius:var(--r-control);transition:all .14s;text-transform:none}.btn:hover:not(:disabled){background:var(--panel-2);border-color:var(--ash)}.btn:disabled{opacity:.4;cursor:default}.btn.primary{background:var(--vellum);border-color:var(--vellum);color:var(--void)}.btn.primary:hover:not(:disabled){background:#000;border-color:#000}.btn.primary:disabled{background:var(--void);border-color:var(--line);color:var(--ash);opacity:1}.notice{background:var(--panel-2);color:var(--dim);border-radius:var(--r-control);padding:var(--s-2) var(--s-2);font-size:var(--t-ui);line-height:1.6;margin:var(--s-2) 0}.btn:focus-visible{outline:2px solid var(--vellum);outline-offset:2px}.btn[data-on="1"],.btn[data-on="1"]:hover,.chip[data-on="1"],.chip[data-on="1"]:hover{background:var(--vellum);border-color:var(--vellum);color:var(--void)}.seg button[data-on="1"],.seg button[data-on="1"]:hover{background:var(--vellum);color:var(--void);box-shadow:none}.btnrow{display:flex;gap:var(--s-1);flex-wrap:wrap;margin-bottom:var(--s-2)}.field{width:100%;background:var(--void);border:1px solid var(--line);color:var(--vellum);font-family:var(--f-ui);font-size:var(--t-ui);padding:var(--s-2) var(--s-2);border-radius:var(--r-control);resize:vertical}.field:focus{outline:0;border-color:var(--vellum)}.field::placeholder,.finder input::placeholder,.askbar input::placeholder,.auto::placeholder,.vfiltro input::placeholder,.aj-clave input::placeholder,.aj-campo input::placeholder,.aj-campo textarea::placeholder,.sbar input::placeholder,textarea::placeholder,input::placeholder{color:var(--pista);opacity:1}.pulse{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--vellum);animation:p 1.1s infinite}@keyframes p{0%,to{opacity:.2;transform:scale(.7)}50%{opacity:1;transform:scale(1.2)}}.shimmer{height:.7rem;border-radius:var(--r-control);margin:var(--s-1) 0;background:linear-gradient(90deg,#efece5 25%,#f8f6f1,#efece5 75%);background-size:200% 100%;animation:sh 1.4s infinite}@keyframes sh{0%{background-position:200% 0}to{background-position:-200% 0}}.ask-wrap{flex:1;overflow-y:auto;display:flex;flex-direction:column;background:var(--ink);padding-left:var(--hueco-chat);padding-right:var(--hueco-chat);box-sizing:border-box}.ask-hero[data-stuck="0"]{min-height:min(58dvh,520px);display:flex;flex-direction:column;justify-content:center}.ask-hero[data-bien="1"]{min-height:0;justify-content:flex-start;padding-bottom:0!important}.ask-hero{padding:var(--s-5) 0 var(--s-3);text-align:center;align-self:stretch;width:auto}.ask-hero[data-stuck="1"]{text-align:left;position:sticky;top:0;z-index:20;background:var(--ink);border-bottom:1px solid var(--line);padding:.8rem 0;box-shadow:0 1px 0 var(--line)}/* v640: se encontraron y quitaron siete reglas de este mismo tipo en total —una por cada contenedor de encabezado—, todas forzando el tamaño grande sobre cualquier

de adentro. */.ask-hero .sub{font-family:var(--f-read);font-size:var(--t-lead);color:var(--muted);line-height:1.7;margin:0 0 var(--s-5)}.askbar{display:flex;gap:var(--s-1);margin:0;width:100%;text-align:left}.askbar input{flex:1;background:var(--void);border:1px solid var(--line);color:var(--vellum);font-family:var(--f-ui);font-size:var(--t-body);padding:var(--s-2) var(--s-3);border-radius:var(--r-control);box-shadow:0 1px 2px #14120a0a;transition:all .16s}.askbar input:focus{outline:0;border-color:var(--vellum);box-shadow:0 4px 20px #14120a17}.askbar input::placeholder{color:var(--pista)}.mod-wrap>.upline,.mod-wrap>.btnrow,.mod-wrap>.warn,.mod-wrap>.modsecc,.mod-wrap>.grupohead,.mod-wrap>.modrow{max-width:var(--w-mid);margin-left:auto;margin-right:auto;padding-left:var(--pad-x);padding-right:var(--pad-x);box-sizing:border-box}.col{max-width:var(--w-mid);margin-left:auto;margin-right:auto;padding-left:var(--pad-x);padding-right:var(--pad-x);box-sizing:border-box;width:100%}.col-caja{max-width:var(--w-mid);margin-left:auto;margin-right:auto;box-sizing:border-box;width:100%}.askbar{display:flex;flex-direction:column;gap:.4rem;margin:0;width:100%;text-align:left;background:var(--void);border:1px solid var(--borde-campo);border-radius:var(--r-tarjeta);padding:.75rem .85rem .6rem;transition:border-color .15s,box-shadow .15s}.askbar:focus-within{border-color:var(--vellum);box-shadow:0 0 0 3px var(--panel-2)}.askbar[data-oyendo="1"]{border-color:var(--crimson)}.askbar textarea{min-height:1.55em;width:100%;background:none;border:0;resize:none;outline:0;color:var(--vellum);font-family:var(--f-ui);font-size:var(--t-ui);line-height:1.55;max-height:200px;overflow-y:auto;padding:0}.askbar textarea::placeholder{color:var(--ash)}.askctrl{display:flex;align-items:center;gap:.4rem}.askhint{flex:1;font-family:var(--f-ui);font-size:var(--t-xs);color:var(--crimson)}.askic{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--r-control);border:0;background:none;color:var(--ash);cursor:pointer;transition:background .14s,color .14s}.askic:hover:not(:disabled){background:var(--panel-2);color:var(--vellum)}.askic[data-on="1"]{color:var(--crimson);background:var(--panel-2)}.askic:disabled{opacity:.4;cursor:default}.askenviar{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--r-control);border:0;cursor:pointer;background:var(--punto-ia);color:var(--void);transition:opacity .14s,transform .1s}.askenviar:hover:not(:disabled){transform:translateY(-1px)}.askenviar:disabled{opacity:.35;cursor:default}@keyframes askgirar{to{transform:rotate(360deg)}}.askgiro{width:13px;height:13px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:askgirar .7s linear infinite}.askaviso{margin:.5rem 0 0;text-align:center;font-family:var(--f-ui);font-size:var(--t-xs);color:var(--ash);line-height:1.5}.seed{background:var(--void);border:1px solid var(--line);color:var(--dim);font-family:var(--f-ui);font-size:var(--t-ui);font-style:normal;padding:var(--s-1) var(--s-2);border-radius:99px;cursor:pointer;transition:all .14s}.seed:hover{border-color:var(--vellum);color:var(--vellum)}.stream{padding:var(--s-2) 0 var(--s-6);margin:0 auto;width:100%}.ask-wrap>.warn,.ask-wrap>.notice{box-sizing:border-box;margin-inline:auto}.qline{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h2);color:var(--vellum);margin:var(--s-5) 0 var(--s-3);letter-spacing:-.03em;line-height:1.25}.answer{font-family:var(--f-read);font-size:var(--t-lead);line-height:1.72;color:var(--dim)}.answer p{margin:0 0 var(--s-2)}.capas{margin:var(--s-3) 0}.capas-t{display:flex;align-items:baseline;gap:.5rem;margin:0 0 var(--s-2);font-family:var(--f-ui);font-size:var(--t-xs);letter-spacing:.09em;text-transform:uppercase;color:var(--oro-texto)}.capas-t i{font-style:normal;color:var(--ash);letter-spacing:0;font-variant-numeric:tabular-nums}.capabar{display:flex;gap:var(--s-1);flex-wrap:wrap}.capabtn{display:inline-flex;align-items:center;gap:.4rem;background:var(--void);border:1px solid var(--gold);border-radius:99px;cursor:pointer;padding:.28rem .7rem;color:var(--dim);font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;transition:background .16s ease,color .16s ease}.capabtn-mas{color:var(--oro-texto);font-size:.95em;line-height:1}.capabtn-ia{width:5px;height:5px;border-radius:50%;background:var(--punto-ia);flex:none}.capabtn[data-visto="1"]:not([data-on="1"]){background:var(--mark)}.capabtn:hover:not(:disabled){background:var(--mark);color:var(--vellum)}.capabtn[data-on="1"]:not(:disabled){background:var(--vellum);border-color:var(--vellum);color:var(--void)}.capabtn[data-on="1"] .capabtn-mas,.capabtn[data-on="1"] .capabtn-ia{color:var(--void);background:var(--void)}.capabtn[data-on="1"] .capabtn-mas{background:none}.capabtn:disabled{opacity:.4;cursor:default}.capabox{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card);margin-top:var(--s-2)}.tradblk{padding-bottom:var(--s-3);margin-bottom:var(--s-3);border-bottom:1px solid var(--line-soft)}.tradblk:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}.tradrow{display:flex;gap:var(--s-2);align-items:baseline;padding:.28rem 0}.tradab{flex:0 1 76px;min-width:0;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--muted)}.tradtx{font-family:var(--f-read);font-size:var(--t-body);line-height:1.6;color:var(--dim);flex:1}.ideafrase{font-family:var(--f-disp);font-size:var(--t-h3);font-weight:600;letter-spacing:-.02em;line-height:1.3;color:var(--vellum);margin:0 0 var(--s-2)}.cites{display:flex;flex-direction:column;gap:var(--s-2);margin:var(--s-4) 0}.cite{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card);display:block;width:100%;text-align:left;cursor:pointer;transition:all .14s}.cite:hover{border-color:var(--ash);box-shadow:0 2px 10px #14120a0d}.cite-top{display:flex;align-items:center;gap:var(--s-1);margin-bottom:var(--s-1)}.cite-ref{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum);letter-spacing:0}.badge{font-size:var(--t-sm);font-weight:500;padding:0 var(--s-1);border-radius:99px;letter-spacing:0;text-transform:none}.badge.ok{color:var(--jade);background:#e6f4ee}.badge.no{color:var(--crimson);background:#fbeae8}.cite-txt{font-family:var(--f-read);font-size:var(--t-body);line-height:1.75;color:var(--vellum)}.cite-why{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);letter-spacing:0;text-transform:none;line-height:1.6;margin-top:var(--s-1);font-size:var(--t-sm)}.follow{display:flex;flex-direction:column;gap:var(--s-1);margin-top:var(--s-3)}.followb{background:none;border:1px solid var(--line);color:var(--dim);text-align:left;font-family:var(--f-ui);font-size:var(--t-ui);padding:var(--s-2) var(--s-2);border-radius:var(--r-control);cursor:pointer;transition:all .14s}.followb:hover{border-color:var(--vellum);color:var(--vellum);background:var(--void)}.thread-wrap{flex:1;overflow-y:auto;background:var(--ink)}.thread-hero{padding:var(--s-5) var(--pad-x) var(--s-4);max-width:var(--w-mid);margin:0 auto}.thread-hero p{font-family:var(--f-read);font-size:var(--t-lead);color:var(--muted);line-height:1.7;margin:0;margin:0 0 var(--s-5)}.thread-bar{display:flex;gap:var(--s-1);flex-wrap:wrap}.thread-bar input{flex:1;min-width:0;flex:1 1 160px;background:var(--void);border:1px solid var(--line);color:var(--vellum);font-family:var(--f-ui);font-size:var(--t-body);padding:var(--s-2) var(--s-2);border-radius:var(--r-control)}.thread-bar input:focus{outline:0;border-color:var(--vellum)}.seeds{display:flex;gap:var(--s-1);flex-wrap:wrap;margin-top:var(--s-2)}.thread-synth{max-width:var(--w-mid);margin:0 auto;padding:var(--s-4) var(--pad-x);font-family:var(--f-read);font-size:var(--t-lead);line-height:1.72;color:var(--dim);border-top:1px solid var(--line)}.thread-synth strong{color:var(--vellum);font-weight:500}.thread-line{position:relative;max-width:var(--w-mid);margin:0 auto;padding:var(--s-2) var(--pad-x) var(--s-6)}.thread-line:before{content:"";position:absolute;left:calc(2rem + 4px);top:0;bottom:5rem;width:1px;background:var(--line)}.node{position:relative;padding-left:2.4rem;margin-bottom:var(--s-5);animation:rise .4s ease backwards}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.node:before{content:"";position:absolute;left:0;top:.5rem;width:9px;height:9px;border-radius:50%;background:var(--ink);border:1px solid var(--ash)}.node[data-key="1"]:before{background:var(--vellum);border-color:var(--vellum)}.node .ref{font-size:var(--t-sm);font-weight:600;color:var(--ash);background:none;border:0;cursor:pointer;padding:0;letter-spacing:0;text-transform:none}.node[data-key="1"] .ref,.node .ref:hover{color:var(--vellum)}.node h3{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h3);letter-spacing:-.018em;line-height:1.25;margin:var(--s-1) 0 var(--s-1)}.node p{font-family:var(--f-read);font-size:var(--t-body);line-height:1.7;color:var(--dim);margin:0}.cc-wrap{flex:1;overflow-y:auto;background:var(--ink)}/* v639 (a pedido de Giovani): estas cinco reglas —una por cada tipo de encabezado— forzaban el tamaño grande sobre cualquier

de adentro, ganándole a «.vista-titulo» por especificidad. Afectaban a ocho de los nueve títulos nuevos sin que se notara en el código, sólo al verlo en pantalla. Se quitan: «.vista-titulo» ya trae su propio tamaño, y no debería haber ningún

suelto sin esa clase. */ .cc-head{padding:var(--s-5) var(--pad-x) var(--s-3);max-width:var(--w-mid);margin:0 auto}.cc-head .sub{font-family:var(--f-read);font-size:var(--t-lead);color:var(--muted);line-height:1.7;margin:0 0 var(--s-5)}.cc-body>*:first-child,.wd-body>*:first-child,.sc-body>*:first-child,.tl-body>*:first-child{margin-top:0}/* v647 (a pedido de Giovani): «.cc-body» traía un padding de arriba extra (--s-2) que Clase y 3D no tenían, así que la frase quedaba con más aire antes del contenido en Concordancia. Quitado, para igualar a los demás. */ .cc-body{padding:0 var(--pad-x) var(--s-6);max-width:var(--w-mid);margin:0 auto}.acep{margin:var(--s-1) 0 var(--s-2);max-width:var(--w-read)}.ac{display:flex;align-items:center;gap:var(--s-2);padding:var(--s-1) 0}.acbar{flex:1 1 150px;min-width:0;height:7px;background:var(--panel-2);border-radius:99px;overflow:hidden}.acbar span{display:block;height:100%;background:var(--vellum);border-radius:99px}.acpal{font-family:var(--f-read);font-size:var(--t-body);color:var(--vellum);flex:1}.acn{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);letter-spacing:0;text-transform:none;font-variant-numeric:tabular-nums}.raizcard{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card);margin-top:var(--s-4)}.raizcard .wd-orig{margin-bottom:var(--s-4);padding-top:0}.acep-it{font-family:var(--f-read);font-size:var(--t-body);line-height:1.75;color:var(--dim);padding:var(--s-1) 0}.acep-it b{color:var(--vellum);font-weight:600}.matiz-p{font-family:var(--f-read);font-size:var(--t-body);line-height:1.7;color:var(--dim);margin:0}.tl-wrap{flex:1;overflow-y:auto;background:var(--ink)}.tl-head{padding:var(--s-5) var(--pad-x) var(--s-3);max-width:var(--w-mid);margin:0 auto}.tl-head .sub{font-family:var(--f-read);font-size:var(--t-lead);color:var(--muted);line-height:1.7;margin:0 0 var(--s-5)}.tl-tipos{display:flex;gap:var(--s-1);flex-wrap:wrap;margin:0 0 var(--s-3)}.tl-form{display:flex;gap:var(--s-2);flex-wrap:wrap}.tl-form label{display:flex;flex-direction:column;gap:var(--s-1);flex:1;min-width:0;justify-content:flex-end;font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum)}.tl-form{--campo-h:calc(var(--t-ui) * 1.4 + var(--s-2) * 2 + 2px)}.tl-form input,.tl-form select{background:var(--void);border:1px solid var(--line);color:var(--vellum);border-radius:var(--r-control);padding:0 var(--s-2);font-family:var(--f-ui);font-size:var(--t-ui);font-weight:400;box-sizing:border-box;height:var(--campo-h);line-height:1.4}.tl-form input:focus,.tl-form select:focus{outline:0;border-color:var(--vellum)}.tl-body{padding:var(--s-2) var(--pad-x) var(--s-6);max-width:var(--w-mid);margin:0 auto}.tl-doc{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card)}.tl-doc h2{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h2);margin:0 0 var(--s-1);letter-spacing:-.022em;line-height:1.15}.tl-sub{font-family:var(--f-read);font-size:var(--t-body);color:var(--muted);margin:0 0 var(--s-2)}.tl-meta{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);padding:var(--s-1) 0;margin-bottom:var(--s-4)}.tl-idea{border-left:3px solid var(--vellum);padding:var(--s-1) 0 var(--s-1) var(--s-2);margin-bottom:var(--s-4);font-family:var(--f-read);font-size:var(--t-lead);line-height:1.7;color:var(--vellum)}.tl-sec{margin-bottom:var(--s-5);position:relative}.tl-sec h3{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h3);margin:0 0 var(--s-2);letter-spacing:-.02em}.tl-sec p{font-family:var(--f-read);font-size:var(--t-body);line-height:1.72;color:var(--dim); margin:0 0 var(--s-2)}.tl-ref{background:var(--panel-2);border-radius:var(--r-control);padding:var(--s-2);margin:var(--s-2) 0}.tl-puntos{margin:var(--s-2) 0 0 var(--s-3);padding:0}.tl-puntos li{font-family:var(--f-ui);font-size:var(--t-ui);line-height:1.6;color:var(--dim);margin:var(--s-1) 0}.tl-exp{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card);margin-top:var(--s-4)}.auto{width:100%;box-sizing:border-box;background:transparent;border:1px solid transparent;border-radius:var(--r-control);padding:var(--s-1) var(--s-2);margin-left:calc(-1 * var(--s-2));color:inherit;font:inherit;letter-spacing:inherit;line-height:inherit;resize:none;overflow:hidden;display:block;transition:background .14s,border-color .14s,box-shadow .14s}/* SÓLO DONDE HAY RATÓN. iOS deja el «:hover» pegado tras un toque: al tocar un párrafo se quedaba con fondo gris hasta tocar otra cosa, y la caja parecía descolocada porque «.auto» se sale medio relleno a la izquierda a propósito. Con «hover:hover» el teléfono no lo aplica. */ @media (hover:hover){ .auto:hover{background:var(--panel-2);border-color:var(--line)} }.auto:focus{outline:0;background:var(--void);border-color:var(--borde-campo);box-shadow:0 0 0 3px #a67c0b1f}.auto::placeholder{color:var(--pista)}.ed-tit{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h2);letter-spacing:-.022em;line-height:1.15;color:var(--vellum);margin-bottom:var(--s-1)}.ed-sub{font-family:var(--f-read);font-size:var(--t-body);color:var(--muted);margin-bottom:var(--s-2)}.ed-idea{font-family:var(--f-read);font-size:var(--t-lead);line-height:1.7;color:var(--vellum)}.ed-h3{font-family:var(--f-disp);font-weight:500;font-size:var(--t-h3);letter-spacing:-.018em;line-height:1.255;color:var(--vellum);flex:1}.ed-cuerpo{font-family:var(--f-read);font-size:var(--t-body);line-height:1.72;color:var(--dim)}.ed-puntos{font-family:var(--f-ui);font-size:var(--t-ui);line-height:1.7;color:var(--dim)}.ed-notas{font-family:var(--f-read);font-size:var(--t-body);line-height:1.72;color:var(--dim)}/* SOBRE LA LÍNEA DE ESCRITURA, no por el borde de arriba. Con «flex-start» y tres tamaños de letra distintos cada pieza arrancaba a su altura: medido en escritorio, «5 min» empezaba en y=74, el número en 88 y el título en 92. Con «baseline» los tres se apoyan en el mismo renglón. Los botones no: ésos van arriba y por su cuenta. */ .secbar{display:flex;align-items:baseline;gap:var(--s-1);margin-bottom:var(--s-1)}/* El número deja de flotar en un canalón: es la primera pieza del renglón, como en el diseño. Así el cuerpo del texto y el número comparten el mismo borde izquierdo. */ .secn{flex:0 0 auto;font-family:var(--f-ui);font-size:var(--t-sm); font-weight:600;color:var(--oro-texto);font-variant-numeric:tabular-nums}/* Ya no hace falta destino aparte para el teléfono: el número es una pieza más del renglón en todos los anchos, y el canalón se retiró. */.secacc{display:flex;gap:var(--s-1);opacity:0;transition:opacity .15s; padding-top:var(--s-1);align-self:flex-start;margin-left:auto}.tl-sec:hover .secacc,.secacc:focus-within{opacity:1}.secacc button{background:none;border:1px solid var(--line);color:var(--muted);width:24px;height:24px;border-radius:var(--r-control);cursor:pointer;font-size:var(--t-sm);line-height:1}.secacc button:hover:not(:disabled){border-color:var(--vellum);color:var(--vellum)}.secacc button:disabled{opacity:.3;cursor:default}.quitaref{background:none;border:0;color:var(--ash);cursor:pointer;margin-left:auto;font-size:var(--t-ui);line-height:1}.quitaref:hover{color:var(--crimson)}/* Con el radio de las demás tarjetas, no el viejo de 10 px. El borde se queda claro a propósito: no es una caja de formulario como «.tl-caja», es un panel dentro de la vista, y ahí la línea suave es la del resto. */ .tl-notas{background:var(--void);border:1px solid var(--line);border-radius:var(--r-tarjeta);padding:var(--card);margin-top:var(--s-4)}.tl-idea b{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;display:block;margin-bottom:var(--s-1);color:var(--muted)}.map-wrap{flex:1;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;background:var(--ink)}.mapbar{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;flex:0 0 auto;padding:var(--s-5) var(--pad-x) var(--s-2);background:var(--void);border-bottom:1px solid var(--line)}.mapsel{display:inline-flex;align-items:center;gap:.45rem;min-width:0}.mapsel>span{font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--muted);white-space:nowrap}.mapsel select{appearance:none;-webkit-appearance:none;font-family:var(--f-ui);font-size:var(--t-sm);color:var(--vellum);padding:.4rem 1.9rem .4rem .6rem;border-radius:var(--r-control);max-width:15rem;background-image:url("data:image/svg+xml;utf8,");background-repeat:no-repeat;background-position:right .55rem center;background-size:12px}.mapacc{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;margin-left:auto}.escline{display:flex;align-items:baseline;gap:var(--s-2);flex-wrap:wrap;flex:0 0 auto;padding:var(--s-2) var(--pad-x);background:var(--void);border-bottom:1px solid var(--line);font-family:var(--f-ui);font-size:var(--t-sm)}.escline b{font-weight:600;color:var(--vellum);white-space:nowrap}.escline>span{color:var(--muted);font-size:var(--t-xs);white-space:nowrap}.escline em{font-style:normal;color:var(--dim);flex:1 1 16rem;min-width:0;line-height:1.45}.escimp{border:1px solid;border-radius:99px;cursor:pointer;padding:.2rem .6rem;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600}.mapsvg{display:block;width:100%;height:100%;touch-action:none;-webkit-user-select:none;user-select:none;cursor:grab}.mapsvg:active{cursor:grabbing}.site-label{pointer-events:none}.hit{cursor:pointer}.legend{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;flex:0 0 auto;padding:var(--s-2) var(--pad-x);background:var(--void);border-top:1px solid var(--line);font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted)}.mapayuda{margin-left:auto;color:var(--ash);text-align:right}@media (max-width:760px){.mapbar{gap:var(--s-1);padding:var(--s-5) var(--pad-x) var(--s-1)}.mapsel{flex:1 1 9rem}.mapsel select{width:100%;max-width:none}.mapacc{margin-left:0;width:100%}.escline em{flex-basis:100%}}.bib-obra{display:flex;align-items:center;gap:var(--s-3);width:100%;text-align:left;background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s-3);cursor:pointer;transition:border-color .16s,transform .16s}.bib-obra:hover{border-color:var(--vellum);transform:translate(2px)}.bib-lomo{flex:0 0 6px;height:44px;border-radius:3px;background:var(--gold-hi);opacity:.7}.bib-datos{flex:1;min-width:0;display:flex;flex-direction:column;gap:.15rem}.bib-datos b{font-family:var(--f-disp);font-size:var(--t-lead);font-weight:600;letter-spacing:-.02em;color:var(--vellum)}.bib-datos em{font-style:normal;font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted)}.bib-ir{color:var(--ash);font-size:var(--t-h3);line-height:1;flex:0 0 auto}.bib-lee{flex:1;display:flex;flex-direction:column;min-height:0}.bib-barra{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;padding:var(--s-2) var(--pad-x);border-bottom:1px solid var(--line-soft);background:var(--void)}.bib-barra b{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum)}.bib-sello{font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;background:var(--panel-2);color:var(--muted);border-radius:99px;padding:.2rem .6rem}.bib-barra .chip:last-child{margin-left:auto}.bib-caps{display:flex;gap:.3rem;flex-wrap:wrap;padding:var(--s-2) var(--pad-x);border-bottom:1px solid var(--line-soft);max-height:22vh;overflow-y:auto}.bib-cuerpo{flex:1;min-height:0;display:flex;overflow:auto}.bib-texto p{font-family:var(--f-read);font-size:var(--t-body);line-height:1.85;color:var(--dim);margin:0 0 var(--s-3)}.bib-texto .num{font-family:var(--f-ui);font-size:.72em;font-weight:700;color:var(--oro-texto);vertical-align:super;line-height:0;margin-right:.3em;user-select:none}.bib-ecos h4{font-size:var(--t-lead);font-weight:600;color:var(--vellum);margin:0 0 var(--s-3)}.eco{padding:var(--s-2) 0;border-bottom:1px solid var(--line-soft)}.eco p{font-family:var(--f-read);font-size:var(--t-sm);line-height:1.6;color:var(--dim);margin:.3rem 0 0}.ecotipo{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);margin-left:.5rem}@media (max-width:860px){.bib-cuerpo{flex-direction:column}}/* v633 (a pedido de Giovani): tres tarjetas por fila, no las que quepan por ancho mínimo. */ .ver-lista.cartas{display:grid;gap:var(--s-3);grid-template-columns:repeat(3,1fr)}.carta{background:var(--void);border:1px solid var(--line);border-radius:var(--r-tarjeta);overflow:hidden;display:flex;flex-direction:column;transition:border-color .18s,transform .18s}.carta:hover{border-color:var(--vellum);transform:translateY(-2px)}.carta-portada{position:relative;aspect-ratio:4/3;cursor:pointer;overflow:hidden;background:var(--ink)}.carta-portada img,.carta-portada svg{width:100%;height:100%;object-fit:cover;display:block}.carta-lupa{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#14120a8c;color:#f3eee4;opacity:0;transition:opacity .18s;font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;text-align:center;padding:0 .6rem}.carta-portada:hover .carta-lupa{opacity:1}.carta-cuerpo{padding:var(--s-3);display:flex;flex-direction:column;gap:.3rem;position:relative}.carta-cab{display:flex;align-items:baseline;gap:var(--s-2);flex-wrap:wrap}.carta h3{font-size:var(--t-body);line-height:1.3;font-weight:600;letter-spacing:-.02em;color:var(--vellum);margin:0}.carta-datos{font-family:var(--f-ui);font-size:var(--t-sm);color:var(--muted)}/* v634 (a pedido de Giovani): la tarjeta se simplificó a imagen, título y descripción —máximo tres líneas, no dos—. */ .carta-res{font-family:var(--f-read);font-size:var(--t-sm);line-height:1.55;color:var(--dim);margin:.25rem 0 0;padding-right:1.8rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.carta-falta{opacity:.55;font-style:italic}.carta-lapiz{position:absolute;right:.5rem;bottom:.5rem}.carta-lapiz svg{width:18px;height:18px}.carta[data-toca="1"]{border-color:var(--vellum)}.carta-toca{font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;background:var(--vellum);color:var(--void);border-radius:99px;padding:.1rem .5rem;white-space:nowrap}.ficha-portada{display:flex;gap:var(--s-2);align-items:center;flex-wrap:wrap}.ficha-vista{width:104px;height:78px;flex:none;border:1px solid var(--line);border-radius:var(--r-control);overflow:hidden;background:var(--ink);display:flex;align-items:center;justify-content:center}.ficha-vista img{width:100%;height:100%;object-fit:cover;display:block}.ficha-vista span{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);text-align:center;padding:0 .3rem}.ficha-vista svg{width:100%;height:100%;display:block}.ficha-botones{display:flex;gap:.4rem;flex-wrap:wrap}.cc-delverso{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;margin-top:var(--s-3)}.cc-delverso-et{font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--muted);margin-right:.2rem}.ficha-error{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);margin:.3rem 0 0}.aj-campo .ficha-img{flex:1;min-width:0;border:0;background:none;padding:0;font-family:var(--f-ui);font-size:var(--t-sm);color:var(--muted)}.aj-campo .ficha-img::file-selector-button{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;padding:.5rem .85rem;margin-right:.6rem;border:1px solid var(--borde-campo);border-radius:var(--r-control);background:var(--void);color:var(--vellum);cursor:pointer}.aj-campo .ficha-img::file-selector-button:hover{border-color:var(--vellum);background:var(--panel-2)}@media (max-width:640px){.ver-lista.cartas{grid-template-columns:repeat(2,1fr)}} @media (max-width:420px){.ver-lista.cartas{grid-template-columns:1fr}}.ver-lista{max-width:var(--w-mid);margin:0 auto;padding:0 var(--pad-x) var(--s-6);display:flex;flex-direction:column;gap:var(--s-3)}.ver-ficha{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card)}.ver-cab{display:flex;align-items:baseline;gap:var(--s-2);flex-wrap:wrap}.ver-ficha h3{font-size:var(--t-h2);font-weight:600;letter-spacing:-.02em;color:var(--vellum);margin:0}.ver-en{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);margin:.2rem 0 var(--s-2)}.ver-ficha p{font-family:var(--f-read);font-size:var(--t-body);line-height:1.7;color:var(--dim);margin:0 0 var(--s-3)}.ver-partes{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:var(--s-3)}.ver-aviso code{font-family:var(--f-mono,ui-monospace,monospace);font-size:.9em;background:var(--void);border:1px solid var(--line);border-radius:var(--r-control);padding:.05rem .3rem}.ver-partes span{background:var(--panel-2);border-radius:var(--r-control);padding:.3rem .7rem;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--ash)}.ver-pleno{position:fixed;inset:0;z-index:400;background:#000;display:block}.ver-marco{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;background:#000}.ver-pleno:fullscreen .ver-marco{width:100vw;height:100vh}.ver-flota{position:absolute;top:max(10px,env(safe-area-inset-top));left:10px;z-index:2;display:flex;gap:.35rem;flex-wrap:wrap;background:#1413118c;backdrop-filter:blur(8px);border-radius:99px;padding:.3rem}.ver-flota .chip{background:#f3eee4eb;color:#141311;border:0;padding:.34rem .8rem;font-size:var(--t-xs);font-weight:600}.ver-flota .chip:hover{background:#fff}.guia{position:fixed;left:50%;transform:translate(-50%);bottom:calc(var(--s-3) + env(safe-area-inset-bottom,0px));width:min(420px,calc(100vw - var(--s-3) * 2));z-index:60;background:var(--void);border:1px solid var(--borde-campo);border-radius:var(--r-tarjeta);padding:var(--s-3);box-shadow:0 12px 40px #14120a2e}.guia-cab{display:flex;align-items:center;margin-bottom:var(--s-1)}.guia-n{font-family:var(--f-ui);font-size:var(--t-xs);letter-spacing:.09em;text-transform:uppercase;color:var(--oro-texto);font-variant-numeric:tabular-nums}.guia-play{margin-left:auto;display:inline-flex;align-items:center;gap:.3rem;background:none;border:1px solid var(--line);border-radius:99px;padding:.15rem .5rem;margin-right:.4rem;cursor:pointer;font-family:var(--f-ui);font-size:var(--t-xs);letter-spacing:.04em;text-transform:uppercase;color:var(--oro-texto)}.guia-play:hover{border-color:var(--gold)}.guia-x{background:none;border:0;font-size:var(--t-h3);line-height:1;color:var(--ash);cursor:pointer;padding:0 .2rem}.guia-x:hover{color:var(--vellum)}.guia h3{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h3);letter-spacing:-.018em;margin:0 0 var(--s-1);color:var(--vellum)}.guia p{font-family:var(--f-read);font-size:var(--t-ui);line-height:1.6;color:var(--dim);margin:0 0 var(--s-2)}.guia-barra{height:2px;background:var(--line-soft);border-radius:99px;overflow:hidden;margin-bottom:var(--s-2)}.guia-barra>div{height:100%;background:var(--gold);transition:width .25s ease}.guia-pies{display:flex;gap:var(--s-1);justify-content:flex-end}@media (max-width:520px){.guia{width:calc(100vw - var(--s-2) * 2);padding:var(--s-2)}.guia-pies .btn{flex:1}}.instala{position:sticky;bottom:0;z-index:410;display:flex;align-items:center;gap:var(--s-2);margin:0;padding:var(--s-2) var(--pad-x);padding-bottom:calc(var(--s-2) + env(safe-area-inset-bottom));background:var(--vellum);color:var(--void);border-radius:0;box-shadow:0 -6px 24px #14120a2e;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;line-height:1.45;flex-wrap:wrap;min-width:0}.instala>span{flex:1;min-width:0}.instala .chip{flex:0 0 auto;background:var(--void);color:var(--vellum);border:0;padding:.4rem .9rem;font-weight:600;white-space:nowrap}.instala-x{flex:0 0 auto;background:none;border:0;color:var(--void);opacity:.65;cursor:pointer;font-size:var(--t-h3);line-height:1;width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-control);margin:-6px -4px -6px 0}.instala-x:active{background:#0000001f}.instala-x:hover{opacity:1}.dlg{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s-4);box-shadow:0 24px 64px #14120a47;max-height:100%;overflow-y:auto;overscroll-behavior:contain}.dlg.ajustes{max-width:min(520px,94vw);width:calc(100% - 2rem)} .dlg.privacidad{max-width:min(640px,94vw);width:calc(100% - 2rem)} /* v660: mismo ancho que «.dlg.privacidad» —incluso la misma clase de cuerpo, «.privacidad-cuerpo», reusada tal cual, dos líneas más abajo—, para la carta de agradecimiento que se abre desde Inicio. */ .dlg.gracias{max-width:min(640px,94vw);width:calc(100% - 2rem)} .privacidad-cuerpo{font-family:var(--f-read);font-size:var(--t-sm);line-height:1.7;color:var(--dim)} .privacidad-cuerpo .sub{color:var(--muted);font-size:var(--t-xs);margin:0 0 1.4rem} .privacidad-cuerpo h2{color:var(--vellum);font-size:var(--t-lead);font-weight:600;margin:1.8rem 0 .5rem} .privacidad-cuerpo h2:first-of-type{margin-top:0} .privacidad-cuerpo p{margin:0 0 .9rem} .privacidad-cuerpo ul{margin:0 0 .9rem;padding-left:1.2rem} .privacidad-cuerpo li{margin-bottom:.35rem} .privacidad-cuerpo strong{color:var(--vellum);font-weight:600} .privacidad-cuerpo .clave{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-tarjeta);padding:1rem 1.2rem;margin:1.4rem 0} .privacidad-cuerpo .clave p:last-child{margin:0} .privacidad-cuerpo footer{margin-top:2rem;padding-top:1rem;border-top:1px solid var(--line);color:var(--muted);font-size:var(--t-xs)}.dlghead{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--s-3)}.dlghead h3{font-size:var(--t-h2);font-weight:600;letter-spacing:-.02em;color:var(--vellum);margin:0}.aj-intro{font-family:var(--f-read);font-size:var(--t-sm);line-height:1.6;color:var(--dim);margin:0 0 var(--s-4)}.aj-campo{display:flex;flex-direction:column;gap:.3rem;margin-bottom:var(--s-3)}.aj-campo>span{font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--muted)}.aj-campo select,.aj-clave input{background:var(--void);border:1px solid var(--line);border-radius:var(--r-control);padding:.55rem .7rem;color:var(--vellum);font-family:var(--f-ui);font-size:var(--t-sm);width:100%}.aj-campo select:focus,.aj-clave input:focus{outline:0;border-color:var(--vellum)}.aj-clave{display:flex;gap:.4rem;align-items:center}.aj-clave input{flex:1;min-width:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.02em}.aj-nota{font-family:var(--f-ui);font-size:var(--t-xs);line-height:1.6;color:var(--muted);background:var(--panel-2);border-radius:var(--r-control);padding:var(--s-2);margin-bottom:var(--s-3)}.aj-ojo{border-left:3px solid var(--gold-hi)}.aj-acc{display:flex;gap:var(--s-2);flex-wrap:wrap;margin-bottom:var(--s-2)}.aj-res{font-family:var(--f-ui);font-size:var(--t-xs);line-height:1.55;padding:var(--s-2);border-radius:var(--r-control);border-left:3px solid var(--crimson);background:var(--panel-2);color:var(--dim);margin-bottom:var(--s-3)}.aj-res.ok{border-left-color:var(--jade)}.aj-pie{display:flex;justify-content:flex-end;margin-top:var(--s-2)}.espacio{margin-top:var(--s-3);display:flex;flex-direction:column;gap:.35rem;align-items:center}.espacio-barra{width:min(320px,80%);height:4px;background:var(--line);border-radius:2px;overflow:hidden}.espacio-barra div{height:100%;background:var(--vellum);border-radius:2px;transition:width .4s}.espacio span{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);text-align:center}.estante{display:grid;gap:var(--s-3);max-width:var(--w-mid);margin:0 auto;padding:0 var(--pad-x) var(--s-6);grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.tomo{display:flex;background:var(--void);border:1px solid var(--line);border-radius:var(--r-tarjeta);overflow:hidden;cursor:pointer;transition:border-color .18s,transform .18s}.tomo:hover{border-color:var(--vellum);transform:translateY(-2px)}.tomo-lomo{flex:0 0 10px;background:linear-gradient(180deg,var(--gold-hi),var(--crimson))}.tomo-cuerpo{flex:1;min-width:0;padding:var(--card);display:flex;flex-direction:column}.tomo h3{font-family:var(--f-disp);font-size:var(--t-lead);font-weight:600;letter-spacing:-.02em;color:var(--vellum);margin:0 0 .2rem;line-height:1.3}.tomo-autor{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);margin-bottom:var(--s-2)}.tomo-falta{opacity:.55;font-style:italic}.tomo-res{font-family:var(--f-read);font-size:var(--t-sm);line-height:1.6;color:var(--dim);margin:0 0 var(--s-3);flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.tomo-avance{font-style:italic;opacity:.85}.tomo-pie{display:flex;align-items:center;justify-content:space-between;font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted)}.tomo-lapiz{background:none;border:0;cursor:pointer;color:var(--muted);padding:.2rem;border-radius:var(--r-control);display:inline-flex}.tomo-lapiz svg{width:15px;height:15px}.tomo-lapiz:hover{color:var(--vellum);background:var(--panel-2)}.lib-lectura{flex:0 0 auto;display:flex;flex-direction:column;position:relative}.lib-barra{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;padding:var(--s-2) var(--pad-x);background:var(--void);position:sticky;top:0;z-index:20;background:var(--ink);border-bottom:1px solid var(--line-soft)}.lib-titulo{flex:1;min-width:0;background:none;border:0;cursor:pointer;text-align:left;font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lib-titulo:hover{text-decoration:underline}.lib-indice{display:flex;flex-wrap:wrap;gap:.3rem;padding:var(--s-2) var(--pad-x);border-bottom:1px solid var(--line-soft);max-height:32vh;overflow-y:auto}.lib-indice button{background:var(--panel-2);border:0;border-radius:var(--r-control);cursor:pointer;min-width:34px;padding:.34rem .5rem;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--ash)}.lib-indice button:hover{background:var(--vellum);color:var(--void)}.lib-pagina{flex:0 0 auto;padding:var(--s-5) var(--pad-x) 40vh}.lib-portadilla{max-width:34em;margin:0 auto var(--s-6);text-align:center;padding-bottom:var(--s-5);border-bottom:1px solid var(--line-soft)}.lib-portadilla h1{font-family:var(--f-disp);font-size:var(--t-h2);font-weight:600;letter-spacing:-.03em;color:var(--vellum);margin:0 0 .4rem;line-height:1.15}.lib-autor{font-family:var(--f-read);font-size:var(--t-body);color:var(--muted);font-style:italic;margin-bottom:var(--s-3)}.lib-sello{display:inline-block;background:var(--panel-2);border-radius:99px;padding:.24rem .8rem;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--muted);letter-spacing:.06em}.lib-cap{max-width:34em;margin:0 auto var(--s-6)}.lib-cap h2{font-family:var(--f-ui);font-size:var(--t-xs);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ash);margin:0 0 var(--s-3);padding-bottom:var(--s-1);border-bottom:1px solid var(--line-soft)}.lib-cap p{font-family:var(--f-read);font-size:var(--t-lead);line-height:1.85;color:var(--vellum);margin:0 0 1.1rem;text-align:justify;hyphens:auto}.lib-cap sup{font-family:var(--f-ui);font-size:.6em;font-weight:700;color:var(--oro-texto);vertical-align:super;line-height:0;margin-right:.32em;user-select:none}.lib-fin{max-width:34em;margin:0 auto;text-align:center;font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);letter-spacing:.14em}.lib-ecos{position:absolute;top:0;right:0;bottom:0;width:min(340px,86vw);z-index:20;background:var(--void);border-left:1px solid var(--line);overflow-y:auto;padding:var(--s-3);box-shadow:-8px 0 32px #14120a24}.lib-ecos-cab{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--s-3)}.lib-ecos-cab b{font-family:var(--f-ui);font-size:var(--t-sm);color:var(--vellum)}.lib-eco{padding:var(--s-2) 0;border-bottom:1px solid var(--line-soft)}.lib-tipo{margin-left:.5rem;font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted)}.lib-eco p{font-family:var(--f-read);font-size:var(--t-sm);line-height:1.6;color:var(--dim);margin:.3rem 0 0}.lib-vacio{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);padding:var(--s-3) 0}@media (max-width:640px){.estante{grid-template-columns:1fr}.lib-pagina{padding-left:var(--s-3);padding-right:var(--s-3)}}.ver-soltar{border:1.5px dashed var(--line);border-radius:var(--radius);padding:var(--s-5) var(--s-3);text-align:center;cursor:pointer;display:flex;flex-direction:column;gap:.3rem;transition:border-color .16s,background .16s}.ver-soltar:hover,.ver-soltar.sobre{border-color:var(--vellum);background:var(--panel-2)}.ver-soltar b{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum)}.ver-soltar span{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted)}.ver-alerta{border-left:3px solid var(--crimson);padding:var(--s-1) 0 var(--s-1) var(--s-2)}.ver-kb{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);margin-left:auto}.ver-acc{display:flex;gap:var(--s-2);flex-wrap:wrap;margin-top:var(--s-4)}.ver-aviso{margin:var(--s-2) 0;font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);line-height:1.55}.map-stage{position:relative;margin-inline:var(--s-5);border-radius:var(--radius)}@media (max-width:720px){.map-stage{margin-inline:28px}}.vsep{width:1px;height:20px;background:var(--line);margin:0 var(--s-1)}.swatch{width:9px;height:9px;border-radius:2px;display:inline-block;margin-right:.4rem;vertical-align:-1px}.sitecard{position:absolute;top:1.4rem;right:1.4rem;width:min(250px,80vw);background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card);box-shadow:0 8px 30px #14120a1f}.sitecard h4{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h3);letter-spacing:-.018em;line-height:1.25;margin:0}.sitecard .sm{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);letter-spacing:0;text-transform:none;line-height:1.55;font-size:var(--t-sm)}.sitecard .coords{font-family:var(--f-ui);font-variant-numeric:tabular-nums;font-size:var(--t-sm);color:var(--dim);margin-top:var(--s-1)}.sitex{position:absolute;top:.5rem;right:.6rem;background:none;border:0;color:var(--ash);font-size:var(--t-lead);cursor:pointer;line-height:1}.sitex:hover{color:var(--vellum)}.bib-lista .rlist{max-height:60vh}.bib-nom{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bib-n{font-size:var(--t-xs);opacity:.55;font-variant-numeric:tabular-nums}.bib-cab h2{flex:1;min-width:0;font-size:var(--t-h2);font-weight:600;letter-spacing:-.028em;margin:0}.bib-meta{display:flex;align-items:center;gap:var(--s-1)}.bib-meta select{background:var(--void);border:1px solid var(--line);border-radius:var(--r-control);padding:.24rem .5rem;color:var(--dim);font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600}.bib-ecobody{padding:var(--s-2);max-height:66vh;overflow-y:auto}@media (max-width:960px){.bib-lista,.bib-lista .rlist{max-height:34vh}}.ev-wrap{flex:1;overflow-y:auto;padding:var(--s-5) 0 var(--s-6);background:var(--ink)}.ev-head{max-width:var(--w-mid);margin-left:auto;margin-right:auto;padding-left:var(--pad-x);padding-right:var(--pad-x);margin-bottom:var(--s-5)}.ev-head p{font-family:var(--f-read);font-size:var(--t-lead);color:var(--muted);line-height:1.7;margin:0}.ev-filters{display:flex;gap:var(--s-1);flex-wrap:wrap;align-items:center;max-width:var(--w-mid);margin-left:auto;margin-right:auto;padding-left:var(--pad-x);padding-right:var(--pad-x);margin-bottom:var(--s-4)}.ev-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--s-2);max-width:var(--w-mid);margin-left:auto;margin-right:auto;padding-left:var(--pad-x);padding-right:var(--pad-x);margin-bottom:var(--s-4)}.ev-card{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card);transition:all .16s}.ev-card:hover{border-color:var(--ash);box-shadow:0 2px 12px #14120a0d}.ev-meta{display:flex;align-items:center;gap:var(--s-1);margin-bottom:var(--s-2);font-size:var(--t-sm);letter-spacing:0;text-transform:none}.status{padding:0 var(--s-1);border-radius:99px;border:0;font-weight:500}.status.confirmado{color:var(--jade);background:#e6f4ee}.status.corroborado{color:#8a5a12;background:#f7efdf}.status.debate{color:var(--ash);background:var(--panel-2)}.ev-card h3{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h3);letter-spacing:-.018em;line-height:1.25;margin:0 0 var(--s-1)}.ev-card .where{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);letter-spacing:0;text-transform:none;margin-bottom:var(--s-2);font-size:var(--t-sm)}.ev-card p{font-family:var(--f-read);font-size:var(--t-body);line-height:1.72;color:var(--dim);margin:0 0 var(--s-2)}.ev-refs{display:flex;gap:var(--s-1);flex-wrap:wrap}.refchip{background:var(--panel-2);border:0;color:var(--dim);font-size:var(--t-sm);padding:var(--s-1) var(--s-1);border-radius:99px;cursor:pointer;transition:all .14s}.refchip:hover{background:var(--vellum);color:var(--void)}.ev-drop{display:flex;flex-direction:column;gap:var(--s-1);align-items:center;text-align:center;border:1.5px dashed var(--line);border-radius:var(--r-tarjeta);padding:var(--card);background:var(--void);cursor:pointer;transition:all .18s;max-width:var(--w-mid);margin-left:auto;margin-right:auto;padding-left:var(--pad-x);padding-right:var(--pad-x);margin-bottom:var(--s-3);box-sizing:border-box;margin-inline:auto}.ev-drop{box-sizing:border-box;margin-inline:auto}.ev-drop b{font-family:var(--f-disp);font-weight:400;font-size:var(--t-h3);letter-spacing:-.02em}.ev-drop span{font-size:var(--t-ui);color:var(--muted);line-height:1.65}.upline{display:flex;align-items:center;gap:var(--s-1);font-size:var(--t-ui);color:var(--ash);background:var(--panel-2);border-radius:var(--r-control);padding:var(--s-2) var(--s-2);max-width:var(--w-mid);margin-left:auto;margin-right:auto;padding-left:var(--pad-x);padding-right:var(--pad-x);margin-bottom:var(--s-1)}.upline b{color:var(--vellum);font-weight:600}.upline[data-err="1"]{background:var(--panel-2);color:var(--crimson)}.mod-wrap{flex:1;overflow-y:auto;padding:var(--s-5) 0 var(--s-6);background:var(--ink)}.drop,.cat,.ev-drop,.thread-synth,.faltaclave,.mod-wrap>.warn,.ev-wrap>.warn,.cc-wrap>.warn,.wd-wrap>.warn,.tl-wrap>.warn,.sc-wrap>.warn,.lib-wrap>.warn,.ver-wrap>.warn{max-width:calc(var(--w-mid) - var(--pad-x) * 2);margin-inline:auto}.drop{border:1px dashed var(--line);border-radius:var(--radius);padding:var(--card);text-align:center;transition:all .18s;background:var(--void);cursor:pointer;box-sizing:border-box;margin-left:auto;margin-right:auto;margin-bottom:var(--s-5)}.drop:before,.ev-drop:before{content:"";display:block;width:34px;height:3px;border-radius:99px;background:var(--gold);margin:0 auto var(--s-2)}.drop[data-over="1"],.ev-drop[data-over="1"]{border-color:var(--gold);border-style:solid;background:var(--mark)}.drop[data-over="1"]:before,.ev-drop[data-over="1"]:before{width:56px}.drop:hover,.ev-drop:hover{border-color:var(--gold)}.drop:focus-visible,.ev-drop:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.drop .big{font-family:var(--f-disp);font-size:var(--t-h2);margin-bottom:var(--s-1);color:var(--vellum);letter-spacing:-.02em}.drop .sub{color:var(--muted);font-size:var(--t-ui);line-height:2;margin:0 auto;font-family:var(--f-ui);font-variant-numeric:tabular-nums}.modsum{display:flex;gap:var(--s-2);flex-wrap:wrap;max-width:var(--w-mid);margin-left:auto;margin-right:auto;padding-left:var(--pad-x);padding-right:var(--pad-x);margin-bottom:var(--s-3)}.modsum-i{flex:1;min-width:0;flex:1 1 130px;background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s-2)}.modsum-i b{display:block;font-family:var(--f-disp);font-size:var(--t-h2);font-weight:600;color:var(--vellum);line-height:1;letter-spacing:-.02em}.modsum-i span{display:block;font-size:var(--t-sm);color:var(--dim);margin-top:.15rem}.modsum-i i{display:block;font-style:normal;font-size:var(--t-xs);color:var(--muted);margin-top:.15rem}.modacc{display:flex;gap:.3rem;margin-left:auto;flex:0 0 auto}.modrow .nm{margin-right:auto}@media (min-width:961px){.modacc{margin-left:var(--s-4)}.modrow>*:first-child{min-width:0}}.modlist,.modsecc{max-width:var(--w-mid);margin-left:auto;margin-right:auto;padding-left:var(--pad-x);padding-right:var(--pad-x);margin-top:var(--s-4)}.sw{position:relative;flex:0 0 44px;width:44px;height:24px;border-radius:99px;border:1px solid var(--line);cursor:pointer;background:var(--panel-2);transition:background .16s,border-color .16s;padding:0}.sw[data-on="1"]{background:var(--vellum);border-color:var(--vellum)}.sw span{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--void);transition:transform .18s;display:block;box-shadow:0 1px 3px #14120a33}.sw[data-on="1"] span{transform:translate(20px)}.swlbl{flex:0 0 26px;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:700;color:var(--muted)}.modrow[data-off="1"] .nm,.modrow[data-off="1"] .dt,.modrow[data-off="1"] .kindtag{opacity:.4}.modrow[data-off="1"] .swlbl{color:var(--ash)}.modrow[data-off="0"] .swlbl{color:var(--vellum)}.registro{background:var(--panel-2);border-radius:var(--radius);padding-top:var(--s-2);padding-bottom:var(--s-2);max-height:22rem;overflow-y:auto}.registro>div{white-space:pre-wrap;word-break:break-word}.grupohead{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;margin-bottom:var(--s-2)}.grupohead em{font-style:normal;font-weight:400;color:var(--muted)}.grupoacc{display:flex;gap:.3rem;margin-left:auto}.grupoacc button{background:var(--void);border:1px solid var(--line);border-radius:var(--r-control);cursor:pointer;padding:.24rem .6rem;color:var(--dim);font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600}.grupoacc button:hover{border-color:var(--vellum);color:var(--vellum)}.grupoacc button[data-on="1"]{background:var(--vellum);border-color:var(--vellum);color:var(--void)}.modrow{display:flex;align-items:center;gap:var(--s-2);padding:var(--s-2) var(--s-1);border-bottom:1px solid var(--line-soft)}.modrow .nm{font-size:var(--t-body);color:var(--vellum)}.modrow .dt{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);letter-spacing:0;text-transform:none}.kindtag{font-size:var(--t-sm);padding:0 var(--s-1);border-radius:99px;border:0;font-weight:500;letter-spacing:0;text-transform:none}.kindtag.biblia{color:#8a5a12;background:#f7efdf}.kindtag.diccionario{color:#2c4a8a;background:#e8eef9}.kindtag.comentario{color:var(--jade);background:#e6f4ee}.kindtag.libro{background:#786ec829;color:var(--libro,#5a4fa8)}.kindtag.referencias{color:#7a3e8c;background:#f2e9f6}.app-item{padding:0 0 var(--s-3);margin-bottom:var(--s-3);border-bottom:1px solid var(--line-soft)}.app-item:last-child{border-bottom:0}.app-item .r{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum);letter-spacing:0;color:var(--crimson)}.app-item h4{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h3);letter-spacing:-.018em;line-height:1.25;margin:var(--s-1) 0 var(--s-1)}.app-item p{font-family:var(--f-read);font-size:var(--t-body);line-height:1.72;color:var(--dim);margin:0 0 var(--s-2)}.witness{font-family:var(--f-ui);font-variant-numeric:tabular-nums;font-size:var(--t-sm);color:var(--ash);line-height:1.8;background:var(--panel-2);padding:var(--s-2) var(--s-2);border-radius:var(--r-control)}.notecard{padding:0 0 var(--s-2);margin-bottom:var(--s-2);border-bottom:1px solid var(--line-soft)}.notecard .r{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum);letter-spacing:0}.notecard p{font-family:var(--f-read);font-size:var(--t-body);line-height:1.72;color:var(--dim);margin:var(--s-1) 0 0;white-space:pre-wrap} /* v732: varias notas fechadas por versículo (antes una sola, sin fecha, que la siguiente pisaba) y el botón de borrar por entrada, no por versículo entero. */ .notecard-fecha{font-weight:400;color:var(--muted)} .notecard-borrar{display:inline-block;margin-top:.35rem;font-size:var(--t-xs)}.cmt{padding:0 0 var(--s-3);margin-bottom:var(--s-3);border-bottom:1px solid var(--line-soft)}.cmt .r{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum);letter-spacing:0;color:var(--jade)}.xref{padding:0 0 var(--s-2);margin-bottom:var(--s-2);border-bottom:1px solid var(--line-soft)}.xref:last-child{border-bottom:0}.xref .r{font-size:var(--t-sm);font-weight:600;color:#7a3e8c}.cmt p{font-family:var(--f-read);font-size:var(--t-body);line-height:1.75;color:var(--dim);margin:var(--s-1) 0 0}/* LOS AVISOS QUE YA VIVEN DENTRO DE UNA COLUMNA NO LA VUELVEN A PEDIR. «--w-mid» está definida como «min(1320px, 100% - pad-x*2)», y ese 100% se resuelve contra donde se usa. En «.mod-wrap» y «.ev-wrap» el aviso cuelga directamente del contenedor a sangre, así que ahí la columna hace falta. Pero «.cc-body», «.wd-body», «.sc-body» y «.tl-body» YA son la columna: aplicarla otra vez descuenta los márgenes dos veces. Medido en Estudio: la caja del buscador mide 906 px y la del aviso medía 727, que es 906 menos dos veces «--pad-x». Y el relleno lateral de 90 px metía el texto aún más adentro. Pasaba igual en Concordancia, Escena y Clase, que comparten esta regla. */ .mod-wrap>.warn,.mod-wrap>.notice,.ev-wrap>.warn,.ev-wrap>.notice{max-width:var(--w-mid);margin-left:auto;margin-right:auto;padding-left:var(--pad-x);padding-right:var(--pad-x)}.warn{border:1px solid var(--line);background:var(--void);padding:var(--s-2) var(--s-2);border-radius:var(--r-control);font-size:var(--t-ui);line-height:1.65;color:var(--dim);margin-bottom:var(--s-2)}.warn b{color:var(--vellum);font-weight:600}.sc-head .ev-filters{max-width:none;margin:0;padding-left:0;padding-right:0}.mod-wrap>.warn{box-sizing:border-box;max-width:calc(var(--w-mid) - var(--pad-x) * 2);margin-inline:auto}.cc-wrap>.warn,.cc-wrap>.notice,.wd-wrap>.prof,.wd-wrap>.warn,.wd-wrap>.shimmer,.thread-wrap>.shimmer,.tl-wrap>.warn,.tl-wrap>.tl-doc,.sc-wrap>.warn,.sc-wrap>.genbox,.sc-wrap>.promptbox,.sc-wrap>.anchor,.ev-wrap>.warn,.lib-wrap>.warn,.ver-wrap>.warn{box-sizing:border-box;max-width:var(--w-mid);margin-inline:auto}.wd-wrap{flex:1;overflow-y:auto;background:var(--ink)}.wd-head{padding:var(--s-5) var(--pad-x) var(--s-3);max-width:var(--w-mid);margin:0 auto}.wd-head .sub{font-family:var(--f-read);font-size:var(--t-lead);color:var(--muted);line-height:1.7;margin:0 0 var(--s-5)}.wd-form{display:flex;gap:var(--s-1);flex-wrap:wrap;margin-top:0;align-items:flex-start}.wd-form input{flex:1 1 160px;min-width:0;background:var(--void);border:1px solid var(--line);color:var(--vellum);font-family:var(--f-ui);font-size:var(--t-body);padding:var(--s-2) var(--s-2);border-radius:var(--r-control)}.wd-form input:focus,.wd-form textarea:focus{outline:0;border-color:var(--vellum)}.wd-form textarea{flex:1 1 100%;min-width:0;background:var(--void);border:1px solid var(--line);color:var(--dim);font-family:var(--f-read);font-size:var(--t-ui);line-height:1.7;padding:var(--s-2) var(--s-2);border-radius:var(--r-control);resize:vertical;min-height:9.5rem}.wd-body{padding:var(--s-2) var(--pad-x) var(--s-6);max-width:var(--w-mid);margin:0 auto}.wd-orig{display:flex;align-items:baseline;gap:var(--s-2);flex-wrap:wrap;padding:var(--s-3) 0;border-bottom:1px solid var(--line);margin-bottom:var(--s-4)}.wd-orig .big{font-family:var(--f-heb);font-size:2.9rem;line-height:1.1;color:var(--vellum);font-weight:500}.wd-orig .tr{font-size:var(--t-body);color:var(--ash)}.wd-orig .st{font-family:var(--f-ui);font-variant-numeric:tabular-nums;font-size:var(--t-sm);color:var(--dim);background:var(--panel-2);padding:var(--s-1) var(--s-1);border-radius:99px}.passage{font-family:var(--f-read);font-size:var(--t-body);line-height:1.85;color:var(--dim);background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s-3) var(--s-3);margin-bottom:var(--s-4)}.layer-note{font-size:var(--t-ui);color:var(--muted);background:var(--panel-2);border-radius:var(--r-control);padding:var(--s-2) var(--s-2);line-height:1.85;margin-bottom:var(--s-4);letter-spacing:0}.layer-note b{color:var(--vellum);font-weight:600}.unificadora{background:var(--panel-2);border-radius:var(--radius);padding:var(--card);margin:0 0 var(--s-3)}.unificadora p{font-family:var(--f-disp);font-size:var(--t-h3);font-weight:600;letter-spacing:-.02em;line-height:1.35;color:var(--vellum);margin:0}.matiz{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card);margin-bottom:var(--s-2)}.matiz-n{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;letter-spacing:.01em;text-transform:none;color:var(--vellum);color:var(--muted);margin-bottom:var(--s-1);font-weight:500}.matiz h3{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h3);letter-spacing:-.018em;line-height:1.25;margin:var(--s-1) 0 var(--s-2)}.lbl{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;letter-spacing:.01em;text-transform:none;color:var(--vellum);margin:var(--s-3) 0 var(--s-1);display:block}.matiz p{font-family:var(--f-read);font-size:var(--t-body);line-height:1.7;color:var(--dim);margin:0}.idea{font-family:var(--f-read);font-size:var(--t-body);line-height:1.75;color:var(--vellum);margin:0}.vhope{background:var(--panel-2);border-radius:var(--r-control);padding:var(--s-2) var(--s-2)}.vhope .vr{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;color:var(--vellum);letter-spacing:0;color:var(--jade)}.vhope p{font-family:var(--f-read);font-size:var(--t-body);margin-top:var(--s-1);color:var(--dim)}.prof{background:var(--panel-2);border-radius:var(--r-control);padding:var(--s-2) var(--s-2);margin-top:var(--s-1)}.prof p{font-family:var(--f-read);color:var(--dim);font-size:var(--t-body);line-height:1.78}.closing{border-top:1px solid var(--line);padding-top:var(--s-4);margin-top:var(--s-5)}.closing h2{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h2);margin:0 0 var(--s-2);color:var(--vellum);letter-spacing:-.025em;line-height:1.25}.closing p{font-family:var(--f-read);font-size:var(--t-body);line-height:1.72;color:var(--dim);margin:0 0 var(--s-3)}.sc-wrap{flex:1;overflow-y:auto;background:var(--ink)}.sc-head{padding:var(--s-5) var(--pad-x) var(--s-3);max-width:var(--w-mid);margin:0 auto}.sc-head .sub{font-family:var(--f-read);font-size:var(--t-lead);color:var(--muted);line-height:1.7;margin:0 0 var(--s-5)}.sc-body{padding:var(--s-2) var(--pad-x) var(--s-6);max-width:var(--w-mid);margin:0 auto}.anchor{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card);margin-bottom:var(--s-3)}.anchor h3{font-family:var(--f-disp);font-weight:600;font-size:var(--t-h3);letter-spacing:-.018em;line-height:1.25;margin:0 0 var(--s-2)}.anchor .row{display:flex;align-items:flex-start;gap:var(--s-2);margin-bottom:var(--s-2);font-size:var(--t-body);line-height:1.7}.anchor .row span{flex:1;min-width:0}.anchor .row b{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;letter-spacing:.01em;text-transform:none;color:var(--vellum);flex:0 0 118px;min-width:0;padding-top:0;line-height:1.35;overflow-wrap:anywhere}.anchor .row span{color:var(--dim)}@media (max-width:560px){.anchor .row{flex-direction:column;gap:.15rem}.anchor .row b{flex:none}}.avoid{background:#fbeae8;border-radius:var(--r-control);padding:var(--s-2) var(--s-2);margin-top:var(--s-3)}.avoid .t{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;letter-spacing:.01em;text-transform:none;color:var(--vellum);color:var(--crimson);margin-bottom:var(--s-1)}.avoid ul{margin:0;padding-left:1.2rem;color:#7a2018;font-size:var(--t-ui);line-height:1.75}.promptbox{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card);margin-bottom:var(--s-2)}.promptbox pre{margin:0;white-space:pre-wrap;word-break:break-word;font-family:var(--f-ui);font-variant-numeric:tabular-nums;font-size:var(--t-sm);line-height:1.9;color:var(--vellum)}.pbar{display:flex;align-items:center;gap:var(--s-1);flex-wrap:wrap;margin-bottom:var(--s-2)}.pbar .t{font-family:var(--f-ui);font-size:var(--t-sm);font-weight:600;letter-spacing:.01em;text-transform:none;color:var(--vellum);margin-right:.25rem}.genbox{background:var(--void);border:1px solid var(--line);border-radius:var(--radius);padding:var(--card);margin-top:var(--s-4)}.keynote{font-size:var(--t-ui);color:var(--muted);line-height:1.65;margin:var(--s-2) 0 var(--s-2)}.genrow{display:flex;gap:var(--s-2);flex-wrap:wrap}.genrow label{display:flex;flex-direction:column;gap:var(--s-1);font-size:var(--t-sm);font-weight:600;color:var(--vellum);flex:1;min-width:0}.genrow select{background:var(--void);border:1px solid var(--line);color:var(--vellum);border-radius:var(--r-control);padding:var(--s-1) var(--s-2);font-family:var(--f-ui);font-size:var(--t-ui);font-weight:400}.genrow select:focus{outline:0;border-color:var(--vellum)}.chk{display:inline-flex;align-items:center;gap:var(--s-1);font-size:var(--t-ui);color:var(--dim);cursor:pointer}.chk input{accent-color:var(--vellum);width:15px;height:15px}.genimg{width:100%;border-radius:var(--radius);border:1px solid var(--line);display:block}.illus-note{font-size:var(--t-ui);color:var(--muted);background:var(--panel-2);border-radius:var(--r-control);padding:var(--s-2) var(--s-2);line-height:1.8;margin-top:var(--s-4);letter-spacing:0}.illus-note b{color:var(--crimson);font-weight:600}.palwrap{position:fixed;inset:0;z-index:400;background:#17170f52;display:flex;align-items:flex-start;justify-content:center;padding:calc(12vh + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left))}/* v609 (a pedido de Giovani): el borde visible alrededor de toda la ventana se sentía «muy marcado» —se suaviza, la sombra ya alcanza para separarla del fondo, sin necesidad de un contorno duro. */ .palbox{width:min(760px,94vw);background:var(--void);border:1px solid transparent;border-radius:var(--radius);box-shadow:0 24px 70px #14120a30;overflow:hidden}.palbox>input{width:100%;border:0;border-bottom:1px solid var(--line-soft);background:var(--void);padding:var(--s-3);color:var(--vellum);font-family:var(--f-ui);font-size:var(--t-lead)}.palbox{position:relative}.rmenux{position:absolute;top:.5rem;right:.55rem;z-index:3;background:none;border:0;cursor:pointer;color:var(--ash);width:30px;height:30px;border-radius:var(--r-control);font-size:var(--t-lead);line-height:1;display:inline-flex;align-items:center;justify-content:center}.rmenux:hover{background:var(--panel-2);color:var(--vellum)}.rmenu:not([data-estrecho="1"]) /* v608: ese margen extra ya no hace falta —el micrófono nuevo se posiciona solo, con su propio right, y el campo ya reserva su espacio—. */ .rfiltro{padding-right:var(--s-2)}.palx{position:absolute;top:.5rem;right:.5rem;z-index:2;background:none;border:0;cursor:pointer;color:var(--ash);width:30px;height:30px;border-radius:var(--r-control);font-size:var(--t-lead);line-height:1} /* v595: el micrófono que ya tenía el buscador viejo, de vuelta aquí — dentro del campo, a la derecha, antes de la ✕ de cerrar—. */ .palmic{position:absolute;top:var(--s-3);right:2.6rem;z-index:2;background:none;border:0;cursor:pointer; color:var(--muted);width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center} .palmic svg{width:18px;height:18px} .palmic[data-on="1"]{color:#c0392b;background:#c0392b1a}.palx:hover{background:var(--panel-2);color:var(--vellum)}.palbox>input{padding-right:5.2rem}.ver-x{position:absolute;z-index:3;top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));width:34px;height:34px;border:0;border-radius:99px;cursor:pointer;background:#1413118c;backdrop-filter:blur(8px);color:#f3eee4;font-size:var(--t-h3);line-height:1}.ver-x:hover{background:#141311cc}.palbox>input:focus{outline:0}.scrim{display:none;position:fixed;inset:0;background:#17170f52;z-index:55;border:0}.scrim.modal{display:flex;align-items:center;justify-content:center;z-index:420;background:#0c0b0994;backdrop-filter:blur(3px);padding:calc(var(--s-4) + env(safe-area-inset-top)) calc(var(--s-4) + env(safe-area-inset-right)) calc(var(--s-4) + env(safe-area-inset-bottom)) calc(var(--s-4) + env(safe-area-inset-left))}::-webkit-scrollbar{width:11px;height:11px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--gold-deep);border-radius:var(--r-control);border:3px solid var(--ink)}::-webkit-scrollbar-thumb:hover{background:#c4beb0}@media (min-width:769px){:root{--pad-x:min(90px, 10.16vw - 40px)}}@media (min-width:769px){:root{--hueco-chat:min(420px, 35.16vw - 170px)}}@media (max-height:500px) and (min-width:641px){html{font-size:108%}}@media (max-height:500px){.solo-ancho{display:none!important}}@media (max-width:1240px){.side{width:330px;flex-basis:330px}}@media (max-width:960px){.side{display:none;position:fixed;right:0;width:92%;max-width:380px;z-index:60;top:env(safe-area-inset-top);bottom:env(safe-area-inset-bottom);padding-right:env(safe-area-inset-right);box-shadow:0 0 60px #14120a38}.side[data-open="1"]{display:flex}.scrim[data-open="1"]{display:block}.pane+.thread-line:before{left:calc(var(--pad-x) + 4px)}.topbar{height:auto;flex-wrap:wrap;gap:var(--s-1);padding:var(--s-1) calc(var(--s-2) + env(safe-area-inset-right)) var(--s-1) calc(var(--s-2) + env(safe-area-inset-left))}.finder{order:4;flex:1 1 100%;display:flex;padding-left:0;position:relative;padding-top:var(--s-1)}.tabs{display:flex;gap:var(--s-1);overflow-x:auto;scrollbar-width:none;order:3;flex:1 1 100%;min-width:0;padding-top:var(--s-1);border-top:1px solid var(--line-soft)}.tl-doc,.tl-notas,.tl-exp,.genbox{padding:var(--s-3)}}@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}.rmode .vsep{margin:0 .2rem}@media (max-width:760px){.rmode .vsep{margin:0 .15rem}}.finder{display:none}.finder[data-abierto="1"]{display:flex}.lupa{flex:0 0 auto}.field,.finder input,.askbar input,.vfiltro input,.aj-clave input,.aj-campo input,.aj-campo select,.aj-campo textarea,.mapsel select,.sbar input,.ver-soltar,textarea.field{border:1px solid var(--borde-campo);background:var(--void)} /* v678 (a pedido de Giovani): «el campo de filtrar versiones está marcado en su entorno, ¿se puede quitar como el campo del versículo?». No era un capricho: «.vfiltro input» ya tenía SU PROPIO estilo, pensado para verse como una píldora rellena y sin borde visible («background:var(--panel-2);border:1px solid transparent», más arriba en este archivo) —el mismo espíritu que «.rfiltro input» (el campo de pasaje), aunque con otra forma, porque uno es un campo para escribir y saltar y el otro es para filtrar una lista visible—. Pero esa regla propia quedó ENTERRADA por esta lista genérica de «campos de formulario» (pensada para el campo de la clave de IA, la barra de Preguntar, el buscador de Módulos, etc.), que por venir DESPUÉS en el archivo —con la misma especificidad— le devolvía el borde visible y el fondo blanco. Nunca se pensó para este campo en particular, sólo lo alcanzó de rebote por compartir selector. Se restaura aquí, después de la regla genérica, el aspecto de píldora que ya tenía pensado. */ .vfiltro input{border-color:transparent;background:var(--panel-2)}.field:focus,.finder input:focus,.askbar input:focus,.auto:focus,.vfiltro input:focus,.aj-clave input:focus,.aj-campo input:focus,.aj-campo select:focus,.aj-campo textarea:focus,.mapsel select:focus,.sbar input:focus{outline:0;border-color:var(--borde-foco);box-shadow:0 0 0 3px color-mix(in srgb,var(--borde-foco) 12%,transparent)} /* v679 (a pedido de Giovani, comparando dos capturas: «la imagen 1 es la que me gustó... y sin bordes en la imagen 2 donde se escribe»): la v678 dejó el campo sin borde EN REPOSO, pero al escribir seguía entrando en la regla de foco genérica de arriba —compartida con la clave de IA, Preguntar, etc.—, que le pone un borde oscuro visible más un anillo suave alrededor. Eso es exactamente lo que Giovani señaló en la segunda imagen. Igual que en la v678: no se toca la regla genérica (la necesitan los demás campos), se agrega ésta después, sólo para «.vfiltro input:focus», para que al escribir se vea IDÉNTICO al reposo —mismo fondo gris, sin borde, sin anillo—, no sólo parecido. */ .vfiltro input:focus{background:var(--panel-2);border-color:transparent;box-shadow:none} @media (max-width:640px){.solo-ancho{display:none!important}.rmode .vsep{display:none}.solo-estrecho{display:inline-flex}.bienvenida,.faltaclave{padding:var(--s-3);border-radius:var(--r-control)}.faltaclave{margin:var(--s-3)}.bienvenida{margin:var(--s-6) 0 var(--s-3)}.bienvenida h2{font-size:var(--t-h3)}.bienvenida p,.faltaclave span{font-size:var(--t-sm)}.bienvenida .btn,.faltaclave .btn{width:100%;justify-content:center}.bloq-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bloq-n{flex:0 0 auto}.cmt-t{font-size:var(--t-xs);line-height:1.6}.cat{padding:var(--s-3)}.cat-rejilla{grid-template-columns:1fr}.cat-item,.aj-pasos{padding:var(--s-2)}.aj-pasos ol{padding-left:1rem;font-size:var(--t-xs)}.aj-pasos .chip{display:block;text-align:center}.verse{padding-left:.5rem;padding-right:.5rem}.tabs{gap:.35rem;padding-bottom:.1rem}.tab{padding-left:.55rem;padding-right:.55rem}.puntos{display:flex;justify-content:center;align-items:center;gap:1rem;order:4;flex:1 1 100%;padding:.15rem 0 .3rem}.punto{width:5px;height:5px;padding:0;border:0;border-radius:50%;background:var(--line);cursor:pointer;flex:0 0 auto;transition:background .15s,transform .15s}.punto[data-on="1"]{background:var(--vellum);transform:scale(1.5)}.punto:after{content:"";position:absolute;width:20px;height:20px;transform:translate(-7.5px,-7.5px)}.punto{position:relative}.panelref{max-height:72dvh}.modrow{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"sw nombre" "sw origen" "acc acc";gap:.15rem var(--s-2);align-items:center;padding:var(--s-2) 0}.modrow .sw{grid-area:sw;align-self:center}.modrow .swlbl,.modrow .kindtag{display:none}.modrow .nm{grid-area:nombre;font-size:var(--t-sm);line-height:1.35}.modrow .dt{grid-area:origen;font-size:var(--t-xs)}.modacc{grid-area:acc;margin-left:0;flex-wrap:wrap;gap:.3rem;margin-top:.4rem}.modacc .chip{flex:1 1 auto;text-align:center;font-size:var(--t-xs);padding:.28rem .4rem}.grupohead{gap:.4rem}.grupoacc{margin-left:0;flex:1 1 100%}.grupoacc button{flex:1 1 auto}.rmode{padding-left:16px;padding-right:16px}.rmode .rbtn{font-size:var(--t-lead)}.ev-drop{margin-block:var(--s-3) var(--s-4);padding:var(--s-3);align-items:flex-start;text-align:left}.ev-drop b{font-size:var(--t-ui)}.ev-drop span{font-size:var(--t-sm)}.basecarga{left:var(--s-2);right:var(--s-2);transform:none;max-width:none;justify-content:center;font-size:var(--t-xs)}.basecarga em{display:none}}.ask-wrap,.cc-wrap,.wd-wrap,.thread-wrap,.tl-wrap,.sc-wrap,.ver-wrap,.lib-wrap,.ev-wrap,.mod-wrap{padding-bottom:var(--s-6)}.ask-wrap,.cc-wrap,.wd-wrap,.thread-wrap,.tl-wrap,.sc-wrap,.ver-wrap,.lib-wrap,.ev-wrap,.mod-wrap{align-content:flex-start;justify-content:flex-start}.ask-wrap>*,.cc-wrap>*,.wd-wrap>*,.thread-wrap>*,.tl-wrap>*,.sc-wrap>*,.ver-wrap>*,.lib-wrap>*,.ev-wrap>*,.mod-wrap>*{flex:0 0 auto}.ask-hero{flex:0 0 auto}.ask-hero[data-bien="1"] .bienvenida{margin-bottom:calc(30px - var(--s-6))}@media (max-width:960px){.panes .pane{flex:0 0 100%;max-width:100%}.panes{overflow-x:hidden}}.ask-wrap>.ask-hero,.ask-wrap>.askbar,.ask-wrap>.askaviso,.ask-wrap>.asksugs,.ask-wrap>.stream,.ask-wrap>.bienvenida,.ask-wrap>.faltaclave,.ask-wrap>.warn,.ask-wrap>.notice{align-self:stretch;width:auto;max-width:none;margin-left:0;margin-right:0}input,textarea,select,.field,.auto,.vfiltro input,.preg-barra input,.aj-campo select,.aj-clave input,.palbox>input,.finder input,.tl-form input,.tl-form select,.wd-form input,.wd-form textarea,.askbar input,.askbar textarea,.thread-bar input{font-size:max(16px,1em)}.instala-frase{margin:var(--s-3) 0 0}.instala-directo{font-family:var(--f-read);font-size:var(--t-lead);line-height:1.6;color:var(--vellum);margin:0 0 var(--s-2)}.ic-compartir{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:var(--r-control);border:1px solid var(--borde-campo);vertical-align:-.55em;margin:0 .15rem;color:var(--vellum)}.instala-donde{font-family:var(--f-ui);font-size:var(--t-sm);color:var(--ash);margin:0;display:flex;align-items:center;gap:.35rem}.instala-donde .flecha{font-size:1.35em;line-height:1;color:var(--oro-texto)}.res-sep{border-top:1px solid var(--line);margin-top:.35rem;padding-top:var(--s-2);padding-bottom:var(--s-1);font-family:var(--f-ui);font-size:var(--t-sm);font-weight:700;letter-spacing:0;color:var(--vellum);text-transform:none}.finder{position:relative;max-width:var(--w-mid);margin-inline:auto;display:none}.finder[data-abierto="1"]{display:block}.finder-caja{display:flex;flex-direction:column;gap:.1rem;background:var(--void);border:1px solid var(--borde-campo);border-radius:var(--r-tarjeta);padding:.34rem .45rem .28rem;transition:border-color .15s,box-shadow .15s}.finder-caja:focus-within{border-color:var(--borde-foco);box-shadow:0 0 0 3px color-mix(in srgb,var(--punto-ia) 20%,transparent)}.finder-caja[data-oyendo="1"]{border-color:var(--crimson)}.finder-linea{display:flex;align-items:center;gap:.55rem}.finder .lupa{position:static;transform:none;flex:0 0 auto;width:18px;height:18px;color:var(--ash)}.finder .lupa svg{width:100%;height:100%;display:block}.finder-linea{gap:.45rem}.finder .lupa{width:16px;height:16px}.finder input{flex:1;min-width:0;background:none!important;border:0!important;outline:0!important;box-shadow:none!important;border-radius:0!important;padding:.1rem 0!important;color:var(--vellum);font-family:var(--f-ui);line-height:1.35;font-size:max(16px,.875rem)}.finder input:focus{box-shadow:none!important;border:0!important}.finder input::placeholder{color:var(--ash)}.finder-ctrl{display:flex;align-items:center;gap:.3rem}.finder-pista{flex:1;min-width:0;font-family:var(--f-ui);font-size:var(--t-xs);color:var(--crimson)}.finder-ic{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;border:0;background:var(--panel-2);color:var(--muted);cursor:pointer;transition:background .14s,color .14s,transform .1s}.finder-ic svg{width:16px;height:16px;display:block}.finder-ic:hover:not(:disabled){background:var(--line-soft);color:var(--vellum)}.finder-ic:active:not(:disabled){transform:scale(.92)}.finder-ic:disabled{opacity:.4;cursor:default}.finder-ic[data-on="1"]{color:var(--void);background:var(--crimson)}.finder-ic[data-trabajo="1"][data-on="1"]{color:var(--void);background:var(--punto-ia);opacity:1}.finder-ic .askgiro{width:14px;height:14px}.finder-ia{display:inline-flex;align-items:center;justify-content:center;height:30px;width:30px;margin-left:.3rem;border-radius:50%;border:0;cursor:pointer;padding:0;background:var(--punto-ia);color:var(--void);transition:opacity .14s,transform .1s}.finder-ia svg{width:14px;height:14px;display:block;flex:0 0 auto}.finder-ia:active:not(:disabled){transform:scale(.92)}.finder-ia:disabled{opacity:.35;cursor:default}.results{max-height:min(70vh,560px)}.res-sep{position:sticky;top:0;z-index:3;background:var(--panel-2);box-shadow:0 6px 10px -7px var(--sep-sombra);border-top:1px solid var(--line);border-bottom:1px solid var(--sep-borde);margin-top:.35rem;padding-top:.45rem;padding-bottom:.45rem;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--oro-texto)}.res[data-sel="1"]{background:var(--panel-2)}.res-ir{background:var(--mark)}.res-mod{font-style:normal;margin-left:.5rem;font-weight:500;font-size:var(--t-xs);color:var(--muted);background:var(--panel-2);border-radius:99px;padding:.05rem .45rem}.res[data-sel="1"] .res-mod{background:var(--void)}.res-nada{padding:var(--s-3) var(--s-2);color:var(--ash);font-family:var(--f-read);font-size:var(--t-ui);line-height:1.65}.cap{display:flex;gap:.65rem;align-items:flex-start;padding:.6rem 0;border-top:1px solid var(--line-soft)}.cap-mini{width:64px;height:64px;flex:0 0 auto;object-fit:cover;border-radius:var(--r-control);border:1px solid var(--line);background:var(--panel-2)}.cap-cuerpo{flex:1;min-width:0}.cap-cab{display:flex;align-items:center;gap:.45rem;margin-bottom:.3rem}.cap-cab b{font-family:var(--f-ui);font-size:var(--t-sm);color:var(--vellum);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cap-ref{flex:0 0 auto;border:1px solid var(--line);border-radius:99px;background:none;cursor:pointer;padding:.05rem .5rem;font-family:var(--f-ui);font-size:var(--t-xs);font-weight:600;color:var(--oro-texto)}.cap-ref:hover{border-color:var(--gold);background:var(--panel-2)}.cap-x{margin-left:auto;flex:0 0 auto;border:0;background:none;cursor:pointer;color:var(--ash);font-size:var(--t-lead);line-height:1;padding:0 .2rem} /* v706 (a pedido de Giovani): fila del panel «Historial» de búsquedas —la pestaña nueva junto a «Comparar»—. Mismo patrón que «.cap»/«.cap-x» -tarjeta más una «×» para quitarla-, con «.sres» de base para la parte que se toca, que es la que ya usan Búsqueda y el Historial de Atrás/Adelante. */ .hbfila{display:flex;align-items:stretch} .hbfila .sres{flex:1;min-width:0} .hbquitar{flex:0 0 auto;align-self:center;border:0;background:none;cursor:pointer;color:var(--ash);font-size:var(--t-lead);line-height:1;padding:0 .6rem} .hbquitar:hover{color:var(--crimson)}.cap-x:hover{color:var(--crimson)}.cap .ed-notas{min-height:0}@media (min-width:561px){.finder-caja{flex-direction:row;align-items:center;gap:.5rem;padding:.4rem .45rem .4rem .75rem;border-radius:var(--r-tarjeta)}.finder-linea{flex:1;min-width:0}.finder-ctrl{flex:0 0 auto}.finder-pista{flex:0 0 auto;margin-right:.35rem}.finder-pista:empty{display:none}}.finder{max-width:var(--w-read);margin-bottom:var(--s-2)}.finder{margin-inline:auto}html[data-theme=dark],html[data-theme=dark] body{background:#1a1a19}html[data-theme=light],html[data-theme=light] body{background:#fbfaf7}.panes[data-cols="1"] .pane{max-width:min(1000px,100%);margin-inline:auto}.rmode,.sidetabs{min-height:48px;box-sizing:border-box}.res-mas{margin-left:.35rem;font-style:normal;font-size:var(--t-xs);font-weight:600;color:var(--ash);background:var(--panel-2);border-radius:99px;padding:.05rem .35rem}.entrada-panel{padding:var(--s-3) 16px var(--s-6)}.entrada-cab{display:flex;align-items:baseline;gap:.5rem;margin-bottom:var(--s-2)}.entrada-tit{margin:0;font-family:var(--f-ui);font-size:var(--t-lead);font-weight:700;color:var(--vellum);flex:1;min-width:0}.entrada-cab .sidex{flex:0 0 auto}/* v691: ya no vuelca texto crudo -ahora es , que arma sus propios

(ya con su propio margen) -, asi que "pre-wrap" sobraba y hubiera heredado saltos de linea sueltos del texto de origen dentro de cada parrafo. */ .entrada-txt{font-family:var(--f-read);font-size:var(--t-body);line-height:1.7;color:var(--vellum);margin-bottom:var(--s-3);max-width:66ch} .entrada-panel .chip{font-size:var(--t-sm)}.nombres-fila{display:flex;flex-wrap:wrap;gap:.4rem}.selbar{max-width:min(92vw,620px)}@media (max-width:560px){.selbar{max-width:94vw}}.seltactil{position:fixed;left:50%;transform:translate(-50%);bottom:calc(4.2rem + env(safe-area-inset-bottom));z-index:450;max-width:92vw;animation:sube .14s ease}.seltactil .chip{background:var(--vellum);color:var(--ink);border-color:transparent;box-shadow:0 8px 28px #14120a57;font-size:var(--t-sm);padding:.55rem 1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:92vw;display:block}.res-sep{background:var(--panel-2)}.side{z-index:300}.selbar{z-index:450}.avisocopia{z-index:460}.sidescroll{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.sidescroll::-webkit-scrollbar{display:none}.sidescroll{padding-block:2px}.guia{z-index:900}.guia{box-shadow:0 0 0 100vmax #14120a47,0 12px 40px #14120a2e}@media (max-width:560px){.modal{padding:calc(var(--s-4) + env(safe-area-inset-top)) calc(.6rem + env(safe-area-inset-right)) calc(var(--s-4) + env(safe-area-inset-bottom)) calc(.6rem + env(safe-area-inset-left))}.dlg{padding:var(--s-4) .8rem}}.finder-aviso{margin-top:.4rem;padding:.5rem .7rem;border-radius:var(--r-control);background:var(--panel-2);border:1px solid var(--sep-borde);font-family:var(--f-ui);font-size:var(--t-sm);color:var(--muted);line-height:1.4}/* LA CAJA DE NOTAS, CENTRADA EN SU TARJETA. «.auto» se sale medio relleno por la izquierda —a propósito, para que su texto caiga donde caería sin caja— pero no recupera ese ancho por la derecha, así que queda CORRIDA: medido, 12 px fuera por la izquierda y 14 corta por la derecha, mientras el rótulo y el párrafo de encima arrancan en el borde de la tarjeta. Es el mismo arreglo que ya llevan las secciones desde la v391; a Notas se le quedó sin hacer. */ .tl-notas .ed-notas{width:calc(100% + var(--s-2) * 2)} .tl-notas .btnrow{flex-wrap:wrap;gap:.5rem}.tl-notas .btnrow .btn:last-child:not(:only-child){background:none;color:var(--muted)}.cap-tit{display:block;margin:0 0 .35rem;line-height:1.35;font-size:var(--t-sm);font-weight:600;color:var(--ink)}.cap-ref{margin-right:auto}.cap-texto{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer;font-size:var(--t-sm);color:var(--muted);line-height:1.5;white-space:pre-wrap}.cap-texto:hover{color:var(--ink)}@media (max-width:960px){.side{bottom:0;padding-bottom:env(safe-area-inset-bottom,0px)}}.cap-tit{font-size:var(--t-sm);line-height:1.35}.cap-texto{font-size:var(--t-xs, .78rem);line-height:1.45;-webkit-line-clamp:2}.cap{padding:.5rem 0;gap:.55rem}.cap-mini{width:52px;height:52px}@media (max-width:560px){.tl-notas .btnrow{display:flex;flex-wrap:wrap;gap:.45rem}.tl-notas .btnrow .btn{flex:1 1 auto;min-width:0;white-space:nowrap}.tl-notas .btnrow .btn:first-child{flex-basis:100%}}.ask-wrap{display:flex;flex-direction:column;min-height:0}@media (max-width:560px){.tl-tipos{margin-bottom:var(--s-5)}.tl-form{flex-direction:column;gap:var(--s-3)}.tl-form label{flex:1 1 100%;width:100%}.tl-form input,.tl-form select,.tl-form textarea{width:100%;box-sizing:border-box;min-height:var(--campo-h);height:auto;padding-top:var(--s-2);padding-bottom:var(--s-2)}.tl-form+.tl-form{margin-top:var(--s-4)!important}.tl-form+.btnrow,.tl-body>.btnrow{display:flex;flex-direction:column;gap:var(--s-2)}.tl-form+.btnrow .btn,.tl-body>.btnrow .btn{width:100%;box-sizing:border-box;min-height:var(--campo-h);justify-content:center}}.tl-seccion{margin-top:var(--s-6);padding:var(--s-4);border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:var(--r-tarjeta);background:var(--panel-2)}.tl-seccion-cab{margin-bottom:var(--s-3);padding-bottom:var(--s-2);border-bottom:1px solid var(--line-soft)}.tl-seccion-tit{margin:0;font-family:var(--f-ui);font-size:var(--t-lead);font-weight:700;letter-spacing:-.01em;color:var(--oro-texto)}.tl-seccion-sub{display:block;margin-top:.15rem;font-family:var(--f-ui);font-size:var(--t-xs);color:var(--muted);line-height:1.4}.center[data-chat="1"]{overflow:hidden;display:flex;flex-direction:column;min-height:0}.center[data-chat="1"] .ask-wrap{flex:1 1 auto;min-height:0;overflow:hidden}.center[data-chat="1"] .ask-wrap .ask-hero{flex:0 0 auto;background:var(--ink);padding-bottom:calc(var(--s-2) + env(safe-area-inset-bottom,0px))}.center[data-chat="1"]{height:100%}@media (max-width:560px){.tl-form input,.tl-form select,.tl-form textarea{min-height:54px;height:54px;line-height:1.3}.tl-form textarea{height:auto}.tl-form+.tl-form{margin-top:var(--s-6)!important}.tl-form+.tl-form input,.tl-form+.tl-form textarea{min-height:96px;height:96px;padding-top:var(--s-3);padding-bottom:var(--s-3);align-items:flex-start}}@media (max-width:560px){.wd-form{flex-direction:column;align-items:stretch;gap:var(--s-2);flex:0 0 auto}.wd-form input{flex:0 0 auto;width:100%;box-sizing:border-box;min-height:54px;height:54px}.wd-form textarea{flex:0 0 auto;width:100%;box-sizing:border-box}.wd-form .btn{align-self:flex-start;width:50%;min-height:54px;justify-content:center}}/* CUIDADO CON LA ESPECIFICIDAD AL AÑADIR AQUÍ. La regla que blanquea es «.btn.primary:disabled», que pesa (0,3). Un selector con una sola clase más el «:disabled» pesa (0,2) y PIERDE: así entraron «.tl-preparar» y otras. (Este comentario estuvo SIN CERRAR desde antes de la v505 y se tragó 29 reglas: la barra de preguntar abajo, el dorado de los títulos, el centrado de la portada de Consulta y las alturas de los chips. Nadie dio error: para el navegador era un comentario largo.) */ :root{--oro-titulo:#7A5A07}[data-theme=dark]{--oro-titulo:#E8C455}.tl-seccion-tit{color:var(--oro-titulo)}.center[data-chat="1"],.center[data-chat="1"]>div{min-height:0}.center[data-chat="1"] .ask-wrap{height:100%;max-height:100%;position:relative}.ask-hero[data-stuck="0"]{order:1;flex:1 1 auto;display:flex;flex-direction:column;justify-content:center;min-height:0}.ask-hero[data-stuck="1"]{order:2;position:absolute;inset:auto 0 0;z-index:20;min-height:0;justify-content:flex-start;padding:var(--s-3) 0 var(--s-2);border-top:0;border-bottom:0;box-shadow:none;background:linear-gradient(to bottom,transparent 0,var(--ink) var(--s-3),var(--ink) 100%)}.ask-wrap .stream{padding-bottom:calc(var(--s-7) + env(safe-area-inset-bottom,0px))}.ask-wrap .stream{order:1;flex:1 1 0%;min-height:0;overflow-y:auto;overscroll-behavior:contain}.stream .qline{margin-left:auto;margin-right:0;width:fit-content;max-width:min(85%,620px);text-align:left;background:var(--panel-2);border-radius:var(--r-tarjeta);padding:var(--s-2) var(--s-3)}.center[data-chat="1"] .ask-wrap{width:100%;max-width:none;padding-inline:0}.ask-wrap .stream>*,.ask-wrap .ask-hero>*{max-width:min(760px,calc(100% - var(--s-4)*2));margin-inline:auto}.ask-wrap .stream>*:last-child{min-height:calc(100% - var(--s-4))}.ask-hero[data-stuck="0"]{justify-content:center;position:static}.ask-hero[data-stuck="0"] .sub{position:static;margin-top:auto;margin-bottom:var(--s-5)}.ask-hero[data-stuck="0"] .askbar{margin-top:0;margin-bottom:0}.ask-hero[data-stuck="0"] .askaviso:last-child{position:static;margin-top:var(--s-3);margin-bottom:auto}.ask-hero[data-stuck="0"] .sub{margin-top:0}.ask-hero[data-stuck="0"] .askaviso:last-child{margin-bottom:0}.ask-hero[data-stuck="0"]:before{content:"";flex:2 2 0%;min-height:0}.ask-hero[data-stuck="0"]:after{content:"";flex:1 1 0%;min-height:0}.ask-hero[data-stuck="0"]{min-height:0}.ask-wrap .stream{padding-top:var(--s-2)}.ask-wrap .stream>*:first-child{scroll-margin-top:var(--s-4)}.stream .qline{scroll-margin-top:var(--s-4)}.ask-wrap .stream>*:last-child{min-height:calc(50% - var(--s-4))}.center[data-chat="1"]:has(.ask-hero[data-stuck="0"]) .ask-wrap{overflow-y:auto}.ask-hero[data-stuck="0"] .sub{margin-bottom:var(--s-7)}.chip,.seg-opt,.seed,.vfiltro input,.preg-barra input,.aj-clave input{min-height:var(--alto-control-min);display:inline-flex;align-items:center}.vfiltro input,.preg-barra input,.aj-clave input{display:block;padding-top:0;padding-bottom:0;line-height:var(--alto-control-min)} /* ---- Las pestañas de Recursos, del alto de la barra de Biblia -------- Medido en una captura: «Recursos» daba 88 px de caja y «Del pasaje» 62. Los dos usan la misma letra, pero el relleno vertical difería —.55rem contra .5rem— y el «chip» lleva además una sombra que lo agranda. Se les da a los dos la MISMA altura declarada en vez de confiar en que el relleno cuadre: así siguen coincidiendo aunque uno cambie de letra. */ .chip,.sidetab{min-height:2.5rem;display:inline-flex;align-items:center; justify-content:center;box-sizing:border-box} .sidetab{padding-top:0;padding-bottom:0} /* ==================== CINCO AJUSTES MEDIDOS ========================== 1 · La pregunta, un punto sobre el titular de sección. Medido en la captura: la pregunta daba 43 px de altura de letra y «El Dios que establece alianzas» 32, pero «.qline» no declaraba tamaño —heredaba— y bastaba un cambio en el contenedor para que se igualaran. */ .stream .qline{font-size:var(--t-lead);line-height:1.4} /* 2 · En Estudio, el campo de la referencia del alto del primero. «Juan 1:1» salía en una caja alta porque hereda el textarea del pasaje; es un input de una línea y debe medir como «Palabra». */ .wd-form input{min-height:2.9rem;height:2.9rem} /* 4 · Hilo: el campo más alto y ancho, y «Trazar» debajo, como en Estudio. Iban en la misma fila —«.thread-bar»— y el campo quedaba estrecho: el texto de ejemplo se cortaba a media frase. */ @media (max-width:560px){ .thread-bar{display:flex;flex-direction:column;align-items:stretch; gap:var(--s-2)} .thread-bar input{width:100%;box-sizing:border-box;min-height:5rem;height:5rem; align-items:flex-start;padding-top:var(--s-2)} .thread-bar .btn{width:100%;min-height:2.9rem} /* Las burbujas de tema, más abajo y en dos columnas. */ .seeds{margin-top:var(--s-4);display:grid;grid-template-columns:1fr 1fr; gap:var(--s-1)} .seeds .seed{width:100%;justify-content:center;white-space:normal; text-align:center} /* 5 · Escena: los encuadres en dos filas, debajo del campo. En una sola fila «Primer plano cinematográfico» ocupaba el ancho entero y empujaba a los demás a líneas sueltas. */ .sc-wrap .ev-filters{display:grid;grid-template-columns:1fr 1fr; gap:var(--s-1);margin-top:var(--s-3)} .sc-wrap .ev-filters .chip{width:100%;justify-content:center; white-space:normal;text-align:center} } /* ---- Las dos barras, a la misma altura ------------------------------- Medido en una captura: «Recursos» y «Del pasaje» ya miden lo mismo —80 px de caja— pero el de la izquierda se asienta 5 px más abajo, y eso se ve como un escalón entre la barra de Biblia y la del panel. La causa: «.sidetabs» declara 48 px fijos, mientras que «.rmode» sólo pone relleno y crece con lo que lleve dentro; con el chip a 44 px acaba en unos 58. Se les da a las dos la misma altura declarada, para que sigan coincidiendo aunque cambie lo que contienen. */ .rmode,.sidetabs{min-height:3.4rem;box-sizing:border-box;align-items:center} /* ==================== EL FORMULARIO DE ESTUDIO ======================== Los tres campos iban en fila y no cuadraban: la referencia se cortaba —«Deuteronomio 20:10-» y ahí se acababa—, los bordes de arriba no coincidían con los del textarea, y el botón quedaba pegado sin aire. Se apilan a lo ancho completo, que resuelve las cuatro cosas de una vez: la referencia cabe entera, los tres bordes coinciden por definición, y cada uno tiene su separación. */ /* En ESCRITORIO: «Palabra» y la referencia comparten fila, 60 y 40 por ciento. El pasaje debajo, a lo ancho. Apilarlos los tres era la solución del teléfono y en pantalla ancha desperdicia sitio. */ .wd-form{display:flex;flex-wrap:wrap;align-items:flex-start;gap:var(--s-2)} /* «width:auto» explícito: una regla anterior deja «width:100%» en los input, y como sólo declaraba «flex» aquí, ese 100 % sobrevivía y los empujaba a líneas separadas. Redeclarar «flex» no borra el «width». */ /* «flex:1 1 …», no «flex:0 1 …». Ese cero de la primera cifra significa «no crezcas»: la referencia se quedaba en su ancho natural —45 mm en vez de los 95 que le tocaban— y la fila terminaba 49 mm antes que el pasaje. Medido sobre una captura, no deducido. */ .wd-form > input:nth-of-type(1){flex:1 1 calc(60% - var(--s-2)/2);width:auto;min-width:0} .wd-form > input:nth-of-type(2){flex:1 1 calc(40% - var(--s-2)/2);width:auto;min-width:0} .wd-form > textarea{flex:1 1 100%;width:100%;box-sizing:border-box} /* Y el botón, del tamaño de su texto: nunca el ancho de la página. */ .wd-form > .btn{flex:0 0 auto;width:auto;min-width:9rem} /* En el TELÉFONO sí se apilan: 60/40 dejaría los dos campos ilegibles. */ @media (max-width:560px){ .wd-form{flex-direction:column;align-items:stretch} .wd-form > input,.wd-form > textarea,.wd-form > .btn{ flex:0 0 auto;width:100%;box-sizing:border-box} .wd-form > .btn{width:50%} } /* El mismo borde que el campo de Consulta, para que se lean como la misma cosa: antes usaban «--line», más apagado. */ .wd-form input,.wd-form textarea{ border:1px solid var(--borde-campo);border-radius:var(--r-control)} /* La referencia es un campo de una línea, como «Palabra»: iba alta porque heredaba del textarea del pasaje. */ .wd-form input{min-height:2.9rem;height:2.9rem} /* El pasaje sí crece, y con sitio para leerlo sin desplazar tanto. */ .wd-form textarea{min-height:11rem;height:auto;resize:vertical} /* Y aire antes del botón, que estaba pegado al textarea. */ .wd-form .btn{margin-top:var(--s-2)} /* ==================== ESTUDIO: UNA CAJA, TRES PAPELES ================= Antes eran tres campos idénticos. Pero no hacen lo mismo: la palabra la escribes tú, la referencia la eliges, y el texto bíblico llega solo y no se toca. Un textarea de 24 cm invitaba a escribir en algo que se rellena desde Biblia. Ahora el aspecto dice el papel de cada uno. */ .wd-form{box-sizing:border-box;display:block;background:var(--void); border:1px solid var(--borde-campo);border-radius:var(--r-tarjeta); padding:var(--s-3) var(--s-3) var(--s-2)} /* La palabra: grande, con el botón al lado. Es la pregunta. */ .wd-linea{display:flex;align-items:center;gap:var(--s-2)} .wd-form input.wd-palabra{flex:1;min-width:0;width:auto; background:none;border:0;outline:0;padding:0; font-family:var(--f-read);font-size:var(--t-lead);color:var(--vellum); min-height:2.4rem;height:2.4rem} .wd-linea .btn{flex:0 0 auto;width:auto;min-height:2.4rem;padding-inline:var(--s-3)} .wd-sep{height:1px;background:var(--line); margin:var(--s-2) calc(var(--s-3) * -1) var(--s-2)} /* La referencia: campo con borde, porque se edita. La versión al lado, sin borde, porque sólo informa: viene de la biblia abierta en Biblia. */ .wd-ref{display:flex;align-items:center;gap:var(--s-2)} .wd-ref input{flex:0 0 auto;width:auto;min-width:8.5rem; background:var(--panel-2);border:1px solid var(--borde-campo); border-radius:var(--r-control);padding:0 var(--s-2); min-height:2.2rem;height:2.2rem;color:var(--vellum);font-size:var(--t-ui)} .wd-version{font-size:var(--t-xs);color:var(--dim);letter-spacing:.02em} /* El texto: cita, no campo. Filete lateral, serifa del lector, sin fondo ni borde: nada invita a escribir aquí. Crece con el versículo. */ .wd-cita{margin:var(--s-2) 0 0;padding:0 0 0 var(--s-2); border-left:2px solid var(--line); font-family:var(--f-read);font-size:var(--t-ui);line-height:1.7; color:var(--dim)} .wd-cita .empty{font-style:normal} /* Y el campo de pegar, sólo cuando se pide. */ .wd-form textarea.wd-pegar{width:100%;box-sizing:border-box;margin-top:var(--s-2); background:var(--panel-2);border:1px solid var(--borde-campo); border-radius:var(--r-control);padding:var(--s-2);color:var(--vellum); font-family:var(--f-read);font-size:var(--t-ui);line-height:1.7;resize:vertical} .wd-pies{display:flex;justify-content:flex-end;margin-top:var(--s-2)} .wd-pegar-btn{background:none;border:0;padding:var(--s-05) 0;cursor:pointer; font-family:var(--f-ui);font-size:var(--t-xs);color:var(--dim)} .wd-pegar-btn:hover{color:var(--vellum)} /* En el teléfono, el botón baja bajo la palabra. */ @media (max-width:560px){ .wd-linea{flex-wrap:wrap} .wd-form input.wd-palabra{flex:1 1 100%} .wd-linea .btn{width:100%;min-height:2.9rem} } /* ==================== EL MAPA DE LA PALABRA ========================== Concordancia recorre 31.000 versículos y devolvía una lista plana: no se veía que «pastor» se concentra en Salmos y Ezequiel y falta casi entera en las cartas. Esa forma dice algo sobre la palabra. Barras proporcionales por sección del canon, en orden bíblico. Tocar una filtra la lista. */ .cc-mapa{margin:var(--s-3) 0 var(--s-4)} .cc-mapa-tit{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--dim); margin-bottom:var(--s-1)} .cc-barras{display:flex;gap:2px;align-items:stretch;height:4.6rem} /* Cada barra es un botón: el alto lo pone el hijo, para que la etiqueta quede siempre abajo aunque la barra sea diminuta. */ .cc-barra{flex:1 1 0;min-width:0;background:none;border:0;padding:0; cursor:pointer;display:flex;flex-direction:column;justify-content:flex-end; gap:var(--s-05)} /* Radio sólo arriba, con la variable de control: la prueba del vocabulario de forma salta si se escribe un valor suelto, y tenía razón. */ .cc-barra-alto{display:block;width:100%;background:var(--line); border-radius:var(--r-control) var(--r-control) 0 0;transition:background .15s} .cc-barra:hover .cc-barra-alto{background:var(--dim)} .cc-barra[data-on="1"] .cc-barra-alto{background:var(--vellum)} /* La etiqueta, recortada sin cortar palabras a mitad: con diez secciones no cabe el nombre entero en el teléfono. */ .cc-barra-et{display:block;font-family:var(--f-ui);font-size:var(--t-xs); color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; text-align:center;line-height:1.3} .cc-barra[data-on="1"] .cc-barra-et{color:var(--vellum)} @media (max-width:560px){ .cc-barras{height:3.4rem} .cc-barra-et{font-size:var(--t-xs)} } /* ==================== CONCORDANCIA: LA CAJA Y LAS FILAS =============== El buscador era un campo suelto con botones cuadrados debajo, y no se parecía a ninguna otra vista. Ahora es la misma caja de Estudio. */ /* (la regla de .cc-caja vive más abajo: estaba escrita dos veces y la segunda borraba el margen de ésta) */ .cc-lupa{font-style:normal;font-size:var(--t-h3);color:var(--dim);line-height:1} .cc-caja input.cc-campo{flex:1;min-width:0;width:auto;background:none;border:0; outline:0;padding:0;font-family:var(--f-read);font-size:var(--t-lead); color:var(--vellum);min-height:2.4rem;height:2.4rem} /* El tamaño de lo encontrado, antes de leer nada. */ /* Los modos, píldoras: cuatro botones cuadrados pesaban más que el campo. */ .cc-modo{background:none;border:1px solid var(--line);border-radius:var(--r-pildora); padding:var(--s-1) var(--s-2);cursor:pointer;font-family:var(--f-ui); font-size:var(--t-sm);color:var(--dim);min-height:2rem} .cc-modo[data-on="1"]{background:var(--vellum);border-color:var(--vellum); color:var(--void)} /* Los resultados: filas de texto, no tarjetas. Con cien resultados las tarjetas convierten una lectura en un inventario. */ .sres.cc-fila{display:flex;gap:var(--s-2);align-items:flex-start;width:100%; background:none;border:0;border-bottom:1px solid var(--line-soft); border-radius:0;padding:var(--s-2) 0;text-align:left;cursor:pointer} .sres.cc-fila:hover{background:var(--panel-2)} .sres.cc-fila .rr{flex:0 0 8.5rem;font-family:var(--f-ui);font-size:var(--t-xs); color:var(--oro-titulo, var(--dim));line-height:1.6;padding-top:2px} .sres.cc-fila .rt{flex:1;min-width:0;font-family:var(--f-read); font-size:var(--t-ui);line-height:1.7;color:var(--dim)} @media (max-width:560px){ .sres.cc-fila{flex-direction:column;gap:var(--s-05)} .sres.cc-fila .rr{flex:0 0 auto} } /* ==================== CONCORDANCIA: BUSCADOR Y RESULTADOS ============ La misma caja que Estudio: campo grande, recuento a la derecha, y los modos como píldoras bajo una línea. Antes era un campo suelto con botones cuadrados debajo y no se parecía a ninguna otra vista. */ .cc-caja{box-sizing:border-box;background:var(--void);border:1px solid var(--borde-campo); border-radius:var(--r-tarjeta);padding:var(--s-3) var(--s-3) var(--s-2); margin-bottom:var(--s-3)} .cc-linea{display:flex;align-items:center;gap:var(--s-2)} .cc-lupa{flex:0 0 auto;font-size:var(--t-h3);line-height:1;color:var(--dim);font-style:normal} .cc-campo{flex:1;min-width:0;background:none;border:0;outline:0;padding:0; font-family:var(--f-read);font-size:var(--t-lead);color:var(--vellum); min-height:2.4rem;height:2.4rem} .cc-recuento{flex:0 0 auto;font-family:var(--f-ui);font-size:var(--t-xs); color:var(--dim);white-space:nowrap} .cc-sep{height:1px;background:var(--line); margin:var(--s-2) calc(var(--s-3) * -1) var(--s-2)} /* Los modos, píldoras: el elegido en sólido, los demás con filete. */ .cc-modos{display:flex;gap:var(--s-1);flex-wrap:wrap} .cc-modo{background:none;border:1px solid var(--line);border-radius:var(--r-pildora); padding:var(--s-1) var(--s-3);cursor:pointer; font-family:var(--f-ui);font-size:var(--t-sm);color:var(--dim); min-height:2.1rem} .cc-modo:hover{color:var(--vellum)} .cc-modo[data-on="1"]{background:var(--vellum);border-color:var(--vellum);color:var(--void)} /* Los resultados: fila, no tarjeta. La referencia en columna fija a la izquierda y el versículo en la serifa del lector. Con cien resultados, las tarjetas convierten una lectura en un inventario. */ .cc-fila{display:flex;gap:var(--s-3);width:100%;text-align:left; background:none;border:0;border-bottom:1px solid var(--line-soft); border-radius:0;padding:var(--s-2) 0;cursor:pointer} .cc-fila:hover{background:var(--panel-2)} .cc-fila .rr{flex:0 0 7rem;min-width:0;margin:0; font-family:var(--f-ui);font-size:var(--t-xs);color:var(--oro-titulo, var(--gold)); white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .cc-fila .rt{flex:1;min-width:0;margin:0; font-family:var(--f-read);font-size:var(--t-ui);line-height:1.7;color:var(--dim)} @media (max-width:560px){ .cc-fila{flex-direction:column;gap:var(--s-05)} .cc-fila .rr{flex:0 0 auto} .cc-modo{flex:1 1 auto;justify-content:center} } /* ---- Los resultados de Concordancia, con el formato de Estudio ------- Caja con fondo propio, el versículo en la serifa del lector y la referencia debajo en versalitas. Antes era una fila con la referencia a un lado; así los dos módulos entregan la respuesta con la misma forma. */ /* Una sola regla, con el «display:flex» dentro. Estaba escrita DOS veces y la segunda —sólo con display y dirección— borraba el relleno, el borde y el ancho de la primera: las cajas salían sin caja y más estrechas que el buscador. Redeclarar una regla pierde lo que traía la anterior. */ .cc-verso{display:flex;flex-direction:column;width:100%;text-align:left; cursor:pointer;box-sizing:border-box; /* Blanco, como el buscador: «--void» es #FFFFFF en tema claro y el gris oscuro en el otro, así que sigue al tema sin quedar apagado. Con «--panel-2» la caja salía en crema y no se leía como caja. */ background:var(--void);border:1px solid var(--line); border-radius:var(--r-tarjeta);padding:var(--s-3); margin:0 0 var(--s-2)} .cc-verso:hover{border-color:var(--borde-campo)} /* El texto primero, grande. */ .cc-verso .rt{margin:0;font-family:var(--f-read);font-size:var(--t-body); line-height:1.85;color:var(--dim)} /* Y la referencia debajo, en versalitas, como en la caja del pasaje. */ /* Sin «order»: el orden lo pone ya el marcado. */ .cc-verso .rr{margin:var(--s-2) 0 0;font-family:var(--f-ui); font-size:var(--t-xs);font-weight:600;letter-spacing:.02em; color:var(--vellum);text-transform:uppercase} /* ==================== HILO: CAJA, REGLA Y CADENA ===================== Tres piezas, y la del medio es nueva. La caja es la misma de Estudio y Concordancia, pero aquí lleva además la TESIS y la TENSIÓN: la aplicación ya las pide a la IA y se perdían entre el resto. */ .hl-caja{box-sizing:border-box;background:var(--void);border:1px solid var(--borde-campo); border-radius:var(--r-tarjeta);padding:var(--s-3)} .hl-linea{display:flex;align-items:center;gap:var(--s-2)} .hl-icono{flex:0 0 auto;font-size:var(--t-h3);line-height:1;color:var(--dim);font-style:normal} .hl-campo{flex:1;min-width:0;background:none;border:0;outline:0;padding:0; font-family:var(--f-read);font-size:var(--t-lead);color:var(--vellum); min-height:2.4rem;height:2.4rem} .hl-linea .btn{flex:0 0 auto;width:auto;min-height:2.4rem;padding-inline:var(--s-3)} .hl-sep{height:1px;background:var(--line); margin:var(--s-2) calc(var(--s-3) * -1) var(--s-2)} .hl-tesis{margin:0;font-family:var(--f-read);font-size:var(--t-ui); line-height:1.7;color:var(--dim)} .hl-tension{display:flex;gap:var(--s-2);align-items:baseline;margin-top:var(--s-2); font-family:var(--f-ui);font-size:var(--t-xs);color:var(--dim);line-height:1.5} .hl-tension-et{flex:0 0 auto;font-size:var(--t-xs);letter-spacing:.06em; color:var(--oro-texto);white-space:nowrap} /* La REGLA DEL CANON: tramos proporcionales por sección, con un punto por cada eslabón. Se ve de un vistazo si el tema atraviesa la Escritura. Comparte el ancho y el margen lateral del bloque del buscador, que vive en «.thread-hero». La regla y la cadena quedan FUERA de ese contenedor —el bloque de resultados se abre después— así que sin esto se salían por los dos lados. */ .hl-regla,.hl-cadena,.hl-aviso{max-width:var(--w-mid);margin-inline:auto; padding-inline:var(--pad-x);box-sizing:border-box} .hl-regla{margin-top:var(--s-4);margin-bottom:var(--s-3)} .hl-regla-tramos{display:flex;gap:2px;align-items:center;height:1.4rem} .hl-tramo{flex:1 1 0;position:relative;height:100%} .hl-via{position:absolute;left:0;right:0;top:50%;height:3px; transform:translateY(-50%);background:var(--line);border-radius:2px} .hl-punto{position:absolute;top:50%;width:10px;height:10px; transform:translate(-50%,-50%);border-radius:50%;background:var(--vellum)} .hl-regla-ets{display:flex;gap:2px;margin-top:var(--s-05)} .hl-et{flex:1 1 0;min-width:0;font-family:var(--f-ui);font-size:var(--t-xs); color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} /* La CADENA. El filete la recorre entera y los nodos la enhebran; el último va relleno porque es donde desemboca. */ /* El relleno lateral ya lo pone la regla de arriba; aquí sólo el hueco que necesita el filete de la cadena, sumado al que ya había. */ .hl-cadena{position:relative;margin-top:var(--s-4); padding-left:calc(var(--pad-x) + var(--s-4))} .hl-cadena::before{content:"";position:absolute;left:calc(var(--pad-x) + 5px);top:.6rem;bottom:1.4rem; width:1px;background:var(--line)} .hl-eslabon{position:relative;padding-bottom:var(--s-4)} .hl-eslabon:last-child{padding-bottom:0} .hl-nodo{position:absolute;left:calc(var(--s-4) * -1);top:.35rem; width:11px;height:11px;border-radius:50%; background:var(--void);border:2px solid var(--vellum);box-sizing:border-box} .hl-eslabon[data-fin="1"] .hl-nodo{background:var(--vellum)} .hl-cab{display:flex;gap:var(--s-2);align-items:baseline;flex-wrap:wrap} .hl-ref{background:none;border:0;padding:0;cursor:pointer; font-family:var(--f-ui);font-size:var(--t-xs);color:var(--oro-texto)} .hl-ref:hover{text-decoration:underline} /* En negrita. Es el título del eslabón y competía en peso con el párrafo que lleva debajo: al recorrer un hilo largo no se distinguía dónde empezaba cada uno. El 600 es el mismo peso que usan los títulos del resto de la aplicación. */ .hl-tit{font-family:var(--f-ui);font-size:var(--t-ui);font-weight:600;color:var(--vellum)} .hl-clave{border:1px solid var(--line);border-radius:var(--r-pildora); padding:1px var(--s-2);font-family:var(--f-ui);font-size:var(--t-xs); color:var(--dim)} .hl-aporte{margin:var(--s-1) 0 0;font-family:var(--f-read);font-size:var(--t-ui); line-height:1.7;color:var(--dim)} .hl-cargando{max-width:52ch;margin-top:var(--s-1)} @media (max-width:560px){ .hl-linea{flex-wrap:wrap} /* EL CAMPO NO SE LLEVA LA FILA ENTERA. Con «flex:1 1 100%» el icono «⟋» se quedaba solo en el primer renglón y el texto bajaba al siguiente. Con la base —«flex:1;min-width:0»— comparten línea y el campo ocupa lo que sobra. El botón sigue debajo, a todo el ancho, que eso sí era lo buscado. */ .hl-linea .btn{width:100%;min-height:2.9rem} .hl-et{font-size:var(--t-xs)} } /* ---- Concordancia: las dos clases de resultado, con la misma forma ---- Convivían dos formatos en la misma respuesta: las entradas de diccionario como texto separado por filetes, y los versículos como tarjetas con borde. Además el filete llegaba al ancho completo y la tarjeta terminaba antes, así que los bloques no acababan en la misma vertical. Ahora los dos son caja: mismo borde, mismo relleno, mismo ancho. */ .cc-body .xcard{box-sizing:border-box;width:100%; background:var(--void);border:1px solid var(--line); border-bottom:1px solid var(--line); border-radius:var(--r-tarjeta);padding:var(--s-3); margin:0 0 var(--s-2)} /* La cabecera de la entrada: el código y su procedencia. */ .cc-body .xtop{display:flex;gap:var(--s-2);align-items:baseline; margin-bottom:var(--s-1)} /* ---- El mapa, legible y con respuesta ------------------------------- Medido: con nueve secciones y la más baja al 6 %, esa barra quedaba en 5 px de alto. El botón respondía —el filtro funcionaba— pero parecía que no hubiera nada que pulsar, y al elegir una no se notaba. Tres cosas: un mínimo visible, un fondo que marca el área tocable, y una señal clara de cuál está elegida. */ .cc-barra{position:relative;padding:var(--s-05) 0 0;border-radius:var(--r-control)} .cc-barra:hover{background:var(--panel-2)} .cc-barra[data-on="1"]{background:var(--panel-2)} /* Ninguna baja de 8 px: por debajo no se ve ni se acierta. */ .cc-barra-alto{min-height:8px} /* La elegida, en dorado y con su etiqueta marcada: antes cambiaba a un gris claro que apenas se distinguía del normal. */ .cc-barra[data-on="1"] .cc-barra-alto{background:var(--gold)} .cc-barra[data-on="1"] .cc-barra-et{color:var(--vellum);font-weight:600} /* Y el recuento sobre cada barra, que es el dato que se venía a buscar. */ .cc-barra-n{display:block;font-family:var(--f-ui);font-size:var(--t-xs); color:var(--dim);text-align:center;line-height:1;margin-bottom:2px} .cc-barra[data-on="1"] .cc-barra-n{color:var(--oro-texto)} /* ---- El interior de las cajas de resultado --------------------------- El texto del diccionario llevaba «max-width:64ch», heredado de cuando estos resultados eran texto corrido: dentro de una caja se cortaba antes del borde y dejaba un hueco a la derecha. Y el interior en otro tono, para que se distinga del fondo de la vista: una caja del mismo color que la página no se lee como caja. */ /* Las entradas de DICCIONARIO en otro tono, los versículos en blanco: al compartir la misma respuesta conviene distinguirlas de un vistazo sin tener que leer qué es cada una. */ .cc-body .xcard{background:var(--panel-2)} .cc-body .xtxt{max-width:none;color:var(--dim)} /* Los versículos, sin tope de ancho. El fondo NO se declara aquí: la regla de «.cc-verso» ya existe más arriba y volver a escribirla le borraría el borde y el relleno. La prueba de duplicados lo cazó. */ .cc-verso .rt{max-width:none} /* ---- Los resultados, del ancho del buscador -------------------------- Las dos clases de caja comparten contenedor, así que el ancho debería coincidir. Se declara igualmente sin ambigüedad: «.sres» —de la que heredan— trae su propio relleno y un margen que podía meterlas. */ .cc-body .cc-verso,.cc-body .xcard{ width:100%;max-width:none;margin-left:0;margin-right:0; box-sizing:border-box} /* Los ejemplos de la pestaña de raíz: misma píldora que los modos, con la transliteración en tono menor para que el código destaque. */ .cc-ejemplos-et{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--dim); align-self:center;margin-right:var(--s-05)} .cc-ejemplo-tr{color:var(--dim);font-style:italic} /* La caja del análisis, con el mismo blanco que los versículos. */ .cc-raiz{background:var(--void);border:1px solid var(--line); border-radius:var(--r-tarjeta);padding:var(--s-3); margin-top:var(--s-3);box-sizing:border-box;width:100%} /* ---- Las pestañas, dentro de la caja --------------------------------- «Texto» y «Raíz y lema» estaban fuera, sueltas sobre la vista. Cambian el buscador ENTERO —campo, marcador, botón y la fila de abajo— y verlo suceder dentro de la misma caja explica por qué; fuera parecían dos cosas sin relación. Con subrayado, no con píldora: los modos de abajo ya son píldoras y son otra cosa —éstas cambian QUÉ se busca, aquéllas CÓMO—. Si se ven igual, se confunden. */ .cc-caja-pest{padding:0;overflow:hidden} .cc-cuerpo{padding:var(--s-3) var(--s-3) var(--s-2)} .cc-pest{display:flex;gap:var(--s-4); padding:0 var(--s-3);border-bottom:1px solid var(--line)} .cc-pest-b{background:none;border:0;border-bottom:2px solid transparent; padding:var(--s-2) 2px;cursor:pointer; font-family:var(--f-ui);font-size:var(--t-ui);color:var(--dim)} .cc-pest-b:hover{color:var(--vellum)} .cc-pest-b[data-on="1"]{color:var(--vellum);border-bottom-color:var(--vellum)} /* El separador interior se mide contra el cuerpo, no contra la caja. */ .cc-cuerpo .cc-sep{margin-inline:calc(var(--s-3) * -1)} /* ---- La pestaña elegida, con marca de verdad ------------------------- Un subrayado de 2 px y el texto un tono más claro era todo. En una caja con cuatro píldoras debajo —que sí llevan fondo sólido— la pestaña activa quedaba como el elemento menos marcado de la caja, siendo el que más manda: cambia el buscador entero. Ahora: fondo propio, el filete más grueso, y el texto en su peso. */ .cc-pest-b{border-radius:var(--r-control) var(--r-control) 0 0; border-bottom-width:3px;padding-inline:var(--s-2); transition:background .15s,color .15s} /* El filete, del color del texto —negro en tema claro, claro en oscuro— y no dorado: el dorado es el acento de las referencias y las citas, y aquí competía con ellas sin significar lo mismo. */ .cc-pest-b[data-on="1"]{background:var(--panel-2);font-weight:600; border-bottom-color:var(--vellum);color:var(--vellum)} .cc-pest-b[data-on="1"]:hover{background:var(--panel-2)} /* ---- En el teléfono, aire --------------------------------------------- Medido en 393 px: la caja por dentro deja 331, las cuatro píldoras suman 307 —caben por 24 px— y con el botón al lado al campo le quedaban 165. Todo pegado a los bordes y entre sí. */ @media (max-width:560px){ /* Las pestañas se reparten el ancho: así son más fáciles de acertar y se ve dónde acaba una y empieza la otra. */ .cc-pest{gap:0;padding:0} .cc-pest-b{flex:1 1 0;text-align:center;padding-block:var(--s-2)} /* El campo a lo ancho y el botón debajo: con los dos en fila, ninguno tenía sitio. */ .cc-linea{flex-wrap:wrap} .cc-campo{flex:1 1 100%;order:2} .cc-lupa{order:1} .cc-recuento{order:3;flex:1 1 100%;text-align:right} .cc-linea .btn{order:4;flex:1 1 100%;width:100%;min-height:2.9rem; margin-top:var(--s-2)} /* Y las píldoras en dos filas, que en una iban al milímetro. */ .cc-modos{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-1)} .cc-modo{width:100%;justify-content:center} .cc-ejemplos-et{grid-column:1 / -1} } /* ==================== CLASE: LA CAJA DE PREPARACIÓN ================== Los cinco tipos eran una tira de botones que ocupaba dos líneas y competía con los campos; el pasaje, el auditorio y la duración, tres campos con etiqueta en tres líneas para cambiar un valor cada uno. Ahora: los tipos como pestañas —cambian la pieza entera—, el pasaje en grande con su botón, y los ajustes como píldoras. */ .tl-caja{box-sizing:border-box;background:var(--void); border:1px solid var(--borde-campo);border-radius:var(--r-tarjeta); overflow:hidden;margin-bottom:var(--s-3)} .tl-pest{display:flex;padding:0 var(--s-2);border-bottom:1px solid var(--line); overflow-x:auto;scrollbar-width:none} .tl-pest::-webkit-scrollbar{display:none} .tl-pest-b{flex:0 0 auto;background:none;border:0; border-bottom:3px solid transparent;padding:var(--s-2) var(--s-2); cursor:pointer;white-space:nowrap; font-family:var(--f-ui);font-size:var(--t-ui);color:var(--dim)} .tl-pest-b:hover{color:var(--vellum)} .tl-pest-b[data-on="1"]{background:var(--panel-2);color:var(--vellum); font-weight:600;border-bottom-color:var(--vellum); border-radius:var(--r-control) var(--r-control) 0 0} .tl-cuerpo{padding:var(--s-3)} /* Sin el símbolo delante: ocupaba sitio sin decir nada, y al apilarse en el teléfono se quedaba solo en un renglón. */ .tl-linea{display:flex;align-items:center;gap:var(--s-2)} .tl-pasaje{flex:1;min-width:0;background:none;border:0;outline:0;padding:0; font-family:var(--f-read);font-size:var(--t-lead);color:var(--vellum); min-height:2.4rem;height:2.4rem} .tl-linea .btn{flex:0 0 auto;width:auto;min-height:2.4rem;padding-inline:var(--s-3)} .tl-sep{height:1px;background:var(--line); margin:var(--s-2) calc(var(--s-3) * -1) var(--s-2)} /* Los ajustes: cada uno cambia un valor y no necesita etiqueta aparte. */ .tl-ajustes{display:flex;gap:var(--s-1);flex-wrap:wrap;align-items:center} .tl-pildora{display:inline-flex;align-items:center; border:1px solid var(--borde-campo);border-radius:var(--r-control); padding:0 var(--s-2);min-height:2.1rem} .tl-pildora select{background:none;border:0;outline:0;padding:0; font-family:var(--f-ui);font-size:var(--t-sm);color:var(--vellum);cursor:pointer} .tl-enfasis{flex:1 1 10rem;min-width:0; border:1px solid var(--borde-campo);border-radius:var(--r-control); background:none;padding:0 var(--s-2);min-height:2.1rem; font-family:var(--f-ui);font-size:var(--t-sm);color:var(--vellum)} .tl-hueco{flex:1 1 0;min-width:0} .tl-blanco{background:none;border:0;padding:var(--s-05) 0;cursor:pointer; font-family:var(--f-ui);font-size:var(--t-sm);color:var(--dim); text-decoration:underline;text-underline-offset:3px} .tl-blanco:hover{color:var(--vellum)} /* ---- El reparto del tiempo ------------------------------------------- Elegías la duración y la aplicación no volvía a mencionarla. */ .tl-reparto{margin:var(--s-3) 0 var(--s-4)} .tl-reparto-cab{display:flex;justify-content:space-between; font-family:var(--f-ui);font-size:var(--t-xs);color:var(--dim); margin-bottom:var(--s-1)} .tl-pasa{color:var(--oro-texto)} .tl-reparto-barra{display:flex;gap:2px;height:10px; border-radius:var(--r-pildora);overflow:hidden} .tl-tramo{display:block;background:var(--line)} .tl-tramo:nth-child(odd){background:var(--dim)} /* El minuto de cada sección, junto a su número. */ /* Ancho mínimo para que «5 min» y «10 min» no dejen los títulos de dos secciones a distinta sangría. */ .tl-min{flex:0 0 auto;min-width:3.2rem;font-family:var(--f-ui); font-size:var(--t-xs);color:var(--oro-texto);white-space:nowrap; margin-left:var(--s-1)} @media (max-width:560px){ .tl-linea{flex-wrap:wrap} .tl-pasaje{flex:1 1 100%} .tl-linea .btn{width:100%;min-height:2.9rem} .tl-enfasis{flex:1 1 100%} .tl-hueco{display:none} .tl-blanco{flex:1 1 100%;text-align:center;margin-top:var(--s-1)} } /* ---- Clase en el teléfono --------------------------------------------- Medido en 393 px: la caja deja 359 por dentro y las cinco pestañas suman 645 con los nombres largos. Ni acortándolos caben —quedan en 443— así que la fila se desplaza de lado; el fallo era que NO SE VEÍA que hubiera más. Repartir el ancho tampoco servía: 359 entre cinco son 72 px por pestaña y «Discipulado» necesita más. */ @media (max-width:560px){ /* Un degradado al borde derecho: se ve que la fila continúa. */ .tl-pest{position:relative; -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 2rem),transparent 100%); mask-image:linear-gradient(to right,#000 calc(100% - 2rem),transparent 100%)} .tl-pest-b{padding-inline:var(--s-2);font-size:var(--t-sm)} /* La activa se lleva al principio con «scroll-margin», para que al abrir la vista se vea cuál está elegida aunque esté a la derecha. */ .tl-pest-b[data-on="1"]{scroll-margin-inline:var(--s-3)} /* Y la caja respira: el cuerpo con menos relleno lateral deja sitio al campo, que es lo que se escribe. */ .tl-cuerpo{padding:var(--s-3) var(--s-2)} .tl-sep{margin-inline:calc(var(--s-2) * -1)} .tl-ajustes{gap:var(--s-1)} .tl-pildora,.tl-enfasis{min-height:2.4rem} } /* ---- La preparación plegada ----------------------------------------- Medido en 393 px: la preparación ocupa 635 px de los 700 útiles, y seguía ocupándolos DESPUÉS de generar. Para leer la primera sección había que pasar por encima de todo lo que ya elegiste. Plegada queda en una línea con lo elegido y se abre tocándola. */ .tl-resumen{display:flex;align-items:center;gap:var(--s-2);width:100%; box-sizing:border-box;text-align:left;cursor:pointer; background:var(--void);border:1px solid var(--line); border-radius:var(--r-control);padding:var(--s-2) var(--s-3); margin-bottom:var(--s-3);min-height:3rem} .tl-resumen:hover{border-color:var(--borde-campo)} .tl-resumen-txt{flex:1;min-width:0;display:flex;flex-direction:column} .tl-resumen-1{font-family:var(--f-ui);font-size:var(--t-ui);color:var(--vellum); white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .tl-resumen-2{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--dim); white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .tl-resumen-v{flex:0 0 auto;font-size:var(--t-lead);line-height:1;color:var(--dim)} @media (max-width:560px){ /* El botón a lo ancho y con altura de dedo: 44 px es el mínimo cómodo. */ .tl-linea .btn{min-height:2.75rem} /* El énfasis y los ajustes, cada uno en su línea: apretados en una fila no se acierta ninguno. */ .tl-ajustes{gap:var(--s-15)} .tl-pildora{flex:1 1 calc(50% - var(--s-15))} .tl-pildora select{width:100%} .tl-blanco{flex:1 1 100%;text-align:center} /* Las secciones más compactas: el minuto y el título en una línea. */ .tl-sec .secbar{flex-wrap:nowrap;gap:var(--s-1)} .tl-sec .ed-h3{font-size:var(--t-ui)} } /* ---- Clase en el teléfono, cinco correcciones medidas ---------------- Medido en la captura (590 px de imagen, pantalla Retina): el símbolo solo en una línea, el campo sin aspecto de campo, el botón en 77 px cuando lo cómodo son 44, «Guía» cortada por el degradado, y «Capturas» empezando fuera de pantalla. */ @media (max-width:560px){ /* 2 · El campo PARECE un campo. Sin borde se leía como un título; en escritorio el botón al lado da contexto, aquí no. */ .tl-pasaje{box-sizing:border-box;width:100%; border:1px solid var(--borde-campo);border-radius:var(--r-control); padding:0 var(--s-2);min-height:2.75rem;height:2.75rem; font-size:var(--t-ui)} /* 3 · El botón, a la altura cómoda y no más: 77 px se llevaban el peso visual de la caja entera. */ .tl-linea .btn{min-height:2.75rem;height:2.75rem;padding-block:0} /* 4 · El degradado avisaba de que hay más pestañas, pero cortaba la palabra por la mitad. Un filete al borde dice lo mismo sin comerse el texto, y las pestañas se aprietan para que quepa una más. */ .tl-pest{-webkit-mask-image:none;mask-image:none; border-right:0;box-shadow:inset -12px 0 10px -12px var(--ink)} .tl-pest-b{padding-inline:var(--s-15);font-size:var(--t-sm)} /* 5 · Y la caja ocupa menos, para que lo siguiente asome en pantalla. */ .tl-cuerpo{padding:var(--s-2)} .tl-sep{margin:var(--s-15) calc(var(--s-2) * -1)} .tl-ajustes{gap:var(--s-1)} .tl-caja{margin-bottom:var(--s-2)} } /* ==================== EXPONER ======================================== Clase preparaba algo para decir en voz alta y sólo ofrecía exportarlo a un archivo. Pero lo que pasa después es que te pones de pie y hablas cuarenta y cinco minutos con el aparato en la mano. Fondo oscuro fijo, no del tema: se expone en salas en penumbra y una pantalla blanca a media cara deslumbra a quien habla y al que mira. */ .xp-wrap{position:fixed;inset:0;z-index:900;display:flex;flex-direction:column; background:#17170F;color:#EFEEEB;padding:var(--s-3) var(--s-4)} .xp-barra{display:flex;align-items:center;gap:var(--s-2); padding-bottom:var(--s-2);border-bottom:1px solid #2E2E2C} .xp-cuenta{font-family:var(--f-ui);font-size:var(--t-xs);color:#8A8880;white-space:nowrap} .xp-avance{flex:1;height:3px;background:#2E2E2C;border-radius:2px;overflow:hidden} .xp-avance span{display:block;height:100%;background:#EFEEEB;transition:width .2s} /* El desvío frente a lo previsto: lo que nadie sabe mientras habla. */ .xp-desvio{font-family:var(--f-ui);font-size:var(--t-xs);color:#C8A03C;white-space:nowrap} .xp-reloj{background:none;border:0;cursor:pointer;padding:0 var(--s-1); font-family:var(--f-ui);font-size:var(--t-lead);color:#EFEEEB; font-variant-numeric:tabular-nums} /* La salida medía 26 px y en gris apagado: de pie y con el aparato en la mano no se acierta, y era la única forma de cerrar. Ahora tiene área táctil completa y un contorno que la hace visible. */ .xp-salir{display:flex;align-items:center;justify-content:center; flex:0 0 auto;width:2.5rem;height:2.5rem;cursor:pointer; background:none;border:1px solid #3E3E3A;border-radius:var(--r-control); font-size:var(--t-h3);line-height:1;color:#C9C7C0} .xp-salir:hover{background:#232320;color:#EFEEEB} .xp-cuerpo{flex:1;display:grid;grid-template-columns:1.6fr 1fr;gap:var(--s-5); margin-top:var(--s-4);overflow-y:auto} .xp-meta{font-family:var(--f-ui);font-size:var(--t-xs);color:#8A8880} .xp-tit{margin:var(--s-1) 0 0;font-family:var(--f-ui);font-size:var(--t-h2); font-weight:500;line-height:1.3;color:#EFEEEB} /* Letra grande: se lee a un brazo de distancia, de pie. */ .xp-txt{margin:var(--s-3) 0 0;font-family:var(--f-read);font-size:var(--t-h3); line-height:1.8;color:#C9C7C0} .xp-verso{margin:var(--s-3) 0 0;padding-left:var(--s-2); border-left:2px solid #3E3E3A;font-family:var(--f-read);font-size:var(--t-lead); line-height:1.7;color:#A8A69E} .xp-verso-ref{display:block;font-family:var(--f-ui);font-size:var(--t-xs); letter-spacing:.04em;color:#8A8880;margin-bottom:2px;text-transform:uppercase} .xp-puntos{margin:var(--s-3) 0 0;padding-left:var(--s-3); font-family:var(--f-read);font-size:var(--t-lead);line-height:1.8;color:#C9C7C0} /* La columna de la derecha: SÓLO PARA QUIEN HABLA. Al proyectar desaparece, porque «contar lo del abuelo de Marta» no debe verse en la pared. */ .xp-lado{border-left:1px solid #2E2E2C;padding-left:var(--s-4); display:flex;flex-direction:column} .xp-lado-et{font-family:var(--f-ui);font-size:var(--t-xs);letter-spacing:.04em; color:#8A8880;margin-bottom:var(--s-2)} .xp-nota{padding:var(--s-2);background:#232320;border-radius:var(--r-control); font-family:var(--f-ui);font-size:var(--t-ui);line-height:1.6;color:#C9C7C0} .xp-nota-et{font-family:var(--f-ui);font-size:var(--t-xs);letter-spacing:.04em; color:#8A8880;margin-bottom:2px} .xp-sig{margin-top:var(--s-3);opacity:.6} .xp-sig-tit{font-family:var(--f-ui);font-size:var(--t-ui);color:#A8A69E;line-height:1.4} .xp-sig-min{font-family:var(--f-ui);font-size:var(--t-xs);color:#8A8880} /* Botones grandes: se aciertan sin mirar, con la mano ocupada. */ .xp-botones{display:flex;gap:var(--s-2);margin-top:auto;padding-top:var(--s-3)} .xp-atras,.xp-sig-b{min-height:3rem;border-radius:var(--r-control);cursor:pointer; font-family:var(--f-ui);font-size:var(--t-ui)} .xp-atras{flex:0 0 34%;background:none;border:1px solid #3E3E3A;color:#A8A69E} .xp-sig-b{flex:1;background:#EFEEEB;border:0;color:#17170F} .xp-atras:disabled,.xp-sig-b:disabled{opacity:.35;cursor:not-allowed} .xp-proyectar{margin-top:var(--s-2);background:none;border:0;cursor:pointer; padding:var(--s-1) 0;text-align:left; font-family:var(--f-ui);font-size:var(--t-xs);color:#8A8880} /* Proyectando: fuera la columna, y el texto ocupa todo. */ .xp-wrap[data-limpio="1"] .xp-lado{display:none} .xp-wrap[data-limpio="1"] .xp-cuerpo{grid-template-columns:1fr} .xp-wrap[data-limpio="1"] .xp-txt{font-size:var(--t-h2)} /* En el TELÉFONO no hay columna: allí no mira nadie más, y el ancho no da. La nota y los botones van debajo del texto. */ @media (max-width:760px){ .xp-wrap{padding:var(--s-2) var(--s-3)} .xp-cuerpo{grid-template-columns:1fr;gap:var(--s-3)} .xp-lado{border-left:0;padding-left:0} .xp-lado-et{display:none} .xp-tit{font-size:var(--t-h3)} .xp-txt{font-size:var(--t-lead)} .xp-botones{padding-top:var(--s-2)} .xp-atras,.xp-sig-b{min-height:3.25rem} .xp-desvio{display:none} } /* El botón que abre todo esto. */ .tl-exponer{display:flex;align-items:center;justify-content:center;gap:var(--s-1); width:100%;box-sizing:border-box;min-height:3rem;cursor:pointer; background:var(--vellum);border:0;border-radius:var(--r-control); color:var(--void);font-family:var(--f-ui);font-size:var(--t-ui); margin-bottom:var(--s-3)} /* Y una salida más, al pie de la columna: al terminar la última sección se quiere cerrar, y buscar la × arriba obliga a cruzar la pantalla. */ .xp-terminar{width:100%;box-sizing:border-box;min-height:2.6rem;cursor:pointer; margin-top:var(--s-2);background:none;border:1px solid #3E3E3A; border-radius:var(--r-control);color:#A8A69E; font-family:var(--f-ui);font-size:var(--t-sm)} .xp-terminar:hover{color:#EFEEEB} /* ==================== EL RECORRIDO Y LAS CLASES ====================== Clase no guardaba nada: preparabas, dabas la clase, cerrabas, y se perdía. Guardarlas no es sólo poder recuperarlas —el mismo estudio en otro grupo, una serie que sigue el domingo— sino que el conjunto dice por dónde has llevado al grupo, y eso no lo sabe nadie más. */ /* Las secciones sin ninguna clase, apenas marcadas: son el hueco. */ /* Las tarjetas, tres columnas en escritorio y apiladas en el teléfono. */ .tl-guardadas{margin:var(--s-5) 0 var(--s-4)} /* Con el mismo peso que «Tus escenas» y «Tus estudios». Iba en «--t-ui», 0,875 rem, contra los 1,28 de las otras dos: el mismo rótulo se leía como una nota al pie en una vista y como un título en las otras. */ .tl-guard-cab{margin:0 0 var(--s-3);font-family:var(--f-disp); font-size:var(--t-h3);font-weight:600;letter-spacing:-.018em;color:var(--vellum)} .tl-guard-rejilla{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s-2)} .tl-tarjeta{box-sizing:border-box;background:var(--void); border:1px solid var(--line);border-radius:var(--r-tarjeta);padding:var(--s-3)} .tl-tar-fecha{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--dim)} .tl-tar-tit{font-family:var(--f-ui);font-size:var(--t-ui);color:var(--vellum); line-height:1.35;margin-top:var(--s-05)} .tl-tar-sub{font-family:var(--f-ui);font-size:var(--t-xs);color:var(--dim); margin-top:2px} /* El reparto en miniatura: la misma barra del modo exponer, a 5 px. De un vistazo se ve la forma de cada clase. */ .tl-tar-barra{display:flex;gap:2px;height:5px;margin-top:var(--s-2); border-radius:var(--r-pildora);overflow:hidden} .tl-tar-barra span{display:block;background:var(--line)} .tl-tar-barra span:nth-child(odd){background:var(--dim)} .tl-tar-acc{display:flex;gap:var(--s-1);align-items:center;margin-top:var(--s-2)} .tl-tar-b{background:none;border:1px solid var(--line);border-radius:var(--r-pildora); padding:var(--s-05) var(--s-2);cursor:pointer; font-family:var(--f-ui);font-size:var(--t-xs);color:var(--dim)} .tl-tar-b[data-on="1"]{border-color:var(--borde-campo);color:var(--vellum)} .tl-tar-b:hover{color:var(--vellum)} .tl-tar-hueco{flex:1} .tl-tar-x{background:none;border:0;cursor:pointer;padding:0 var(--s-1); font-size:var(--t-lead);line-height:1;color:var(--dim)} .tl-tar-x:hover{color:var(--vellum)} @media (max-width:760px){ .tl-guard-rejilla{grid-template-columns:1fr} /* Diez secciones no caben con etiqueta: la barra habla sola. */ } /* ---- El versículo dentro de la caja de Clase ------------------------- Se aprobó en el diseño y no llegó a construirse: la caja tenía el pasaje y los ajustes, pero no lo que ese pasaje dice. Cita con filete, como en Estudio: llega de tu biblia y no se escribe en él, así que no debe parecer un campo. */ .tl-cita{margin:var(--s-2) 0 0;padding:0 0 0 var(--s-2); border-left:2px solid var(--line)} .tl-cita-txt{display:block;font-family:var(--f-read);font-size:var(--t-ui); line-height:1.7;color:var(--dim)} .tl-cita-de{display:block;margin-top:3px; font-family:var(--f-ui);font-size:var(--t-xs);color:var(--dim)} @media (max-width:560px){ .tl-cita-txt{font-size:var(--t-sm)} } /* ---- Clase: el orden aprobado en cada tamaño ------------------------- En ESCRITORIO manda la fila de pestañas y «Preparar» va junto al pasaje. En el TELÉFONO las cinco pestañas no caben —645 px en 359 medidos— así que el tipo pasa a un selector al lado del campo, y «Preparar» baja a compartir la última fila con «Empezar en blanco». El marcado lleva las dos versiones y cada tamaño oculta la que no usa: así el orden de lectura es el correcto en ambos. */ .tl-tipo-sel{display:none} @media (max-width:560px){ /* Fuera las pestañas: no caben, y el selector dice lo mismo con los nombres completos. */ .tl-pest{display:none} /* Fila 1: el pasaje y el tipo. */ .tl-linea{flex-wrap:wrap;gap:var(--s-15)} .tl-pasaje{flex:1 1 100%} /* ALTO EXPLÍCITO, no «min-height». Safari IGNORA min-height en un