/* Two24 · La Palabra, juntos — tema basado en Hope UI (vendor/hope-ui, MIT).
   Hope UI aporta la base (Bootstrap 5, menú lateral, barra superior, tipografía Inter).
   Aquí se adaptan los componentes propios de la app a sus mismos colores, radios y sombras. */
:root{
 --ink:#232d42;--text:#4a5468;--muted:#7d869a;--line:#eceef4;--bg:#f5f6fa;
 --primary:#3a57e8;--primary-rgb:58,87,232;--primary-soft:rgba(58,87,232,.09);--primary-soft2:rgba(58,87,232,.16);
 --success:#1aa053;--info:#079aa2;--warning:#f16a1b;--danger:#c03221;--gold:#b7791f;
 --two24:#d6336c;--two24-soft:rgba(214,51,108,.1);
 --radius:.5rem;--radius-sm:.25rem;--shadow:0 10px 30px 0 rgba(17,38,146,.05);
 --serif:Georgia,'Times New Roman',serif;
}
body{background:var(--bg);color:var(--text);font-family:var(--bs-font-sans-serif);font-size:1rem;line-height:1.6}
h1,h2,h3,h4{color:var(--ink);font-weight:600;letter-spacing:-.01em}
h1{font-size:1.75rem}h2{font-size:1.35rem}h3{font-size:1.1rem;margin-top:1.25rem}
a{color:var(--primary)}a:hover{color:#2e46ba}
.skip{position:absolute;left:-999px;top:0;z-index:2000;background:var(--card);padding:.5rem 1rem}.skip:focus{left:1rem}
:focus-visible{outline:3px solid rgba(var(--primary-rgb),.45);outline-offset:2px}
svg.bi{flex:none;vertical-align:-.15em}

/* ── Menú lateral (estructura de Hope UI) ── */
.sidebar .navbar-brand{display:flex;align-items:center;gap:.75rem;text-decoration:none}
.brand-mark{width:38px;height:38px;border-radius:var(--radius);background:var(--primary);color:#fff;display:grid;place-items:center;font:600 1.3rem var(--serif)}
.sidebar .logo-title{margin:0;color:var(--ink);font-size:1.25rem;line-height:1.1}
.sidebar .logo-title small{display:block;font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:500;margin-top:3px}
.sidebar .nav-link .icon{display:inline-flex}
.sidebar .nav-link,.sidebar .item-name{text-transform:none}
.sidebar .nav-link .icon svg{width:18px;height:18px}
.sidebar .static-item .default-icon{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.sidebar-couple{margin:1.5rem 1rem;padding:1rem;border-radius:var(--radius);background:var(--bg);display:flex;flex-wrap:wrap;gap:.4rem}
.sidebar-couple .who{padding:.2rem .7rem;border-radius:50rem;font-size:.85rem;font-weight:600}
.who.pa{background:var(--primary-soft);color:var(--primary)}
.who.two24{background:var(--two24-soft);color:var(--two24)}
.sidebar-couple small{flex-basis:100%;color:var(--muted);font-size:.78rem;margin-top:.25rem}

/* ── Barra superior ── */
.iq-navbar{background:var(--card);box-shadow:0 1px 0 var(--line);padding:.6rem 0;position:sticky;top:0;z-index:800}
.navbar-inner{display:flex;align-items:center;gap:1rem;flex-wrap:nowrap}
.menu-toggle{display:none;border:0;background:var(--primary-soft);color:var(--primary);border-radius:var(--radius-sm);padding:.45rem .55rem;line-height:0}
.page-crumb{font-weight:600;color:var(--ink);font-size:1.05rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}
.top-tools{display:flex;gap:.4rem;flex-wrap:nowrap}
.tool{display:inline-flex;align-items:center;gap:.4rem;border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:var(--radius-sm);padding:.4rem .7rem;font-size:.85rem;font-weight:500;cursor:pointer}
.tool:hover{border-color:rgba(var(--primary-rgb),.4);color:var(--primary)}
.tool[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:#fff}

/* ── Contenido ── */
#main.content-inner{margin-top:0 !important;padding:1.75rem 2rem 1rem;outline:none}
.footer{padding:1rem 2rem 1.5rem;color:var(--muted);font-size:.85rem}
.footer span{margin:0 .4rem}
.loading{padding:4rem;text-align:center;color:var(--muted)}
#status{position:fixed;left:50%;bottom:1.5rem;transform:translateX(-50%);z-index:1200;max-width:min(560px,calc(100vw - 2rem));background:var(--ink);color:#fff;border-radius:var(--radius);padding:.8rem 1.1rem;font-size:.92rem;box-shadow:0 10px 30px rgba(0,0,0,.2)}
#status:empty{display:none}

/* Cabecera de página: banda de color como el encabezado de Hope UI */
.page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;background:linear-gradient(120deg,#3a57e8 0%,#5b73f0 60%,#7a8ff3 100%);color:#fff;border-radius:var(--radius);padding:1.6rem 1.9rem;margin-bottom:1.5rem;box-shadow:var(--shadow)}
.page-header h1{color:#fff;margin:0 0 .35rem;font-size:1.65rem}
.page-header p{margin:0;opacity:.92;max-width:62ch}
.page-header .pill{background:rgba(255,255,255,.18);color:#fff;border-color:transparent;white-space:nowrap}

/* Tarjetas (equivalente a .card de Hope UI) */
.paper,.side-card,.rail{background:var(--card);border:0;border-radius:var(--radius);box-shadow:var(--shadow);padding:1.5rem;margin-bottom:1.5rem;min-width:0}
.paper-head{margin:-1.5rem -1.5rem 1.25rem;padding:1.25rem 1.5rem;border-bottom:1px solid var(--line)}
.paper-head h2{margin:.15rem 0 .25rem;font-size:1.5rem}
.paper-head p{margin:0 0 .75rem}
.eyebrow{font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--primary);margin-bottom:.35rem}
.meta{color:var(--muted);font-size:.875rem}
.plain-lead{font-size:1.1rem;line-height:1.75;color:var(--ink)}
p.en,.en{color:var(--muted);font-style:italic;border-left:3px solid var(--line);padding-left:.8rem;margin-top:-.35rem}
.spacer{margin-top:1.5rem}
.pill{display:inline-block;padding:.3rem .8rem;border-radius:50rem;font-size:.8rem;font-weight:500;background:var(--primary-soft);color:var(--primary)}
.callout{background:rgba(var(--primary-rgb),.045);border-left:4px solid var(--primary);border-radius:var(--radius-sm);padding:1rem 1.2rem;margin:1.1rem 0}
.callout strong{color:var(--ink)}
.callout p:last-child{margin-bottom:0}
.empty{text-align:center;padding:3rem 1.5rem}

/* Botones: primario sólido; el resto «suave» como los botones de Hope UI */
#main button,#term-panel button{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border:1px solid transparent;background:var(--primary-soft);color:var(--primary);border-radius:var(--radius-sm);padding:.5rem 1rem;font:500 .92rem/1.35 var(--bs-font-sans-serif);cursor:pointer;transition:background .15s,color .15s,border-color .15s}
#main button:hover,#term-panel button:hover{background:var(--primary-soft2)}
#main button.primary,#term-panel button.primary,#main button[aria-pressed="true"],#term-panel button[aria-pressed="true"]{background:var(--primary);color:#fff}
#main button.primary:hover,#term-panel button.primary:hover{background:#314ac5}
#main button:disabled{opacity:.45;cursor:not-allowed}
.btn-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:.75rem 0}
.toolbar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.toolbar .meta{margin-left:auto}

/* Pestañas (nav-pills de Hope UI) */
.tabs{display:inline-flex;flex-wrap:wrap;gap:.25rem;background:var(--bg);padding:.3rem;border-radius:var(--radius);margin-bottom:1.25rem}
#main .tabs button{background:transparent;color:var(--text)}
#main .tabs button[aria-pressed="true"]{background:var(--primary);color:#fff;box-shadow:0 4px 12px rgba(var(--primary-rgb),.25)}
#main .tabs button[aria-pressed="true"] .meta{color:rgba(255,255,255,.8)}

/* ── Leer juntos: guías ── */
.workspace{display:grid;grid-template-columns:250px minmax(0,1fr) 320px;gap:1.5rem;align-items:start}
.rail h2{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--primary);margin:0 0 .75rem}
#main .guide-link{display:flex;flex-direction:column;align-items:flex-start;width:100%;text-align:left;background:transparent;color:var(--ink);border-left:3px solid transparent;border-radius:0 var(--radius-sm) var(--radius-sm) 0;padding:.55rem .75rem;margin-bottom:.15rem}
#main .guide-link small{color:var(--muted);font-weight:400}
#main .guide-link:hover{background:var(--bg)}
#main .guide-link.selected{background:var(--primary-soft);border-left-color:var(--primary);color:var(--primary)}
.rail-bottom{border-top:1px solid var(--line);margin-top:1rem;padding-top:1rem;font-size:.875rem;color:var(--muted)}
.progress-note{margin:.5rem 0;font-weight:600;color:var(--ink)}
.aside .side-card p{font-size:.95rem}
.side-card h3{margin-top:.75rem}
.side-card.featured{background:linear-gradient(140deg,#001f4d,#233a8c);color:#dfe5ff}
.side-card.featured .eyebrow{color:#9fb1ff}.side-card.featured .meta{color:#b8c3f0}
.side-card.featured a{color:#fff}
.side-card.featured p.en{color:#b8c3f0;border-left-color:rgba(255,255,255,.2)}
.greek{font:2rem var(--serif);color:#fff;margin:.25rem 0}
.chapter-nav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem;border-top:1px solid var(--line);padding-top:1rem;margin-top:1rem}
.reading-guide{margin-top:1.75rem}
.church{border:1px solid var(--line);border-left:4px solid var(--primary);border-radius:var(--radius-sm);padding:1.1rem 1.25rem;margin:1rem 0}
.church h3{margin-top:.25rem}
.church.trad-catholic{border-left-color:#c03221}.church.trad-catholic .eyebrow{color:#c03221}
.church.trad-orthodox{border-left-color:#b7791f}.church.trad-orthodox .eyebrow{color:#9a6512}
.church.trad-both{border-left-color:var(--success)}.church.trad-both .eyebrow{color:var(--success)}
.church.trad-latin{border-left-color:var(--info)}.church.trad-latin .eyebrow{color:var(--info)}
.source-link{font-weight:600;text-decoration:none}
.source-link+.meta{margin-top:.2rem}

/* ── Texto bíblico ── */
.scripture{margin-top:.25rem}
.edition{font-size:.8rem;color:var(--muted);padding-bottom:.75rem;margin-bottom:1rem;border-bottom:1px dashed var(--line)}
.verse{display:grid;grid-template-columns:2rem minmax(0,1fr);gap:.5rem;font:1.2rem/1.85 var(--serif);color:var(--ink);padding:.2rem .5rem;margin:0 -.5rem .35rem;border-radius:var(--radius-sm)}
.verse.paired{grid-template-columns:2rem minmax(0,1fr) minmax(0,1fr);gap:1.25rem}
.verse .number{font:600 .75rem var(--bs-font-sans-serif);color:var(--primary);padding-top:.55rem;text-align:right}
.verse .english{color:#5f6b82;font-size:1.05rem;border-left:1px solid var(--line);padding-left:1rem}
.verse.highlight{background:var(--hl);box-shadow:inset 3px 0 0 var(--warning)}
.scripture.large .verse{font-size:1.5rem}.scripture.large .verse .english{font-size:1.3rem}
.verse .term{font:inherit;color:inherit;background:none !important;border:0 !important;padding:.42em .12em !important;margin:-.42em -.12em !important;display:inline !important;text-decoration:underline dotted rgba(var(--primary-rgb),.7);text-decoration-thickness:2px;text-underline-offset:5px;border-radius:2px !important}
.verse .term:hover,.verse .term:focus-visible{background:var(--primary-soft) !important;color:var(--primary)}

/* ── Registro de lectura: la pareja ── */
.log-card{background:linear-gradient(90deg,rgba(var(--primary-rgb),.05),var(--two24-soft));border-radius:var(--radius);padding:1.1rem 1.25rem;margin:1.5rem 0 .5rem}
.log-card p{margin:0 0 .6rem}
#main .reader-btn{font-size:1rem;padding:.6rem 1.3rem;border-radius:50rem;background:var(--card);border:1px solid var(--line);color:var(--ink)}
#main .reader-btn[data-logreader="two24"]{color:var(--two24)}
#main .reader-btn[data-logreader="pa"]{color:var(--primary)}
#main .reader-btn.your-turn{border:2px solid currentColor}
#main .reader-btn[aria-pressed="true"][data-logreader="pa"]{background:var(--primary);color:#fff;border-color:var(--primary)}
#main .reader-btn[aria-pressed="true"][data-logreader="two24"]{background:var(--two24);color:#fff;border-color:var(--two24)}
.note-jump{font-size:.875rem;margin-left:.25rem}
.log-summary .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin:1rem 0 1.25rem}
.stat{border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.2rem;display:flex;flex-direction:column}
.stat strong{font-size:2rem;line-height:1.1;color:var(--primary);font-weight:700}
.stat:nth-child(2) strong{color:var(--two24)}
.stat:nth-child(3) strong{color:var(--success)}
.stat span{color:var(--muted);font-size:.9rem}
.book-progress{display:grid;grid-template-columns:minmax(90px,170px) minmax(0,1fr) auto;gap:.75rem;align-items:center;margin:.5rem 0}
.book-progress progress{width:100%;height:.5rem;appearance:none;border:0;border-radius:50rem;background:var(--line);overflow:hidden;accent-color:var(--primary)}
.book-progress progress::-webkit-progress-bar{background:var(--line)}
.book-progress progress::-webkit-progress-value{background:var(--primary);border-radius:50rem}
.book-progress progress::-moz-progress-bar{background:var(--primary)}
.log-list{list-style:none;padding:0;margin:0}
.log-list li{position:relative;padding:.75rem 2.5rem .75rem 0;border-bottom:1px solid var(--line)}
.log-list li:last-child{border-bottom:0}
#main .linklike{background:none;border:0;padding:0;color:var(--primary);text-decoration:underline;font-weight:500}
#main .linklike.del{position:absolute;right:.25rem;top:.75rem;text-decoration:none;color:var(--muted);padding:.1rem .4rem}
#main .linklike.del:hover{color:var(--danger);background:rgba(192,50,33,.08)}

/* ── Cuaderno ── */
.notebook{margin-top:1.25rem;border-top:1px solid var(--line);padding-top:1.25rem}
.notebook textarea{width:100%;min-height:150px;border:1px solid #e3e6ee;border-radius:var(--radius-sm);padding:.8rem 1rem;font:1rem/1.6 var(--bs-font-sans-serif);color:var(--ink);background:var(--card);resize:vertical;margin:.5rem 0}
.notebook textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 .2rem rgba(var(--primary-rgb),.15)}
.saved{color:var(--success);font-size:.875rem}
.notes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}
.note pre{white-space:pre-wrap;font:1rem/1.6 var(--bs-font-sans-serif);color:var(--ink);background:none;border:0;padding:0;margin:.5rem 0}

/* ── Explorar ── */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.5rem}
.grid .paper{margin-bottom:0;display:flex;flex-direction:column}
.grid .paper button{margin-top:auto;align-self:flex-start}
.study h3{margin:.25rem 0}
.reader-controls{display:flex;flex-wrap:wrap;gap:.75rem;align-items:flex-end;margin:1rem 0}
.reader-controls label{display:flex;flex-direction:column;gap:.3rem;font-size:.85rem;font-weight:500;color:var(--ink);min-width:0;max-width:100%}
.reader-controls select,input.search{border:1px solid #e3e6ee;border-radius:var(--radius-sm);padding:.5rem .75rem;font:1rem var(--bs-font-sans-serif);color:var(--ink);background:var(--card);max-width:100%}
input.search{flex:1;min-width:0}
.reader-controls select:focus,input.search:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 .2rem rgba(var(--primary-rgb),.15)}
#search-form .btn-row{flex-wrap:nowrap}
.results{margin-top:.5rem}
#main .result{display:block;width:100%;text-align:left;background:var(--card);color:var(--text);border-bottom:1px solid var(--line);border-radius:0;padding:.75rem .5rem;font-weight:400}
#main .result:hover{background:var(--bg)}
#main .result strong{display:block;color:var(--primary);font-weight:600;margin-bottom:.15rem}
.full-reader>.primary{margin-bottom:1rem}

/* Fichas de personas, lugares y palabras */
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}
#main .chip,#term-panel .chip{flex-direction:column;align-items:flex-start;gap:0;background:var(--card);border:1px solid var(--line);color:var(--ink);border-radius:var(--radius);padding:.45rem .8rem;font-weight:500}
#main .chip small,#term-panel .chip small{font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--primary);font-weight:600}
#main .chip:hover,#term-panel .chip:hover{border-color:rgba(var(--primary-rgb),.4);background:var(--card);box-shadow:var(--shadow)}
#main .chip.kind-persona small{color:var(--info)}
#main .chip.kind-lugar small{color:var(--success)}
#main .chip.kind-grupo small{color:var(--warning)}
#main .chip.kind-palabra small{color:var(--primary)}

/* Panel lateral (como el offcanvas de Hope UI) */
#term-panel{position:fixed;inset:0;z-index:1100;background:rgba(0,31,77,.35);display:flex;justify-content:flex-end}
#term-panel[hidden]{display:none}
.term-sheet{background:var(--card);width:min(500px,100%);height:100%;overflow-y:auto;padding:1.5rem 1.75rem;box-shadow:-10px 0 30px rgba(17,38,146,.12)}
.term-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;border-bottom:1px solid var(--line);margin:-1.5rem -1.75rem 1.25rem;padding:1.25rem 1.75rem}
.term-head h2{margin:.2rem 0 0;font-size:1.5rem}
.term-head p{margin:0}
#term-panel .close{background:var(--bg);color:var(--text);padding:.4rem .65rem;font-size:1rem}
.facts{list-style:none;padding:0;margin:0}
.facts li{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.8rem 1rem;margin:0 0 .75rem}
.facts li p{margin:.4rem 0}
.facts .btn-row{margin:.4rem 0 0;font-size:.875rem}
.badge{display:inline-block;font-size:.68rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:.3em .65em;border-radius:var(--radius-sm);background:rgba(26,160,83,.1);color:#137a3f}
.badge.ev-arqueologia{background:rgba(241,106,27,.12);color:#b44d10}
.badge.ev-historia{background:rgba(111,66,193,.1);color:#5a37a0}
.badge.ev-lexico{background:rgba(7,154,162,.1);color:#067a80}
.badge.ev-iglesia{background:rgba(var(--primary-rgb),.1);color:var(--primary)}
.badge.ev-debate{background:rgba(192,50,33,.1);color:#a02a1b}
body.sheet-open,body.menu-open{overflow:hidden}

/* ── Aprender ── */
.maps{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;margin-bottom:1.5rem}
.map{margin:0;background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:1rem}
.map svg{width:100%;height:auto;display:block;background:var(--map-bg);border-radius:var(--radius-sm)}
.map .land{fill:#f7f3ea;stroke:#d8cfb8;stroke-width:1}
.map .water{fill:#bcd3e6;stroke:#94b4cf}
.map .river{fill:none;stroke:#86a9c7;stroke-width:3}
.map .sea{fill:#6a86a3;font:italic 20px var(--serif)}
.map-pt circle{fill:#8a92a6}
.map-pt text{font:600 21px var(--bs-font-sans-serif);fill:var(--ink);paint-order:stroke;stroke:var(--card);stroke-width:4px}
.map-pt.linked{cursor:pointer}
.map-pt.linked circle{fill:var(--primary);stroke:#fff;stroke-width:3}
.map-pt.linked:hover circle,.map-pt.linked:focus circle{fill:var(--warning)}
.map-pt.linked:focus{outline:none}
.map figcaption{font-size:.85rem;color:var(--muted);margin-top:.6rem}
.story{list-style:none;padding:0;margin:0;position:relative}
.story>li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:1rem}
.step-num{width:42px;height:42px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;font-weight:700;font-size:1.05rem;box-shadow:0 0 0 6px var(--primary-soft)}
.story h2{margin-top:.35rem}
.genre ul.how{padding-left:1.1rem}.genre ul.how li{margin-bottom:.6rem}

/* ── Fuentes ── */
.source-section .paper h2{margin-top:0}

/* ── Adaptación a pantallas ── */
@media (max-width:1399.98px){
 .workspace{grid-template-columns:minmax(0,1fr) 300px}
 .rail{grid-column:1/-1;display:flex;flex-wrap:nowrap;gap:.4rem;align-items:stretch;overflow-x:auto;padding:1rem;scrollbar-width:thin}
 .rail h2{display:none}
 #main .rail .guide-link{flex:0 0 auto;width:auto;border-left:0;border-radius:var(--radius-sm);border:1px solid var(--line);margin:0}
 #main .rail .guide-link.selected{border-color:var(--primary)}
 .rail-bottom{flex:0 0 auto;border:0;margin:0;padding:0 .5rem;display:flex;align-items:center;gap:.75rem;white-space:nowrap;font-size:0}
 .rail-bottom .progress-note{font-size:.8rem;margin:0}
 #main .rail-bottom button{margin:0}
}
@media (max-width:1199.98px){
 .menu-toggle{display:inline-flex}
 .sidebar{box-shadow:0 0 40px rgba(0,31,77,.25)}
}
@media (max-width:991.98px){
 .workspace{grid-template-columns:minmax(0,1fr)}
 .top-tools .tool span{display:none}
 .top-tools .tool{padding:.45rem .55rem}
 .verse.paired{grid-template-columns:2rem minmax(0,1fr)}
 .verse.paired .english{grid-column:2;border-left:0;padding-left:0;border-top:1px dashed var(--line);padding-top:.25rem;margin-bottom:.5rem}
}
@media (max-width:767.98px){
 #main.content-inner{padding:1rem 1rem .5rem}
 .page-header{padding:1.2rem 1.25rem;flex-direction:column}
 .page-header h1{font-size:1.35rem}
 .paper,.side-card,.rail{padding:1.15rem}
 .paper-head{margin:-1.15rem -1.15rem 1rem;padding:1rem 1.15rem}
 .verse{font-size:1.12rem;grid-template-columns:1.6rem minmax(0,1fr)}
 .scripture.large .verse{font-size:1.35rem}
 .story>li{grid-template-columns:1fr}
 .term-sheet{padding:1.25rem 1.1rem}
 .term-head{margin:-1.25rem -1.1rem 1rem;padding:1rem 1.1rem}
 #term-panel{align-items:flex-end}
 .term-sheet{height:auto;max-height:90vh;border-radius:1rem 1rem 0 0}
 .book-progress{grid-template-columns:minmax(80px,120px) minmax(0,1fr) auto}
 .toolbar .meta{margin-left:0;flex-basis:100%}
 .footer{padding:1rem}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important}}
@media print{.sidebar,.iq-navbar,.toolbar,.chapter-nav,.log-card,.footer,#term-panel{display:none !important}.sidebar+.main-content{margin-left:0}.paper{box-shadow:none}}
/* Pestañas de Aprender: control segmentado uniforme */
.learn-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;background:var(--card);box-shadow:var(--shadow)}
#main .learn-tabs button{flex-direction:column;gap:0;padding:.6rem .5rem;line-height:1.25}
#main .learn-tabs button .meta{font-size:.72rem;font-style:normal}
@media (max-width:767.98px){#main .learn-tabs button .meta{display:none}#main .learn-tabs button{font-size:.82rem;padding:.55rem .3rem}.reading-guide .tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}#main .reading-guide .tabs button{font-size:.82rem;padding:.5rem .3rem}}

/* ── Apariencia: brillo del modo claro y modo oscuro ──
   El brillo lo ajusta app.js cambiando --card, --bg, --card2 y --line. */
:root{--card:#fff;--card2:#f8f9fc;--map-bg:#e7eef5;--hl:#fff7e8;--sidebar-bg:var(--card)}
.sidebar{background-color:var(--sidebar-bg) !important}
.sidebar .sidebar-header{border-color:var(--line) !important}
.sidebar .nav-link:not(.active){color:var(--text)}
.sidebar-couple,.tabs{background:var(--card2)}
html[data-theme="dark"]{
 --ink:#e9ecf5;--text:#c5cbd8;--muted:#8e97aa;--line:#2b3346;--bg:#10141f;--card:#1a1f2d;--card2:#222939;
 --primary:#7189ff;--primary-rgb:113,137,255;--primary-soft:rgba(113,137,255,.14);--primary-soft2:rgba(113,137,255,.24);
 --two24:#ff7aa8;--two24-soft:rgba(255,122,168,.14);--success:#3cc47a;--info:#2ec4cc;--warning:#ff9a4d;
 --map-bg:#1d2a3a;--hl:#3a321d;--shadow:0 10px 30px rgba(0,0,0,.35);--bs-body-bg:#10141f;color-scheme:dark}
html[data-theme="dark"] body{background:var(--bg)}
html[data-theme="dark"] .iq-navbar{box-shadow:0 1px 0 var(--line)}
html[data-theme="dark"] .page-header{background:linear-gradient(120deg,#2c3f9e 0%,#3a4fbf 60%,#4b5fcc 100%)}
html[data-theme="dark"] .verse .english{color:#a9b2c6}
html[data-theme="dark"] .map .land{fill:#26303f;stroke:#3a4659}
html[data-theme="dark"] .map .water{fill:#2c4a66;stroke:#3d6386}
html[data-theme="dark"] .map .sea{fill:#7f9bb8}
html[data-theme="dark"] .church.trad-catholic .eyebrow{color:#ff8a7a}
html[data-theme="dark"] .church.trad-orthodox .eyebrow{color:#e8b25c}
html[data-theme="dark"] .notebook textarea,html[data-theme="dark"] .reader-controls select,html[data-theme="dark"] input.search{background:var(--card2);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] #status{background:#e9ecf5;color:#10141f}
html[data-theme="dark"] #term-panel{background:rgba(0,0,0,.55)}
html[data-theme="dark"] .log-card{background:linear-gradient(90deg,rgba(113,137,255,.08),rgba(255,122,168,.1))}
html[data-theme="dark"] .badge{filter:brightness(1.35)}

/* Menú de apariencia */
.appearance{position:relative}
.appearance-panel{position:absolute;right:0;top:calc(100% + .5rem);width:280px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 14px 40px rgba(17,38,146,.18);padding:1rem;z-index:1000}
.appearance-panel[hidden]{display:none}
.appearance-panel h4{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 .5rem}
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:.25rem;background:var(--card2);padding:.25rem;border-radius:var(--radius-sm);margin-bottom:1rem}
.seg button{border:0;background:transparent;color:var(--text);border-radius:var(--radius-sm);padding:.45rem .25rem;font-size:.82rem;display:flex;flex-direction:column;align-items:center;gap:.15rem;cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--primary);color:#fff}
.appearance-panel input[type=range]{width:100%;accent-color:var(--primary)}
.appearance-panel .meta{font-size:.78rem;margin:.35rem 0 0}

/* ── Ir a un pasaje (como BibleSearch) ── */
.page-header{align-items:center;flex-wrap:wrap}
.page-header>div:first-child{flex:1 1 260px}
.greeting{font-size:.85rem;font-weight:500;opacity:.95;margin-bottom:.25rem}
html[data-theme="dark"] .sidebar .navbar-brand .logo-title,html[data-theme="dark"] .sidebar .logo-title{color:var(--ink) !important}
html[data-theme="dark"] .sidebar .static-item,html[data-theme="dark"] .sidebar .static-item .default-icon{color:var(--muted) !important;opacity:1}
html[data-theme="dark"] .sidebar .nav-link:not(.active):hover{color:var(--ink)}
@media (max-width:767.98px){
 .page-header>div:first-child{flex:none;width:100%;max-width:none}
 .page-header p{max-width:none}
 .page-crumb{display:none}
 .navbar-inner{justify-content:space-between;gap:.5rem}
 .top-tools{gap:.3rem}
 .top-tools .tool{padding:.4rem .5rem}
 .appearance-panel{position:fixed;left:1rem;right:1rem;top:4rem;width:auto}
}

/* ── Barra superior: Idioma · Traducción · Letra · Apariencia ── */
.iq-navbar{background:var(--card) !important;isolation:isolate}
.top-tools{align-items:center}
.lang-seg{display:inline-flex;align-items:center;gap:.15rem;background:var(--card2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:.2rem}
.tool-label{font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:0 .45rem 0 .35rem}
.lang-seg button{border:0;background:transparent;color:var(--text);border-radius:var(--radius-sm);padding:.35rem .7rem;font:500 .85rem var(--bs-font-sans-serif);cursor:pointer;white-space:nowrap}
.lang-seg button:hover{color:var(--primary)}
.lang-seg button[aria-pressed="true"]{background:var(--primary);color:#fff}
.lang-seg .short{display:none}
.tool strong{font-weight:600}
.tr-menu{position:relative}
.tr-panel{position:absolute;right:0;top:calc(100% + .5rem);width:340px;max-height:min(560px,80vh);overflow-y:auto;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 14px 40px rgba(17,38,146,.18);padding:.9rem;z-index:1000;text-align:left}
.tr-panel[hidden]{display:none}
.tr-panel h4{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--primary);margin:.6rem 0 .4rem}
.tr-panel h4:first-child{margin-top:0}
.tr-opt{display:flex;align-items:flex-start;gap:.6rem;width:100%;text-align:left;background:transparent;border:1px solid transparent;border-radius:var(--radius-sm);padding:.5rem .55rem;cursor:pointer;color:var(--ink)}
.tr-opt:hover{background:var(--card2)}
.tr-opt small{display:block;color:var(--muted);font-size:.78rem;margin-top:.1rem}
.tr-opt strong{font-weight:600;font-size:.92rem}
.tr-dot{flex:none;width:16px;height:16px;border-radius:50%;border:2px solid var(--line);margin-top:.15rem}
.tr-opt[aria-pressed="true"]{background:var(--primary-soft);border-color:rgba(var(--primary-rgb),.3)}
.tr-opt[aria-pressed="true"] .tr-dot{border-color:var(--primary);background:radial-gradient(var(--primary) 45%,transparent 50%)}
.tr-online{display:flex;flex-direction:column;gap:.35rem;font-size:.88rem;padding-left:.55rem}
.tr-panel>.meta{margin:.75rem 0 0;font-size:.78rem}
.ed-tag{display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.06em;background:var(--primary-soft);color:var(--primary);border-radius:3px;padding:.05rem .35rem;margin-right:.2rem}
@media (max-width:1399.98px){.tool-label{display:none}}
@media (max-width:1199.98px){.tr-menu .tool span{display:none}}
@media (max-width:991.98px){.lang-seg .full{display:none}.lang-seg .short{display:inline}.lang-seg button{padding:.35rem .5rem}}
@media (max-width:767.98px){.tr-panel{position:fixed;left:1rem;right:1rem;top:4rem;width:auto}.top-tools .tool[data-action="large"] span{display:none}}
/* Tamaño mínimo para el dedo en teléfonos (auditoría tools/audit-ux.cjs) */
@media (max-width:767px){
 .lang-seg button{min-height:36px;min-width:36px}
 .linklike{min-height:32px;padding-block:.35rem}
 .linklike.del{min-width:36px;min-height:36px}
}

.loading small{display:block;margin-top:.5rem;color:var(--muted,#8a92a6);font-size:.85rem}

/* ── Subrayados permanentes ── */
:root{--mk-yellow:rgba(255,213,0,.32);--mk-green:rgba(46,196,110,.24);--mk-pink:rgba(255,105,160,.22);--mk-purple:rgba(150,105,255,.22)}
html[data-theme="dark"]{--mk-yellow:rgba(255,213,0,.22);--mk-green:rgba(60,196,122,.22);--mk-pink:rgba(255,122,168,.22);--mk-purple:rgba(170,135,255,.25)}
.verse .number{background:none;border:0;cursor:pointer;border-radius:6px;min-height:24px;min-width:24px;align-self:start;margin-top:.1rem}
.verse .number:hover,.verse .number:focus-visible{background:var(--primary-soft)}
.verse[data-v]{cursor:pointer}
.verse.mark-yellow,.hl-list .mark-yellow{background:var(--mk-yellow)}
.verse.mark-green,.hl-list .mark-green{background:var(--mk-green)}
.verse.mark-pink,.hl-list .mark-pink{background:var(--mk-pink)}
.verse.mark-purple,.hl-list .mark-purple{background:var(--mk-purple)}
.verse.menu-open{outline:2px solid rgba(var(--primary-rgb),.45);outline-offset:-2px}
.verse-menu{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin:-.2rem -.5rem .6rem;padding:.5rem .6rem;background:var(--card);border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:0 6px 18px rgba(17,38,146,.12);font:.85rem var(--bs-font-sans-serif)}
.verse-menu .vm-ref{font-weight:600;color:var(--ink);margin-right:.25rem}
.verse-menu button{border:1px solid var(--line);background:var(--card2);color:var(--text);border-radius:999px;padding:.3rem .7rem;min-height:32px;cursor:pointer}
.verse-menu .swatch{width:32px;height:32px;padding:0;border:2px solid transparent}
.verse-menu .swatch[aria-pressed="true"]{border-color:var(--ink)}
.sw-yellow{background:#ffd500 !important}.sw-green{background:#3cc47a !important}.sw-pink{background:#ff69a0 !important}.sw-purple{background:#9669ff !important}
.verse-menu .vm-close{margin-left:auto}
.hl-list{list-style:none;padding:0;margin:.5rem 0 0;display:grid;gap:.5rem}
.hl-list li{position:relative;border-radius:var(--radius-sm);padding:.6rem 2.6rem .6rem .8rem}
.hl-list li p{margin:.2rem 0 0;font-family:var(--serif);color:var(--ink)}
.hl-list .del{position:absolute;top:.35rem;right:.35rem}

/* ── Panel de notas (sin salir de la página) ── */
#notes-fab{position:fixed;right:1.25rem;bottom:1.25rem;z-index:60;display:flex;align-items:center;gap:.4rem;border:0;border-radius:999px;padding:.75rem 1.1rem;background:var(--primary);color:#fff;font-weight:600;box-shadow:0 8px 22px rgba(var(--primary-rgb),.35);cursor:pointer;min-height:48px}
#notes-fab[aria-expanded="true"]{background:var(--ink);color:var(--card)}
#notes-drawer{position:fixed;z-index:59;background:var(--card);border-left:1px solid var(--line);box-shadow:-10px 0 30px rgba(17,38,146,.12);display:flex;flex-direction:column;gap:.6rem;padding:1rem 1.1rem 5rem;top:0;right:0;bottom:0;width:380px}
#notes-drawer[hidden]{display:none}
#notes-drawer .drawer-head{display:flex;justify-content:space-between;align-items:center}
#notes-drawer h2{font-size:1.15rem;margin:0}
#notes-drawer .drawer-scope{grid-template-columns:1fr 1fr;margin:0}
#notes-drawer .drawer-scope button{font-size:.85rem;min-height:36px}
#notes-drawer .drawer-scope button:disabled{opacity:.5;cursor:default}
#notes-drawer textarea{flex:1;min-height:140px;width:100%;border:1px solid var(--line);border-radius:var(--radius-sm);padding:.8rem 1rem;font:1rem/1.6 var(--bs-font-sans-serif);color:var(--ink);background:var(--card);resize:none}
#notes-drawer textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 .2rem rgba(var(--primary-rgb),.15)}
#notes-drawer .drawer-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.4rem;font-size:.8rem;color:var(--muted)}
@media (min-width:1200px){body.notes-open .main-content{margin-right:380px}}
@media (max-width:1199px){
 #notes-drawer{top:auto;left:0;width:auto;height:min(52vh,460px);border-left:0;border-top:1px solid var(--line);border-radius:1rem 1rem 0 0;box-shadow:0 -10px 30px rgba(17,38,146,.15);padding-bottom:1rem}
 body.notes-open #notes-fab{bottom:calc(min(52vh,460px) + .75rem)}
 body.notes-open .main-content{padding-bottom:min(52vh,460px)}
}
@media (max-width:767px){#notes-fab{right:.9rem;bottom:.9rem;padding:.7rem .95rem}}
.note-jump{border:0;background:none;color:var(--primary);cursor:pointer;min-height:32px}
@media print{#notes-fab,#notes-drawer{display:none}}
.scripture .verse .number{background:transparent !important;border:0 !important;box-shadow:none !important;padding:.55rem .15rem 0 0}
.scripture .verse .number:hover,.scripture .verse .number:focus-visible{background:var(--primary-soft) !important}
.content-inner{padding-bottom:5.5rem}
#notes-drawer .close{background:var(--bg);color:var(--text);border:0;border-radius:var(--radius-sm);padding:.4rem .65rem;font-size:1rem;min-width:36px;min-height:36px;cursor:pointer}
#notes-drawer .linklike{background:none;border:0;padding:.35rem 0;color:var(--primary);text-decoration:underline;font-weight:500;cursor:pointer;min-height:32px}
/* Escritorio con el panel de notas abierto: barra superior compacta (solo iconos) */
@media (min-width:1200px){
 body.notes-open .tool-label,body.notes-open .top-tools .tool span{display:none}
 body.notes-open .lang-seg .full{display:none}body.notes-open .lang-seg .short{display:inline}
}
body.notes-open #notes-fab{display:none}
.verse-menu .swatch[aria-pressed="true"]::after{content:"✓";color:#1a1f2d;font-weight:800;font-size:1rem}

/* ═════════ Cabecera con buscador centrado ═════════ */
.page-header{flex-direction:column;align-items:center;text-align:center;gap:1.1rem;padding:1.8rem 1.75rem 1.6rem}
.page-header .ph-text{flex:none;width:100%;display:flex;flex-direction:column;align-items:center}
.page-header p{margin-inline:auto}
.finder-hero{width:min(720px,100%);display:flex;flex-direction:column;gap:.7rem}
.finder-bar{display:flex;align-items:center;gap:.7rem;width:100%;min-height:54px;padding:.55rem .75rem .55rem 1.15rem;border:0;border-radius:50rem;background:#fff;color:var(--muted);box-shadow:0 10px 30px rgba(10,20,80,.22);cursor:text;font:1.02rem var(--bs-font-sans-serif);text-align:left}
.finder-bar:hover{box-shadow:0 12px 34px rgba(10,20,80,.28)}
.finder-bar:focus-visible{outline:3px solid rgba(255,255,255,.75);outline-offset:3px}
.finder-bar svg{width:20px;height:20px;color:var(--primary);flex:none}
.finder-bar .fb-text{flex:1;color:var(--text)}
.finder-bar .fb-eg{color:var(--muted);font-size:.85rem;white-space:nowrap}
kbd{display:inline-block;min-width:1.6em;padding:.1rem .4rem;border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;background:var(--card2);color:var(--text);font:600 .72rem var(--bs-font-sans-serif);text-align:center;line-height:1.4}
.finder-quick{display:flex;flex-wrap:wrap;justify-content:center;gap:.45rem}
.finder-quick button{border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.14);color:#fff;border-radius:50rem;padding:.4rem .9rem;font-size:.86rem;font-weight:500;min-height:34px;cursor:pointer}
.finder-quick button:hover,.finder-quick button:focus-visible{background:rgba(255,255,255,.26)}
.finder-quick .fq-recent{background:#fff;color:var(--primary);border-color:#fff}
html[data-theme="dark"] .finder-bar{background:var(--card)}
html[data-theme="dark"] .finder-quick .fq-recent{background:var(--card);border-color:var(--card)}
@media (max-width:767.98px){.page-header{padding:1.25rem 1rem}.finder-bar .fb-eg,.finder-bar kbd{display:none}.finder-bar{min-height:50px}}

/* Botón de búsqueda en la barra superior (siempre visible) */
.navbar-inner{gap:.75rem}
.nav-search{display:flex;align-items:center;gap:.55rem;flex:1 1 260px;max-width:420px;margin-inline:auto;min-height:40px;padding:.35rem .5rem .35rem .85rem;border:1px solid var(--line);border-radius:50rem;background:var(--card2);color:var(--muted);font-size:.9rem;cursor:pointer}
.nav-search:hover{border-color:rgba(var(--primary-rgb),.4);color:var(--text)}
.nav-search svg{width:16px;height:16px;color:var(--primary)}
.nav-search span{flex:1;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:991.98px){.nav-search{flex:0 0 auto;max-width:none;margin:0;padding:.4rem;min-width:40px;justify-content:center}.nav-search span,.nav-search kbd{display:none}}
body.notes-open .nav-search span,body.notes-open .nav-search kbd{display:none}
body.notes-open .nav-search{flex:0 0 auto;padding:.4rem;min-width:40px;justify-content:center}

/* ═════════ Buscador (ventana) ═════════ */
body.finder-open{overflow:hidden}
.finder-overlay{position:fixed;inset:0;z-index:1200;background:rgba(15,20,40,.45);backdrop-filter:blur(3px);display:flex;justify-content:center;align-items:flex-start;padding:6vh 1rem 1rem}
.finder-overlay[hidden]{display:none}
.finder-box{width:min(820px,100%);max-height:86vh;display:flex;flex-direction:column;background:var(--card);color:var(--text);border-radius:var(--radius);box-shadow:0 30px 80px rgba(10,20,60,.35);overflow:hidden}
.finder-input{display:flex;align-items:center;gap:.6rem;padding:.75rem .9rem;border-bottom:1px solid var(--line)}
.finder-input svg{width:20px;height:20px;color:var(--primary);flex:none}
.finder-input input{flex:1;min-width:0;border:0;outline:none;background:transparent;color:var(--ink);font:1.1rem var(--bs-font-sans-serif);padding:.45rem 0}
.finder-input input::-webkit-search-cancel-button{display:none}
.finder-input button{border:0;background:var(--card2);color:var(--text);border-radius:var(--radius-sm);padding:.4rem .7rem;min-height:36px;min-width:36px;cursor:pointer;font-size:.85rem}
.finder-input button[hidden]{display:none}
.finder-body{overflow-y:auto;padding:.9rem 1rem 1.1rem;overscroll-behavior:contain}
.finder-foot{display:flex;flex-wrap:wrap;gap:1rem;padding:.55rem 1rem;border-top:1px solid var(--line);font-size:.75rem;color:var(--muted)}
.finder-foot kbd{margin-right:.15rem}
@media (max-width:767.98px){.finder-overlay{padding:0}.finder-box{width:100%;max-height:none;height:100%;border-radius:0}.finder-foot{display:none}}
.fi-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:.35rem;background:var(--card2);padding:.3rem;border-radius:var(--radius-sm);margin-bottom:.9rem}
.fi-tab{border:0;background:transparent;color:var(--text);border-radius:var(--radius-sm);padding:.6rem .4rem;font-weight:600;font-size:.9rem;min-height:44px;cursor:pointer}
.fi-tab small{font-weight:500;color:var(--muted);margin-left:.2rem}
.fi-tab[aria-selected="true"]{background:var(--card);color:var(--primary);box-shadow:0 2px 8px rgba(17,38,146,.12)}
.fi-tab[aria-selected="true"] small{color:var(--primary)}
.fi-row{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin-bottom:.6rem}
.fi-label{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700;margin:.6rem .4rem .35rem 0}
.fi-chip{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:50rem;padding:.35rem .8rem;font-size:.86rem;min-height:34px;cursor:pointer}
.fi-chip:hover,.fi-chip:focus-visible{border-color:var(--primary);color:var(--primary)}
.fi-note{font-size:.82rem;color:var(--muted);margin:.5rem 0}
.fi-section{margin-top:1rem;scroll-margin-top:.5rem}
.fi-section h3{display:flex;align-items:center;gap:.5rem;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;margin:0 0 .5rem;color:var(--text)}
.fi-section h3::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--sec,var(--primary))}
.fi-books{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:.45rem}
.fi-book{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:.55rem;align-items:center;text-align:left;border:1px solid var(--line);border-left:4px solid var(--sec,var(--primary));background:var(--card);color:var(--ink);border-radius:var(--radius-sm);padding:.5rem .6rem;min-height:52px;cursor:pointer}
.fi-book b{grid-row:span 2;font-size:.95rem;color:var(--sec,var(--primary));min-width:2.6em}
.fi-book span{font-size:.88rem;line-height:1.2;overflow:hidden;text-overflow:ellipsis}
.fi-book small{color:var(--muted);font-size:.72rem}
.fi-book:hover,.fi-book:focus-visible,.fi-book.current{background:var(--primary-soft);border-color:var(--sec,var(--primary))}
.sec-pent{--sec:#b7791f}.sec-hist{--sec:#1a9150}.sec-wis{--sec:#8a4fd8}.sec-maj{--sec:#c03221}.sec-min{--sec:#e0661b}.sec-deutero{--sec:#8d6e63}.sec-orthodox{--sec:#6d4c41}.sec-appendix{--sec:#8a8f99}.sec-gosp{--sec:#3a57e8}.sec-acts{--sec:#079aa2}.sec-paul{--sec:#5a6cf0}.sec-cath{--sec:#0e7490}.sec-rev{--sec:#a3245a}
html[data-theme="dark"] .sec-pent{--sec:#e0a84a}html[data-theme="dark"] .sec-hist{--sec:#4cc985}html[data-theme="dark"] .sec-wis{--sec:#b18cf0}html[data-theme="dark"] .sec-maj{--sec:#ff7a6a}html[data-theme="dark"] .sec-min{--sec:#ff9a4d}html[data-theme="dark"] .sec-deutero,html[data-theme="dark"] .sec-orthodox{--sec:#c4a091}html[data-theme="dark"] .sec-gosp{--sec:#8ea0ff}html[data-theme="dark"] .sec-acts{--sec:#2ec4cc}html[data-theme="dark"] .sec-paul{--sec:#9aa6ff}html[data-theme="dark"] .sec-cath{--sec:#38bdd8}html[data-theme="dark"] .sec-rev{--sec:#ff7aa8}
.fi-bookhead{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;margin-bottom:.9rem}
.fi-back{border:0;background:var(--card2);color:var(--text);border-radius:var(--radius-sm);padding:.45rem .8rem;min-height:38px;cursor:pointer}
.fi-bookname{flex:1;min-width:180px}
.fi-bookname h3{margin:0;font-size:1.35rem;color:var(--ink)}
.fi-bookname small{color:var(--muted)}
.fi-crumb{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;font-weight:700;color:var(--sec,var(--primary))}
.fi-bookbtns{display:flex;flex-wrap:wrap;gap:.35rem}
.fi-bookbtns button{border:1px solid var(--line);background:var(--card);color:var(--primary);border-radius:var(--radius-sm);padding:.4rem .7rem;min-height:36px;font-size:.85rem;cursor:pointer}
.fi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:.4rem}
.fi-grid button{position:relative;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:var(--radius-sm);min-height:46px;font-weight:600;cursor:pointer}
.fi-grid button:hover,.fi-grid button:focus-visible{border-color:var(--primary);color:var(--primary);background:var(--primary-soft)}
.fi-grid button.current{background:var(--primary);color:#fff;border-color:var(--primary)}
.fi-grid button.read::after{content:"";position:absolute;top:5px;right:5px;width:6px;height:6px;border-radius:50%;background:var(--success)}
.fi-go{display:flex;align-items:center;gap:.7rem;width:100%;border:1px solid rgba(var(--primary-rgb),.35);background:var(--primary-soft);color:var(--ink);border-radius:var(--radius-sm);padding:.75rem .9rem;margin-bottom:.6rem;cursor:pointer;text-align:left;font-size:1rem}
.fi-go svg{width:18px;height:18px;color:var(--primary)}
.fi-go span{flex:1}
.fi-filters{display:flex;flex-wrap:wrap;gap:.35rem;margin:.2rem 0 .6rem}
.fi-filters button{border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:50rem;padding:.3rem .75rem;font-size:.82rem;min-height:32px;cursor:pointer}
.fi-filters button[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:#fff}
.fi-filters small{opacity:.75}
.fi-result{display:block;width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);padding:.65rem .4rem;cursor:pointer}
.fi-result strong{display:block;color:var(--primary);font-size:.85rem;margin-bottom:.15rem}
.fi-result span{font-family:var(--serif);color:var(--ink);line-height:1.5}
.fi-result:hover,.fi-result:focus-visible{background:var(--primary-soft)}
.fi-result mark{background:var(--mk-yellow);color:inherit;padding:0 .1em;border-radius:3px}
.fi-more{display:block;margin:.8rem auto 0;border:1px solid var(--line);background:var(--card);color:var(--primary);border-radius:50rem;padding:.45rem 1rem;cursor:pointer}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}

/* Migas de pan del lector */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1rem;background:var(--card);border:1px solid var(--line);border-radius:var(--radius-sm);padding:.45rem .6rem;margin-bottom:.9rem}
.crumb-path,.crumb-nav{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem}
.crumbs button{border:0;background:transparent;color:var(--primary);border-radius:var(--radius-sm);padding:.35rem .55rem;min-height:34px;font-size:.88rem;font-weight:500;cursor:pointer}
.crumbs button:hover,.crumbs button:focus-visible{background:var(--primary-soft)}
.crumb-path span{color:var(--muted)}
.crumb-nav button{border:1px solid var(--line)}
.crumb-path button:last-child{color:var(--ink);font-weight:700}

/* ═════════ Conexiones AT ↔ NT ═════════ */
.verse.has-xref .number::after{content:"↔";display:block;font-size:.6rem;line-height:1;color:var(--muted);margin-top:.15rem}
.vm-xref{flex-basis:100%;display:grid;gap:.35rem;margin-top:.35rem;padding-top:.5rem;border-top:1px solid var(--line)}
.vm-xref button{display:block;text-align:left;border-radius:var(--radius-sm)!important;padding:.45rem .6rem!important}
.vm-xref strong{display:block;color:var(--primary);font-size:.82rem}
.vm-xref span{font-family:var(--serif);font-size:.9rem;color:var(--ink)}
.vm-xref .meta{margin:.2rem 0 0;font-size:.75rem}
.verse-menu svg{width:14px;height:14px;vertical-align:-2px}
.xref-card{margin:1.2rem 0;padding:1rem 1.1rem;border:1px solid var(--line);border-left:4px solid var(--info);border-radius:var(--radius-sm);background:var(--card2)}
.xref-card:empty{display:none}
.xref-list{list-style:none;padding:0;margin:.5rem 0;display:grid;gap:.35rem}
.xref-list li{display:flex;gap:.6rem;align-items:baseline}
.xref-v{flex:none;border:0;background:var(--primary-soft);color:var(--primary);border-radius:6px;font-weight:700;font-size:.78rem;padding:.25rem .45rem;min-height:28px;min-width:42px;cursor:pointer}
.xref-card .linklike{background:none;border:0;padding:.2rem 0;color:var(--primary);text-decoration:underline;cursor:pointer;min-height:28px}

/* ═════════ Hoy ═════════ */
.today{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr);gap:1rem;margin-bottom:1.5rem}
.today-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.1rem 1.2rem;box-shadow:0 4px 18px rgba(17,38,146,.05);display:flex;flex-direction:column;gap:.5rem}
.today-card h3{margin:0;font-size:1.2rem;color:var(--ink)}
.today-card p{margin:0}
.today-card .eyebrow svg{width:14px;height:14px;vertical-align:-2px}
.today-card progress{width:100%;height:8px}
.today-card>button.primary,.today-card>.btn-row{margin-top:auto}
.today-card>button{align-self:flex-start}
.votd{background:linear-gradient(135deg,var(--card) 0%,var(--card2) 100%);border-left:4px solid var(--gold)}
.votd blockquote{margin:0;font:1.15rem/1.6 var(--serif);color:var(--ink)}
.votd blockquote.en{font-size:1rem;color:var(--text)}
.today-ref{font-weight:700;color:var(--gold);font-size:.9rem}
@media (max-width:1199.98px){.today{grid-template-columns:1fr 1fr}.votd{grid-column:1/-1}}
@media (max-width:575.98px){.today{grid-template-columns:1fr}}

/* ═════════ Planes ═════════ */
.plans-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.plan-card{display:flex;flex-direction:column;gap:.4rem}
.plan-card>button{margin-top:auto;align-self:flex-start}
.plan-card progress,.plan-active>progress{width:100%;height:8px}
.plan-top{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}
.plan-top h2{margin:.2rem 0}
.plan-count{text-align:center;min-width:90px}
.plan-count strong{display:block;font-size:2rem;color:var(--primary);line-height:1}
.plan-count span{font-size:.8rem;color:var(--muted)}
.plan-days summary{cursor:pointer;font-weight:600;margin:1rem 0 .5rem;color:var(--primary)}
.plan-days ol{list-style:none;padding:0;margin:0;display:grid;gap:.3rem}
.plan-days li{display:flex;align-items:center;gap:.6rem;padding:.3rem .4rem;border-radius:var(--radius-sm)}
.plan-days li.next{background:var(--primary-soft)}
.day-check{flex:none;width:36px;height:36px;border-radius:50%;border:2px solid var(--line);background:var(--card);color:var(--muted);font-weight:700;font-size:.8rem;cursor:pointer}
.plan-days li.done .day-check{background:var(--success);border-color:var(--success);color:#fff}
.plan-days .linklike{background:none;border:0;padding:.2rem 0;color:var(--primary);text-decoration:underline;cursor:pointer;min-height:28px}
progress{accent-color:var(--primary)}

/* ═════════ Cuaderno compartido ═════════ */
.sync-card{border-left:4px solid var(--primary)}
.sync-card.on{border-left-color:var(--success)}
.sync-head{display:flex;gap:.9rem;align-items:flex-start}
.sync-head>svg{width:28px;height:28px;color:var(--primary);flex:none;margin-top:.2rem}
.sync-card.on .sync-head>svg{color:var(--success)}
.sync-head h2{margin:0 0 .25rem}
.sync-status{font-weight:600;margin:0}
.sync-status[data-state="ok"]{color:var(--success)}
.sync-status[data-state="error"],.sync-status[data-state="badcode"],.sync-status[data-state="toolarge"]{color:var(--danger)}
.sync-status[data-state="offline"]{color:var(--warning)}
.sync-card .btn-row svg{width:16px;height:16px;vertical-align:-3px}
.sync-join{margin-top:1rem}
.sync-join input{flex:1;min-width:0;font-family:ui-monospace,Consolas,monospace;letter-spacing:.05em;text-transform:uppercase}
.sync-more summary{cursor:pointer;color:var(--primary);font-weight:600;margin-top:1rem}
.sync-code{font:700 1.15rem ui-monospace,Consolas,monospace;letter-spacing:.08em;background:var(--card2);border:1px dashed var(--line);border-radius:var(--radius-sm);padding:.6rem .8rem;word-break:break-all;color:var(--ink)}
button.danger{border:1px solid var(--danger) !important;background:transparent !important;color:var(--danger) !important}
.sync-pill{display:inline-flex;align-items:center;gap:.35rem;margin-top:.6rem;border:0;background:rgba(26,160,83,.12);color:var(--success);border-radius:50rem;padding:.3rem .7rem;font-size:.75rem;font-weight:600;cursor:pointer;min-height:28px}
.sync-pill[hidden]{display:none}
.sync-pill svg{width:14px;height:14px}
.sync-pill[data-state="error"],.sync-pill[data-state="badcode"]{background:rgba(192,50,33,.12);color:var(--danger)}
.sync-pill[data-state="offline"]{background:rgba(241,106,27,.12);color:var(--warning)}
table.keys{width:100%;border-collapse:collapse}
table.keys td{padding:.55rem .3rem;border-bottom:1px solid var(--line)}
table.keys td:first-child{white-space:nowrap;width:1%}

.install-btn{display:inline-flex;align-items:center;gap:.4rem;margin-top:.6rem;border:0;background:var(--primary);color:#fff;border-radius:50rem;padding:.45rem .9rem;font-size:.82rem;font-weight:600;cursor:pointer;min-height:34px}
.install-btn[hidden]{display:none}
.install-btn svg{width:14px;height:14px}
.sidebar-couple{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}

/* ═════════ Ajustes: los componentes nuevos dentro de #main ganan al estilo general de botones ═════════ */
.page-header>div.ph-text{flex:none}
#main .finder-bar{display:flex;justify-content:flex-start;gap:.7rem;border:0;border-radius:50rem;background:#fff;color:var(--muted);padding:.55rem .75rem .55rem 1.15rem;font-weight:400;min-height:54px}
#main .finder-bar:hover{background:#fff}
#main .finder-quick button{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:50rem;padding:.4rem .9rem;font-weight:500}
#main .finder-quick button:hover,#main .finder-quick button:focus-visible{background:rgba(255,255,255,.28)}
#main .finder-quick .fq-recent{background:#fff;color:var(--primary);border-color:#fff}
html[data-theme="dark"] #main .finder-bar,html[data-theme="dark"] #main .finder-bar:hover{background:var(--card)}
html[data-theme="dark"] #main .finder-quick .fq-recent{background:var(--card);border-color:var(--card);color:var(--primary)}
#main .crumbs button{background:transparent;border:0;border-radius:var(--radius-sm);padding:.35rem .55rem;font-weight:500}
#main .crumbs button:hover,#main .crumbs button:focus-visible{background:var(--primary-soft)}
#main .crumb-nav button{border:1px solid var(--line)}
#main .crumb-path button:last-child{color:var(--ink);font-weight:700}
#main .day-check{width:36px;height:36px;border-radius:50%;border:2px solid var(--line);background:var(--card);color:var(--muted);padding:0;font-weight:700}
#main .plan-days li.done .day-check{background:var(--success);border-color:var(--success);color:#fff}
#main .xref-v{background:var(--primary-soft);border:0;border-radius:6px;padding:.25rem .45rem}
/* Barra superior: el título no se corta; la búsqueda pequeña aparece al bajar, cuando la grande ya no se ve */
.page-crumb{flex:0 1 auto;max-width:40%}
.nav-search{display:none}
body.hero-search-off .nav-search{display:flex;animation:navsearch-in .18s ease-out}
@keyframes navsearch-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){body.hero-search-off .nav-search{animation:none}}
.fi-filters button:disabled{opacity:.45;cursor:default}

/* ═════════ Tamaño de letra de toda la app ═════════ */
html[data-size="1"]{font-size:112.5%}
html[data-size="2"]{font-size:125%}
html[data-size="3"]{font-size:140%}
.size-menu{position:relative}
.size-panel{position:absolute;right:0;top:calc(100% + .5rem);width:300px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 14px 40px rgba(17,38,146,.18);padding:1rem;z-index:1000}
.size-panel[hidden]{display:none}
.size-panel h4{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 .6rem}
.size-opts{display:grid;grid-template-columns:repeat(4,1fr);gap:.35rem}
.size-opts button{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:.2rem;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:var(--radius-sm);padding:.5rem .2rem;min-height:72px;cursor:pointer}
.size-opts button[aria-pressed="true"]{border-color:var(--primary);background:var(--primary-soft);color:var(--primary)}
.size-opts small{font-size:.68rem;line-height:1.1;text-align:center}
.sz-sample{font-weight:700;line-height:1}.sz-0{font-size:16px}.sz-1{font-size:19px}.sz-2{font-size:22px}.sz-3{font-size:26px}
.size-panel .meta{font-size:.78rem;margin:.6rem 0 0}
@media (max-width:767.98px){.size-panel{position:fixed;left:1rem;right:1rem;top:4rem;width:auto}}

/* ═════════ Escuchar ═════════ */
#main .listen-btn{background:var(--primary);color:#fff;border-radius:50rem;padding:.55rem 1.1rem;font-weight:600;min-height:44px}
#main .listen-btn:hover{background:#314ac5}
#main .listen-btn svg{width:18px;height:18px}
.reading-guide .listen-btn{margin:.2rem 0 .8rem}
.verse.speaking{background:var(--primary-soft);box-shadow:inset 4px 0 0 var(--primary)}
.player{position:fixed;left:50%;transform:translateX(-50%);bottom:1rem;z-index:61;width:min(640px,calc(100% - 1.5rem));background:var(--card);border:1px solid var(--line);border-radius:1.1rem;box-shadow:0 16px 44px rgba(17,38,146,.25);padding:.6rem .75rem .55rem;display:flex;flex-direction:column;gap:.4rem}
.player[hidden]{display:none}
.pl-main{display:flex;align-items:center;gap:.45rem}
.pl-btn{flex:none;width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:var(--card2);color:var(--ink);font-size:1.15rem;line-height:1;cursor:pointer}
.pl-play{width:56px;height:56px;background:var(--primary);border-color:var(--primary);color:#fff;font-size:1.35rem}
.pl-close{width:40px;height:40px;font-size:.95rem;margin-left:auto}
.pl-where{display:flex;flex-direction:column;min-width:0;padding-left:.3rem}
.pl-where strong{color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-where small{color:var(--muted)}
.pl-opts{display:flex;flex-wrap:wrap;gap:.4rem 1rem;align-items:center;font-size:.82rem;color:var(--text)}
.pl-opts select{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:var(--radius-sm);padding:.25rem .4rem;min-height:32px;max-width:12rem}
.pl-check{display:flex;align-items:center;gap:.35rem;min-height:32px}
.pl-check input{width:20px;height:20px;accent-color:var(--primary)}
body.player-open #notes-fab{bottom:calc(9.5rem + 1rem)}
body.player-open .content-inner{padding-bottom:12rem}
@media (max-width:767.98px){.player{bottom:.5rem;width:calc(100% - 1rem)}}

/* ═════════ Lecturas de hoy ═════════ */
.today-readings{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .75rem;margin:-.5rem 0 1.5rem;padding:.75rem 1rem;background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
.today-readings .tr-label{font-weight:700;color:var(--ink);font-size:.9rem;display:flex;align-items:center;gap:.4rem}
.today-readings .tr-label svg{width:16px;height:16px;color:var(--two24,#d6336c)}
.today-readings a{display:flex;flex-direction:column;padding:.4rem .8rem;border:1px solid var(--line);border-radius:var(--radius-sm);text-decoration:none;color:var(--primary);min-height:44px;justify-content:center}
.today-readings a small{color:var(--muted);font-size:.75rem}
.today-readings a:hover{background:var(--primary-soft)}

/* Teléfono con letra grande: la barra de herramientas pasa a dos filas en vez de salirse de la pantalla */
@media (max-width:767.98px){.top-tools{flex-wrap:wrap;row-gap:.4rem;justify-content:flex-start;min-width:0;max-width:100%}.navbar-inner{flex-wrap:wrap}}
html[data-size="2"] .lang-seg .full,html[data-size="3"] .lang-seg .full{display:none}html[data-size="2"] .lang-seg .short,html[data-size="3"] .lang-seg .short{display:inline}

.pl-btn svg{width:20px;height:20px;vertical-align:middle}.pl-play svg{width:24px;height:24px}
.top-tools .tool span,.tr-menu .tool span{white-space:nowrap}
@media (max-width:1499.98px){body.hero-search-off .tool-label{display:none}}

/* ═════════ v1.7 · Leer juntos: barra «Hoy», progreso, panel de estudio ═════════ */
/* Barra «Hoy juntos» arriba del lector */
.together{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem;margin:0 0 1rem}
.tg-cell{display:flex;align-items:center;gap:.65rem;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:.7rem .85rem;box-shadow:var(--shadow);min-width:0;text-align:left}
#main button.tg-cell{justify-content:flex-start;background:var(--card);color:var(--text);border:1px solid var(--line);padding:.7rem .85rem;border-radius:var(--radius);font-weight:400}
#main button.tg-cell:hover{border-color:var(--primary)}
.tg-cell strong{display:block;color:var(--ink);font-size:1.02rem;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tg-k{font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600}
.tg-today{flex-direction:column;align-items:flex-start;gap:.15rem}.tg-today span{font-size:.85rem;color:var(--text);line-height:1.35}
.tg-streak svg{width:26px;height:26px;color:var(--muted)}.tg-streak.on svg{color:#f16a1b}
.av{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;font-size:1rem}
.av-two24{background:var(--two24)}.av-pa{background:var(--primary)}.av-both{background:linear-gradient(135deg,var(--primary),var(--two24))}
.ring{width:38px;height:38px;flex:none;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:4}.ring .ring-bg{stroke:var(--line)}.ring .ring-fg{stroke:var(--primary);stroke-linecap:round}.ring .ring-fg.full{stroke:var(--success)}
@media (max-width:991px){.together{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.tg-cell{padding:.55rem .6rem;gap:.45rem}.av,.ring{width:32px;height:32px}.tg-cell strong{font-size:.92rem}}
#main .reader-btn.both{color:var(--ink)}
#main .reader-btn.both[aria-pressed="true"]{background:linear-gradient(90deg,var(--primary),var(--two24));color:#fff;border-color:transparent}
#main .next-up{margin-top:.6rem}

/* Botones de herramientas en el lector (teléfono y tableta); en la computadora están en la barra derecha */
.study-chips{display:flex;gap:.4rem;overflow-x:auto;padding:.6rem 0 .1rem;scrollbar-width:none}
.study-chips::-webkit-scrollbar{display:none}
#main .study-chips button{flex:none;border-radius:50rem;padding:.4rem .85rem;font-size:.85rem;background:var(--card);border:1px solid var(--line);color:var(--ink)}
#main .study-chips button svg{color:var(--primary)}
@media (min-width:1200px){.study-chips{display:none}}
#study-rail{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:58;display:none;flex-direction:column;gap:.25rem;background:var(--card);border:1px solid var(--line);border-right:0;border-radius:var(--radius) 0 0 var(--radius);box-shadow:var(--shadow);padding:.4rem .3rem}
#study-rail button{display:flex;flex-direction:column;align-items:center;gap:.15rem;width:68px;border:0;background:transparent;color:var(--text);border-radius:var(--radius-sm);padding:.45rem .2rem;font:500 .7rem/1.2 var(--bs-font-sans-serif);cursor:pointer}
#study-rail button svg{width:20px;height:20px;color:var(--primary)}
#study-rail button:hover,#study-rail button:focus-visible{background:var(--primary-soft);color:var(--primary)}
@media (min-width:1200px){#study-rail:not([hidden]){display:flex}body:not(.notes-open) #main.content-inner{padding-right:96px}#notes-fab{display:none}}

/* Panel de estudio (era el panel de notas) */
#notes-drawer{width:420px;overflow:hidden}
@media (min-width:1200px){body.notes-open .main-content{margin-right:420px}}
.study-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:.2rem;background:var(--card2);padding:.2rem;border-radius:var(--radius-sm)}
.study-tabs button{display:flex;flex-direction:column;align-items:center;gap:.1rem;border:0;background:transparent;color:var(--text);border-radius:var(--radius-sm);padding:.4rem .1rem;font:500 .72rem/1.15 var(--bs-font-sans-serif);cursor:pointer;min-height:44px}
.study-tabs button svg{width:18px;height:18px}
.study-tabs button[aria-selected="true"]{background:var(--primary);color:#fff}
.study-body{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem;padding-right:.2rem;min-height:0}
.study-body.tab-notes textarea{flex:1}
.study-body h3{font-size:1rem;margin:.9rem 0 .2rem}
.study-body h3.tab-title{margin:.2rem 0;font-size:1.05rem;color:var(--muted);font-weight:600}
.study-body p{margin:.2rem 0}
#notes-drawer .study-body button:not(.linklike):not(.q-opt):not(.chip){display:inline-flex;align-items:center;justify-content:center;gap:.35rem;border:1px solid transparent;background:var(--primary-soft);color:var(--primary);border-radius:var(--radius-sm);padding:.45rem .85rem;font:500 .88rem/1.3 var(--bs-font-sans-serif);cursor:pointer;min-height:38px}
#notes-drawer .study-body button.primary{background:var(--primary);color:#fff}
#notes-drawer .study-body button[aria-pressed="true"]:not(.q-opt):not(.linklike):not(.chip){background:var(--primary);color:#fff;border-color:var(--primary)}
#notes-drawer .study-body button:disabled:not(.q-opt){opacity:.5;cursor:default}
#notes-drawer .study-body .btn-row{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}
#notes-drawer .study-body .chip{cursor:pointer;text-align:left;font-weight:500;display:inline-flex;flex-direction:column;align-items:flex-start;background:var(--card);border:1px solid var(--line);color:var(--ink);border-radius:var(--radius);padding:.35rem .7rem;font-size:.85rem}
#notes-drawer .study-body .chip small{color:var(--muted);font-size:.7rem}
#notes-drawer .study-body .chips,.vw-index{display:flex;flex-wrap:wrap;gap:.35rem}
@media (max-width:1199px){
 #notes-drawer{height:min(80vh,680px);width:auto}
 #notes-drawer[data-tab="notes"]{height:min(56vh,480px)}
 body.notes-open .main-content{padding-bottom:min(56vh,480px)}
}
@media (max-width:767px){#notes-drawer{padding:.75rem .8rem .8rem}.study-tabs button span{font-size:.66rem}}
.note-tools{margin-top:.2rem}
.note-refs{border-top:1px solid var(--line);padding-top:.5rem;max-height:30vh;overflow-y:auto;flex:none}
details.cite{border:1px solid var(--line);border-radius:var(--radius-sm);margin:.3rem 0;background:var(--card)}
details.cite summary{cursor:pointer;padding:.3rem .6rem;font-size:.82rem;font-weight:600;color:var(--primary);display:flex;align-items:center;gap:.35rem;list-style:none}
details.cite summary::-webkit-details-marker{display:none}
details.cite[open] summary{border-bottom:1px solid var(--line)}
.cite-text{padding:.4rem .7rem;font-family:var(--serif);color:var(--ink);font-size:.95rem}
.cite-text p{margin:.15rem 0}.cite-text sup{color:var(--muted);font-family:var(--bs-font-sans-serif)}
details.cite .linklike{margin:0 .7rem .3rem}
.sum-list{padding-left:1.2rem;margin:.2rem 0}.sum-list li{margin:.35rem 0}.sum-list li p{color:var(--ink)}
.hard{border-left:3px solid var(--warning);padding:.2rem 0 .2rem .7rem;margin:.4rem 0}
.ai-note{font-size:.78rem;color:var(--muted);display:flex;gap:.35rem;align-items:flex-start;margin-top:.6rem !important}
.ai-note svg{flex:none;width:14px;height:14px;margin-top:.2rem;color:var(--primary)}
.ai-error{color:var(--danger);background:rgba(192,50,33,.07);border-radius:var(--radius-sm);padding:.5rem .7rem}
.ai-wait{display:flex;gap:.7rem;align-items:center;background:var(--primary-soft);border-radius:var(--radius);padding:.8rem}
.spinner{flex:none;width:22px;height:22px;border-radius:50%;border:3px solid var(--primary-soft2);border-top-color:var(--primary);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.ai-en{border-top:1px dashed var(--line);margin-top:.8rem;padding-top:.4rem}
.quiz{background:linear-gradient(135deg,rgba(var(--primary-rgb),.06),var(--two24-soft));border-radius:var(--radius);padding:.6rem .8rem;margin-top:.8rem}
.quiz h3{display:flex;gap:.4rem;align-items:center;margin-top:.2rem}
.q{margin:.5rem 0}.q-opts{display:flex;flex-direction:column;gap:.3rem}
#notes-drawer .q-opt{text-align:left;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:var(--radius-sm);padding:.45rem .7rem;font:500 .88rem/1.3 var(--bs-font-sans-serif);cursor:pointer;min-height:38px}
#notes-drawer .q-opt:hover:not(:disabled){border-color:var(--primary)}
#notes-drawer .q-opt.right{background:rgba(26,160,83,.14);border-color:var(--success);color:var(--ink)}
#notes-drawer .q-opt.wrong{background:rgba(192,50,33,.1);border-color:var(--danger);color:var(--ink)}
#notes-drawer .q-opt:disabled{cursor:default;opacity:1}
.quiz-score{font-weight:700;color:var(--ink);text-align:center}
.sim-list{list-style:none;padding:0;margin:0}.sim-list li{padding:.35rem 0;border-bottom:1px solid var(--line)}.sim-list p{font-size:.88rem;font-family:var(--serif)}
.word{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.5rem .7rem;background:var(--card)}
.word h4{font-size:.95rem;margin:0 0 .15rem;color:var(--ink)}.word p{font-size:.9rem}
.word-src{display:flex;flex-wrap:wrap;gap:.2rem .7rem;font-size:.75rem;margin-top:.25rem}
.ai-words dt{font-weight:600;color:var(--ink);margin-top:.35rem}.ai-words dd{margin:0 0 .2rem;font-size:.9rem}
.explain-form{display:flex;flex-wrap:wrap;gap:.5rem;align-items:flex-end}
.explain-form label{display:flex;flex-direction:column;font-size:.8rem;color:var(--muted);gap:.2rem}
.explain-form label.grow{flex:1;min-width:150px}
.explain-form select,.explain-form input,.verse-pick select{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.4rem .5rem;background:var(--card);color:var(--ink);font-size:.95rem;min-height:38px}
.verse-quote{margin:.4rem 0;padding:.4rem .8rem;border-left:3px solid var(--primary);font-family:var(--serif);color:var(--ink);background:var(--primary-soft);border-radius:0 var(--radius-sm) var(--radius-sm) 0}
.explain-out p{margin:.3rem 0}
details.vw{border:1px solid var(--line);border-radius:var(--radius);background:var(--card);margin:.35rem 0}
details.vw summary{cursor:pointer;padding:.55rem .75rem;display:flex;flex-direction:column;gap:.05rem;list-style:none}
details.vw summary::-webkit-details-marker{display:none}
details.vw summary strong{color:var(--ink)}.vw-ref{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:600}
details.vw > :not(summary){margin-left:.75rem;margin-right:.75rem}
details.vw[open]{padding-bottom:.6rem}
.vw-why{font-style:italic;color:var(--text)}
.vw-sides{display:flex;flex-direction:column;gap:.45rem}
.vw-side{border-left:4px solid;border-radius:var(--radius-sm);padding:.45rem .7rem;background:var(--card2)}
.vw-side.cat{border-left-color:#c03221}.vw-side.cat .eyebrow{color:#c03221}
.vw-side.orth{border-left-color:#b7791f}.vw-side.orth .eyebrow{color:#9a6512}
html[data-theme="dark"] .vw-side.cat .eyebrow{color:#ff8a7a}html[data-theme="dark"] .vw-side.orth .eyebrow{color:#e8b25c}
.callout.vw-shared{border-left-color:var(--success);margin:.45rem .75rem}.callout.vw-differ{border-left-color:var(--warning);margin:.45rem .75rem}
#main .vw-mark{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;padding:.2rem .35rem;margin:0 .3rem 0 0;border-radius:50rem;background:rgba(183,121,31,.12);color:#9a6512;border:0;min-height:28px;min-width:30px}
#main .vw-mark svg{width:15px;height:15px}
html[data-theme="dark"] #main .vw-mark{color:#e8b25c}
.cmp{display:flex;flex-direction:column;gap:.3rem}
.cmp-row{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.35rem .6rem;background:var(--card)}
.cmp-name{font-size:.72rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.cmp-row p{font-family:var(--serif);color:var(--ink);font-size:.95rem}
.verse-pick{display:flex;gap:.4rem;align-items:center;font-size:.85rem;color:var(--muted)}
#tr-input{width:100%;min-height:96px;border:1px solid var(--line);border-radius:var(--radius-sm);padding:.6rem .8rem;font:1rem/1.5 var(--bs-font-sans-serif);color:var(--ink);background:var(--card);resize:vertical;flex:none}
#tr-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 .2rem rgba(var(--primary-rgb),.15)}
.check{display:flex;gap:.45rem;align-items:flex-start;font-size:.85rem}
.check input{margin-top:.25rem}
.tr-result{background:var(--primary-soft);border-radius:var(--radius-sm);padding:.6rem .8rem;color:var(--ink)}
.tr-result p{margin:.25rem 0}
#note-tr .tr-result{margin-top:.3rem}

/* Página «Nuestro progreso» */
.pg-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}
.pg-stat{background:var(--card2);border-radius:var(--radius);padding:.9rem;text-align:center}
.pg-stat strong{display:flex;justify-content:center;align-items:center;gap:.3rem;font-size:1.7rem;color:var(--ink);line-height:1.1}
.pg-stat span{font-size:.82rem;color:var(--muted)}
.pg-stat.hot strong svg{color:#f16a1b;width:26px;height:26px}
.pg-turns{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin:1rem 0}
.pg-person{display:flex;align-items:center;gap:.7rem;border:1px solid var(--line);border-radius:var(--radius);padding:.7rem .9rem}
.pg-person strong{display:block;color:var(--ink)}.pg-person span{font-size:.85rem;color:var(--muted)}
.pg-person .pill{margin-left:auto}
.pg-person.p-two24{background:var(--two24-soft)}.pg-person.p-pa{background:var(--primary-soft)}
.pg-goal-row{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.pg-goal-row .ring{width:64px;height:64px}
.pg-goal-row h2{margin:0}
.pg-goal-row > div:nth-child(2){flex:1;min-width:200px}
.stepper{display:flex;align-items:center;gap:.5rem}
#main .stepper button{width:40px;height:40px;padding:0;font-size:1.3rem;border-radius:50%}
.stepper span{min-width:2ch;text-align:center;font-size:1.3rem;font-weight:700;color:var(--ink)}
.cal{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:4px;max-width:480px;margin:.6rem 0}
.cal-d{display:block;aspect-ratio:1;border-radius:3px;background:var(--line)}
.cal-d.c-two24{background:var(--two24)}.cal-d.c-pa{background:var(--primary)}
.cal-d.c-both{background:linear-gradient(135deg,var(--primary) 50%,var(--two24) 50%)}
.cal-d.c-future{background:transparent;border:1px dashed var(--line)}
.cal-d.today{outline:2px solid var(--ink);outline-offset:1px}
.cal-legend{display:flex;flex-wrap:wrap;gap:.4rem 1rem;font-size:.8rem;color:var(--muted)}
.cal-legend span{display:flex;align-items:center;gap:.35rem}.cal-legend i.cal-d{width:12px;height:12px}
.bmap{display:grid;grid-template-columns:repeat(auto-fill,minmax(54px,1fr));gap:5px;margin:.4rem 0 1rem}
#main .bm{position:relative;overflow:hidden;padding:.45rem .2rem;border-radius:var(--radius-sm);background:var(--card2);color:var(--ink);border:1px solid var(--line);font-size:.78rem;font-weight:600;min-height:38px}
#main .bm span{position:relative;z-index:1}
#main .bm::before{content:"";position:absolute;left:0;bottom:0;right:0;height:0;background:rgba(var(--primary-rgb),.35);transition:height .3s}
#main .bm.f1::before{height:10%}#main .bm.f2::before{height:20%}#main .bm.f3::before{height:30%}#main .bm.f4::before{height:40%}#main .bm.f5::before{height:50%}
#main .bm.f6::before{height:60%}#main .bm.f7::before{height:70%}#main .bm.f8::before{height:80%}#main .bm.f9::before{height:90%}#main .bm.f10::before{height:100%}
#main .bm.done{background:var(--success);color:#fff;border-color:var(--success)}#main .bm.done::before{display:none}
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem}
.badge-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.25rem;border:1px dashed var(--line);border-radius:var(--radius);padding:.8rem .5rem;opacity:.6}
.badge-card svg{width:28px;height:28px;color:var(--muted)}
.badge-card strong{font-size:.85rem;color:var(--ink);line-height:1.25}
.badge-card.earned{opacity:1;border-style:solid;border-color:rgba(var(--primary-rgb),.35);background:linear-gradient(160deg,rgba(var(--primary-rgb),.08),var(--two24-soft))}
.badge-card.earned svg{color:#e0a800}
.days{list-style:none;padding:0;margin:0}.days li{padding:.5rem 0;border-bottom:1px solid var(--line)}
.who-read{font-weight:600}.who-read.r-two24{color:var(--two24)}.who-read.r-pa{color:var(--primary)}
@media (max-width:767px){.pg-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.pg-turns{grid-template-columns:1fr}.pg-stat strong{font-size:1.4rem}}

/* Celebraciones */
.confetti{position:fixed;inset:0;pointer-events:none;z-index:3000;overflow:hidden}
.confetti i{position:absolute;top:-12px;width:8px;height:14px;border-radius:2px;animation:fall 2.4s cubic-bezier(.2,.6,.4,1) forwards}
@keyframes fall{to{transform:translate(var(--dx),105vh) rotate(var(--rot));opacity:.9}}
#celebrate{position:fixed;inset:0;z-index:2500;background:rgba(15,20,35,.45);display:grid;place-items:center;padding:1rem}
.cel-card{background:var(--card);border-radius:var(--radius);box-shadow:0 20px 50px rgba(0,0,0,.25);padding:1.6rem 1.5rem;max-width:420px;width:100%;text-align:center}
.cel-card .cel-ic{width:48px;height:48px;color:#e0a800}
.cel-card h2{margin:.4rem 0}
.cel-card ul{list-style:none;padding:0;margin:.5rem 0;font-weight:600;color:var(--ink)}
.cel-card .btn-row{justify-content:center;display:flex;flex-wrap:wrap;gap:.4rem}
#celebrate button{display:inline-flex;align-items:center;gap:.4rem;border:1px solid transparent;background:var(--primary-soft);color:var(--primary);border-radius:var(--radius-sm);padding:.55rem 1rem;font:500 .92rem/1.3 var(--bs-font-sans-serif);cursor:pointer}
#celebrate button.primary{background:var(--primary);color:#fff}
@media (prefers-reduced-motion:reduce){.spinner{animation-duration:3s}}
@media print{#study-rail,.together,.study-chips{display:none !important}}
.pg-person span.av{color:#fff;font-size:1rem}
/* Letra grande o máxima en la computadora: la barra superior pasa a solo iconos para que nunca se salga */
html[data-size="2"] .top-tools .tool > span,html[data-size="3"] .top-tools .tool > span,html[data-size="2"] .tool-label,html[data-size="3"] .tool-label{display:none}
html[data-size="2"] .nav-search kbd,html[data-size="3"] .nav-search kbd,html[data-size="3"] .nav-search span{display:none}

/* ═════════ v1.9 · La pareja: colores de cada persona (--pa, --pb vienen de «Nuestra pareja») ═════════ */
:root{--pa:#3a57e8;--pb:#d6336c}
.who.p0{background:color-mix(in srgb,var(--pa) 12%,transparent);color:var(--pa)}
.who.p1{background:color-mix(in srgb,var(--pb) 12%,transparent);color:var(--pb)}
#main .reader-btn.p0{color:var(--pa)}#main .reader-btn.p1{color:var(--pb)}
#main .reader-btn.p0[aria-pressed="true"]{background:var(--pa);color:#fff;border-color:var(--pa)}
#main .reader-btn.p1[aria-pressed="true"]{background:var(--pb);color:#fff;border-color:var(--pb)}
#main .reader-btn.both[aria-pressed="true"]{background:linear-gradient(90deg,var(--pa),var(--pb))}
.av.p0{background:var(--pa)}.av.p1{background:var(--pb)}.av-both{background:linear-gradient(135deg,var(--pa),var(--pb))}
.pg-person.p0{background:color-mix(in srgb,var(--pa) 10%,transparent)}.pg-person.p1{background:color-mix(in srgb,var(--pb) 10%,transparent)}
.cal-d.c-p0{background:var(--pa)}.cal-d.c-p1{background:var(--pb)}
.cal-d.c-both{background:linear-gradient(135deg,var(--pa) 50%,var(--pb) 50%)}
.who-read.p0{color:var(--pa)}.who-read.p1{color:var(--pb)}
.couple-chips{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;width:100%}
.couple-edit{margin-left:auto;border:0;background:transparent;color:var(--muted);border-radius:var(--radius-sm);padding:.3rem;min-width:32px;min-height:32px;cursor:pointer}
.couple-edit:hover,.couple-edit:focus-visible{background:var(--primary-soft);color:var(--primary)}
/* Formulario «Nuestra pareja» */
.cp-form{display:flex;flex-direction:column;gap:.8rem}
.cp-form fieldset{border:1px solid var(--line);border-radius:var(--radius);padding:.6rem .9rem .8rem;margin:0}
.cp-form legend{font-weight:600;color:var(--ink);font-size:.95rem;padding:0 .3rem;width:auto;float:none;margin:0}
.cp-person label{display:flex;flex-direction:column;gap:.2rem;font-size:.85rem;color:var(--muted);margin:.35rem 0}
.cp-person input,.cp-person select{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.45rem .6rem;background:var(--card);color:var(--ink);font-size:1rem;min-height:40px}
.cp-colors{display:flex;gap:.45rem;flex-wrap:wrap;margin-top:.3rem}
#term-panel .cp-color{width:34px;height:34px;min-height:34px;padding:0;border-radius:50%;border:3px solid var(--card);box-shadow:0 0 0 1px var(--line)}
#term-panel .cp-color[aria-pressed="true"]{box-shadow:0 0 0 3px var(--ink)}
.cp-me .check{margin:.3rem 0}
/* Tarjeta «¿Quién usa este dispositivo?» */
.who-card{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1rem;background:var(--card);border:1px dashed var(--primary);border-radius:var(--radius);padding:.7rem 1rem;margin:0 0 1rem}
.who-card .meta{flex:1 1 220px}
/* Notas: nuestra (compartida) o privada */
.note-share{font-size:.8rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:.3rem .6rem;align-items:center}
.note-share.on{color:var(--success)}
.note-by{font-size:.78rem;color:var(--muted)}
.lens-bar{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;margin:.2rem 0 .4rem}
#notes-drawer .study-body .lens-bar button:not(.linklike):not(.q-opt):not(.chip){border-radius:50rem;padding:.3rem .8rem;min-height:34px;font-size:.82rem;background:var(--card);border:1px solid var(--line);color:var(--ink)}
#notes-drawer .study-body .lens-bar button[aria-pressed="true"]:not(.linklike):not(.q-opt):not(.chip){background:var(--primary);border-color:var(--primary);color:#fff}
.vw-side.prot{border-left-color:#1a7f5a}.vw-side.prot .eyebrow{color:#1a7f5a}
html[data-theme="dark"] .vw-side.prot .eyebrow{color:#5fd3a5}
.private-note{border-left:3px solid var(--muted)}
#notes-drawer .note-mode button{flex-direction:row;gap:.35rem}
/* Lectura ortodoxa del capítulo (Padres de la Iglesia) */
.orth-chapter{border-left:4px solid #b7791f;background:var(--card2);border-radius:var(--radius-sm);padding:.55rem .8rem;margin:.4rem 0 .8rem}
.orth-chapter .eyebrow{color:#9a6512}
html[data-theme="dark"] .orth-chapter .eyebrow{color:#e8b25c}
.orth-point{margin:.35rem 0}
.lens-chapter{border-left:4px solid #b7791f;background:var(--card2);border-radius:var(--radius-sm);padding:.55rem .8rem;margin:.4rem 0 .8rem}
.cat-chapter{border-left-color:#c03221}.cat-chapter .eyebrow{color:#c03221}
.prot-chapter{border-left-color:#1a7f5a}.prot-chapter .eyebrow{color:#1a7f5a}
html[data-theme="dark"] .cat-chapter .eyebrow{color:#ff8a7a}html[data-theme="dark"] .prot-chapter .eyebrow{color:#5fd3a5}
.plan-teach{margin:.8rem 0;border:1px solid var(--line);border-radius:var(--radius);padding:.5rem .8rem;background:var(--card)}
.plan-teach summary{cursor:pointer;font-weight:600;color:var(--ink)}
.plan-teach .vw-sides{margin:.6rem 0}
.teach-list{margin:.2rem 0;padding-left:1.1rem}.teach-list li{margin:.25rem 0}
/* Two24: bienvenida y «borrar todo» */
.welcome-verse{margin:.6rem 0 1rem;padding:.7rem 1rem;border-left:4px solid var(--primary);background:var(--card2);border-radius:var(--radius-sm);font-style:italic}
.welcome-verse small{display:block;font-style:normal;margin-top:.3rem;color:var(--muted,#6c757d)}
.welcome-lang{border:0;padding:0;margin:0 0 1rem}
.wipe summary{cursor:pointer;font-weight:600;color:var(--danger)}
.wipe label{display:block;margin:.6rem 0}
.wipe input{margin-left:.4rem}
/* ── Personalizar (personal.js) ── */
.verse{font-family:var(--read-font,var(--serif));line-height:var(--read-lh,1.85)}
.appearance-panel .look{border-top:1px solid var(--line);margin-top:.8rem;padding-top:.6rem}
.seg.wrap{flex-wrap:wrap}
.look-colors{display:flex;flex-wrap:wrap;gap:.45rem;margin:.2rem 0 .4rem}
.look-color{width:34px;height:34px;min-width:34px;border-radius:50%;border:2px solid var(--card);box-shadow:0 0 0 1px var(--line);padding:0}
.look-color[aria-checked="true"]{box-shadow:0 0 0 3px var(--ink)}
.look-more{margin-top:.7rem}
html[data-motion="calm"] *{animation-duration:.001s !important;transition-duration:.001s !important;scroll-behavior:auto !important}
.av.av-photo{object-fit:cover;padding:0;border:2px solid var(--card);box-shadow:0 0 0 2px var(--pa)}
.av.av-photo.p1{box-shadow:0 0 0 2px var(--pb)}
.who .chip-photo{width:22px;height:22px;border-radius:50%;object-fit:cover;margin-right:.35rem;vertical-align:middle}
.cp-photo{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin:.2rem 0 .6rem}
.cp-photo .av{width:56px;height:56px;font-size:1.3rem}
.file-btn{display:inline-flex;align-items:center;gap:.35rem;border:1px solid var(--line);border-radius:var(--radius-sm);padding:.45rem .8rem;cursor:pointer;min-height:44px;background:var(--card)}
.file-btn:focus-within{outline:3px solid rgba(var(--primary-rgb),.45)}
/* ── Recorrido guiado (tour.js) ── */
#tour{position:fixed;inset:0;z-index:2000}
#tour.tour-center{background:rgba(10,14,25,.55)}
#tour .tour-spot{position:fixed;border-radius:12px;box-shadow:0 0 0 9999px rgba(10,14,25,.55);transition:all .25s ease;pointer-events:none}
#tour .tour-card{position:fixed;background:var(--card);color:var(--text);border-radius:var(--radius);box-shadow:var(--shadow,0 10px 30px rgba(0,0,0,.25));padding:1rem 1.1rem}
#tour .tour-card h3{margin:.2rem 0 .4rem;color:var(--ink)}
#tour .tour-card .grow{flex:1}
.tour-dots{display:flex;gap:5px;margin:.3rem 0 .7rem}.tour-dots span{width:7px;height:7px;border-radius:50%;background:var(--line)}.tour-dots span.on{background:var(--primary)}
.tour-offer{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;background:var(--primary-soft);border-radius:var(--radius);padding:.8rem 1rem;margin:.8rem 0}
.tour-offer>svg{width:28px;height:28px;color:var(--primary);flex:none}
.tour-offer>div:first-of-type{flex:1;min-width:200px;display:flex;flex-direction:column}
/* ── Mensajes (messages.js) ── */
.msgs{list-style:none;padding:0;margin:0 0 1rem;display:flex;flex-direction:column;gap:.7rem;max-height:60vh;overflow-y:auto}
.msg{display:flex;align-items:flex-end;gap:.5rem;max-width:85%}
.msg.mine{align-self:flex-end;flex-direction:row-reverse}
.msg .msg-av{width:32px;height:32px;font-size:.85rem}
.msg-body{background:var(--card2);border-radius:16px 16px 16px 4px;padding:.55rem .8rem}
.msg.mine .msg-body{background:var(--primary-soft2);border-radius:16px 16px 4px 16px}
.msg-body p{margin:.15rem 0;white-space:pre-wrap;color:var(--ink)}
.msg-meta{font-size:.78rem;color:var(--muted)}
.msg-ref{display:block;text-align:left;border:1px solid var(--line);background:var(--card);border-radius:10px;padding:.4rem .6rem;margin-top:.35rem;font-size:.85rem;color:var(--primary);width:100%}
.msg-ref span{display:block;color:var(--text);font-style:italic;margin-top:.2rem}
.msg-del{font-size:.78rem}
.msg-empty{color:var(--muted);text-align:center;padding:1.5rem .5rem}
.msg-form textarea{width:100%;min-height:84px}
.msg-quick{margin-bottom:.5rem}
.msg-attach{font-size:.9rem;margin:.3rem 0}
.msg-badge{margin-left:auto;background:#d6336c;color:#fff;border-radius:999px;font-size:.72rem;font-weight:700;min-width:20px;height:20px;padding:0 6px;display:inline-grid;place-items:center}
@media (max-width:575px){.msg{max-width:95%}}
/* ── Pulido de botones nuevos (v1.19) ── */
.appearance-panel .look-colors{flex-wrap:nowrap;gap:.3rem;justify-content:space-between}
.appearance-panel .look-color{width:28px;height:28px;min-width:28px}
.appearance-panel .seg.look-fonts{display:grid;grid-template-columns:1fr 1fr;gap:3px}
.appearance-panel .seg.look-fonts button{font-size:1rem;line-height:1.2;padding:.5rem .4rem;white-space:nowrap}
.appearance-panel .look-more{display:flex;flex-direction:column;gap:.4rem;margin-top:.8rem;padding-top:.7rem;border-top:1px solid var(--line)}
.appearance-panel .look-link{display:flex;align-items:center;gap:.55rem;width:100%;min-height:44px;padding:.55rem .8rem;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink);font:inherit;font-weight:600;font-size:.92rem;text-align:left;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.appearance-panel .look-link svg{width:18px;height:18px;color:var(--primary);flex:none}
.appearance-panel .look-link:hover,.appearance-panel .look-link:focus-visible{background:var(--primary-soft);border-color:rgba(var(--primary-rgb),.35);color:var(--primary)}
.appearance-panel .look-reset{align-self:center;background:none;border:0;color:var(--muted);font:inherit;font-size:.85rem;padding:.5rem .8rem;min-height:44px;cursor:pointer;border-radius:999px}
.appearance-panel .look-reset:hover,.appearance-panel .look-reset:focus-visible{color:var(--primary);background:var(--primary-soft)}
.pill-ghost{background:none;border:1px solid transparent;color:var(--muted);font:inherit;font-size:.88rem;font-weight:600;padding:.45rem .9rem;min-height:44px;border-radius:999px;cursor:pointer;transition:background .15s,color .15s}
.pill-ghost:hover,.pill-ghost:focus-visible{background:var(--primary-soft);color:var(--primary)}
/* Foto de la pareja: el círculo es el botón, con una insignia de cámara */
.cp-photo{display:flex;align-items:center;gap:.9rem;margin:.3rem 0 .8rem}
.cp-photo-pick{position:relative;display:inline-block;cursor:pointer;border-radius:50%;flex:none}
.cp-photo-pick .av{width:72px;height:72px;font-size:1.6rem;transition:filter .15s}
.cp-photo-pick:hover .av{filter:brightness(.92)}
.cp-photo-pick:focus-within{outline:3px solid rgba(var(--primary-rgb),.45);outline-offset:3px}
.cp-photo-cam{position:absolute;right:-2px;bottom:-2px;width:28px;height:28px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;border:2px solid var(--card);box-shadow:0 2px 6px rgba(0,0,0,.18)}
.cp-photo-cam svg{width:14px;height:14px}
.cp-photo-actions{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem}
.cp-photo-hint{font-size:.85rem;color:var(--muted)}
.cp-photo-actions .pill-ghost{padding-left:0;min-height:36px}
/* Mensajes: «Borrar» discreto */
.msg-del{background:none;border:0;padding:.15rem 0;margin-top:.2rem;font:inherit;font-size:.78rem;color:var(--muted);cursor:pointer;min-height:24px}
.msg-del:hover,.msg-del:focus-visible{color:var(--danger,#c0392b);text-decoration:underline}
.tour-offer .pill-ghost{min-height:44px}
#main .pill-ghost,#term-panel .pill-ghost{background:none;border:1px solid transparent;box-shadow:none;color:var(--muted);font-weight:600}
#main .pill-ghost:hover,#term-panel .pill-ghost:hover,#main .pill-ghost:focus-visible,#term-panel .pill-ghost:focus-visible{background:var(--primary-soft);color:var(--primary)}
#term-panel .cp-photo-actions .pill-ghost{padding:.3rem .7rem .3rem 0;min-height:36px}
#term-panel .cp-photo-actions .pill-ghost:hover{padding-left:.7rem}
#main .msg-del{background:none;border:0;box-shadow:none;padding:.15rem 0;min-height:24px;font-size:.78rem;font-weight:500;color:var(--muted)}
#main .msg-del:hover,#main .msg-del:focus-visible{background:none;color:var(--danger,#c0392b);text-decoration:underline}
#main .msg-ref{display:block;text-align:left;white-space:normal;line-height:1.4;padding:.45rem .7rem;font-weight:600}
#main .msg-ref svg{width:15px;height:15px;vertical-align:-2px;margin-right:.25rem}
#main .msg-ref span{font-weight:400}
.appearance-panel .look .seg.wrap{display:grid;grid-template-columns:1fr 1fr;gap:3px}
.appearance-panel .look .seg.wrap button{white-space:nowrap}
#main .msg-form textarea{border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);padding:.75rem .9rem;font:inherit;resize:vertical;transition:border-color .15s,box-shadow .15s}
#main .msg-form textarea:focus{outline:none;border-color:rgba(var(--primary-rgb),.6);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.15)}
#main .msg-form [data-msg-addref]{background:none;border:1px dashed rgba(var(--primary-rgb),.45);color:var(--primary);border-radius:999px;padding:.4rem .9rem;font-weight:600;margin:.2rem 0 .5rem}
#main .msg-form [data-msg-addref]:hover{background:var(--primary-soft);text-decoration:none}
#main .msg-attach{display:inline-flex;align-items:center;gap:.4rem;background:var(--primary-soft);color:var(--primary);border-radius:999px;padding:.3rem .5rem .3rem .9rem;font-weight:600;margin:.2rem 0 .5rem}
#main .msg-attach [data-msg-unref]{min-height:32px;padding:.2rem .6rem;border-radius:999px;background:var(--card);text-decoration:none}

/* Logo del menú: el icono de Two24 */
.brand-mark.brand-img{width:40px;height:40px;background:none;padding:0;border-radius:0;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.12))}