/* Meu Púlpito · v2
   Identidad: azul marino #101827 · negro #080D16 · dorado #D6AD55 · blanco · gris claro #F1F3F6
   El dorado solo en detalles, botones principales e iconos seleccionados. */
:root{
  --navy:#101827;--black:#080D16;--gold:#D6AD55;--white:#FFFFFF;--gray:#F1F3F6;
  --bg:#F1F3F6;--surface:#FFFFFF;--fg:#101827;--muted:#4B5565;--faint:#6B7280;--line:#E3E6EC;--chip:#F1F3F6;
  --gold-ink:#8A6A1F;--gold-soft:#F6E7C3;--hero:#101827;--hero-fg:#FFFFFF;--hero-muted:#C4C9D4;--hero-line:transparent;
  --ok:#1D6B43;--okbg:#E7F3EC;--warn:#7A5A12;--warnbg:#FBF1DC;--danger:#B4412F;
  --shadow:0 10px 30px rgba(8,13,22,.10);
  --ui:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --head:'Manrope','Inter',system-ui,-apple-system,sans-serif;
  --read:'Literata',Georgia,'Times New Roman',serif;
  --r:18px;--nav:72px;
  color-scheme:light;
}
html[data-mode="dark"]{
  --bg:#080D16;--surface:#101827;--fg:#FFFFFF;--muted:#A7AFBD;--faint:#8D96A6;--line:#1C2638;--chip:#1C2638;
  --gold-ink:#D6AD55;--gold-soft:rgba(214,173,85,.22);--hero:#101827;--hero-line:rgba(214,173,85,.45);
  --ok:#7FD3A4;--okbg:rgba(127,211,164,.12);--warn:#E9C46A;--warnbg:rgba(214,173,85,.14);--danger:#F0806C;
  --shadow:0 10px 30px rgba(0,0,0,.4);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--ui);font-size:16px;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--bg);z-index:30}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer;padding:0}
a{color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
svg.i{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ---------- layout ---------- */
.view{min-height:100%;padding:calc(env(safe-area-inset-top,0px) + 20px) max(20px,env(safe-area-inset-right,0px)) calc(var(--nav) + env(safe-area-inset-bottom,0px) + 28px) max(20px,env(safe-area-inset-left,0px))}
.wrap{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:18px}
.view.enter{animation:fade .22s ease-out}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
h1.h{margin:0;font-size:28px;font-weight:800;letter-spacing:-.02em}
.row{display:flex;align-items:center;gap:10px}
.between{display:flex;align-items:center;justify-content:space-between;gap:10px}
.sub{font-size:13px;color:var(--muted);font-weight:500}
.sect{font-size:17px;font-weight:800}
.lnk{font-size:13px;font-weight:700;color:var(--gold-ink)}
.lbl{font-family:var(--head);font-size:13px;font-weight:700;letter-spacing:0;color:var(--muted)}

/* ---------- nav ---------- */
.nav{position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--surface);border-top:1px solid var(--line);padding:0 max(8px,env(safe-area-inset-right,0px)) env(safe-area-inset-bottom,0px) max(8px,env(safe-area-inset-left,0px))}
.nav .in{max-width:720px;margin:0 auto;height:var(--nav);display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:11px;font-weight:600;color:var(--faint)}
.nav button[aria-current="page"]{color:var(--fg);font-weight:800}
.nav button[aria-current="page"] svg{stroke:var(--gold);stroke-width:2.1}

/* ---------- components ---------- */
.card{background:var(--surface);border-radius:var(--r);padding:16px}
.search{display:flex;align-items:center;gap:10px;background:var(--surface);border-radius:16px;padding:0 16px;height:50px;color:var(--faint)}
.search input{border:0;outline:none;background:transparent;font-size:16px;color:var(--fg);flex:1;min-width:0}
.btn{height:46px;padding:0 18px;border-radius:23px;font-weight:800;font-size:15px;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.btn.gold{background:var(--gold);color:#101827}
.btn.dark{background:var(--navy);color:#fff}
html[data-mode="dark"] .btn.dark{background:#1C2638}
.btn.ghost{background:var(--surface);box-shadow:0 0 0 1px var(--line) inset;color:var(--fg)}
.btn.danger{background:var(--danger);color:#fff}
.btn.sm{height:38px;padding:0 14px;font-size:13px}
.btn.block{width:100%}
.iconbtn{width:44px;height:44px;border-radius:22px;display:inline-flex;align-items:center;justify-content:center;color:var(--fg)}
.iconbtn.bg{background:var(--surface)}
.iconbtn.gold{background:var(--gold);color:#101827}
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -20px;padding:0 20px}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;height:36px;padding:0 14px;border-radius:18px;background:var(--surface);box-shadow:0 0 0 1px var(--line) inset;font-size:13px;font-weight:600;color:var(--fg);display:inline-flex;align-items:center;gap:6px}
.chip[aria-pressed="true"]{background:var(--fg);color:var(--bg);box-shadow:none;font-weight:700}
.chip.cat[aria-pressed="true"]{background:var(--surface);color:var(--fg);box-shadow:0 0 0 1.5px var(--gold) inset}
.tag{font-size:12px;font-weight:700;padding:4px 9px;border-radius:8px;background:var(--chip);color:var(--fg);display:inline-flex;align-items:center;gap:4px}
.tag.ok{background:var(--okbg);color:var(--ok)}
.tag.warn{background:var(--warnbg);color:var(--warn)}
.tag.lang{background:none;box-shadow:0 0 0 1px var(--line) inset;color:var(--muted)}
.star{color:var(--faint)}
.star.on{color:var(--gold)}
.star.on svg{fill:var(--gold);stroke:var(--gold)}
.serif{font-family:var(--read)}
.empty{text-align:center;padding:40px 12px;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:10px}
.empty h3{margin:0;font-family:var(--read);font-size:20px;color:var(--fg)}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--nav) + env(safe-area-inset-bottom,0px) + 16px);background:var(--fg);color:var(--bg);padding:11px 18px;border-radius:22px;font-size:14px;font-weight:700;z-index:90;max-width:calc(100% - 32px);text-align:center;box-shadow:var(--shadow)}
.sync{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);font-weight:600}
.dot{width:7px;height:7px;border-radius:4px;background:var(--faint)}
.dot.ok{background:#3C9A6B}

/* ---------- home ---------- */
.logo{width:44px;height:44px;border-radius:12px;object-fit:cover;flex:none}
.hello b{display:block;font-size:20px;font-weight:800;letter-spacing:-.01em}
.hero{background:var(--hero);color:var(--hero-fg);border-radius:24px;padding:22px;display:flex;justify-content:space-between;gap:14px;align-items:flex-start;text-align:left;width:100%;box-shadow:0 0 0 1px var(--hero-line) inset}
.hero .k{font-family:var(--head);font-size:13px;font-weight:700;letter-spacing:.02em;color:var(--gold)}
.hero .t{font-size:26px;font-weight:800;letter-spacing:-.02em;margin:6px 0}
.hero .d{font-size:14px;color:var(--hero-muted);line-height:1.45}
.hero .plus{width:56px;height:56px;border-radius:28px;background:var(--gold);color:#101827;display:flex;align-items:center;justify-content:center;flex:none}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.stat{background:var(--surface);border-radius:var(--r);padding:14px;display:flex;flex-direction:column;gap:4px;text-align:left}
.stat b{font-size:24px;font-weight:800;font-variant-numeric:tabular-nums}
.stat span{font-size:12px;color:var(--muted);font-weight:600}
.banner{background:var(--surface);border-radius:var(--r);padding:14px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;font-size:14px;line-height:1.4}
.banner .tx{flex:1 1 200px;min-width:0}

/* ---------- sermon list ---------- */
.list{display:flex;flex-direction:column;gap:10px}
.sm-card{background:var(--surface);border-radius:20px;padding:16px;display:flex;flex-direction:column;gap:10px}
.sm-card .top{display:flex;gap:12px;align-items:flex-start}
.sm-card .open{flex:1;min-width:0;text-align:left;display:flex;flex-direction:column;gap:5px}
.sm-card .ti{font-family:var(--read);font-size:18px;font-weight:700;line-height:1.25;text-wrap:balance}
.sm-card .me{font-size:13px;color:var(--muted)}
.sm-card .tags{display:flex;gap:6px;flex-wrap:wrap}
.sm-card .hit{font-size:13.5px;color:var(--muted);line-height:1.4}
.sm-card .hit mark{background:var(--gold-soft);color:var(--fg);border-radius:3px;padding:0 2px}
.mini{background:var(--surface);border-radius:var(--r);padding:16px;display:flex;gap:14px;align-items:center;text-align:left;width:100%}
.mini .ti{font-family:var(--read);font-size:17px;font-weight:700;line-height:1.25}
.datebox{width:52px;height:56px;border-radius:14px;background:var(--chip);display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none}
.datebox span{font-size:11px;font-weight:800;text-transform:uppercase;color:var(--muted)}
.datebox b{font-size:20px;font-weight:800}
.datebox.gold{background:var(--gold);color:#101827}.datebox.gold span{color:#101827}

/* ---------- sheet ---------- */
.ov{position:fixed;inset:0;z-index:60;background:rgba(8,13,22,.5);display:flex;align-items:flex-end;justify-content:center;animation:fadein .18s}
@keyframes fadein{from{opacity:0}}
.sheet{width:100%;max-width:640px;max-height:88%;overflow-y:auto;background:var(--surface);color:var(--fg);border-radius:24px 24px 0 0;padding:10px max(20px,env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;gap:14px;animation:up .22s ease-out}
@keyframes up{from{transform:translateY(24px)}}
.sheet .grab{width:40px;height:5px;border-radius:3px;background:var(--line);margin:0 auto 4px}
.sheet h3{margin:0;font-size:19px;font-weight:800}
.acts{display:flex;flex-direction:column}
.act{display:flex;align-items:center;gap:14px;min-height:54px;font-size:16px;font-weight:600;text-align:left;border-bottom:1px solid var(--line)}
.act:last-child{border-bottom:0}
.act.red{color:var(--danger)}
.fld{display:flex;flex-direction:column;gap:6px}
.fld label,.fld .lb{font-family:var(--head);font-size:13px;font-weight:700;letter-spacing:0;color:var(--muted)}
.inp{height:48px;border-radius:14px;border:1px solid var(--line);background:var(--bg);padding:0 14px;font-size:16px;color:var(--fg);width:100%;min-width:0}
textarea.inp{height:auto;padding:12px 14px;resize:vertical;line-height:1.5}
select.inp{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.seg{display:flex;background:var(--bg);border-radius:12px;padding:3px;gap:2px}
.seg button{flex:1;height:38px;border-radius:10px;font-size:14px;font-weight:700;color:var(--muted);padding:0 10px;white-space:nowrap}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--fg);box-shadow:0 1px 3px rgba(0,0,0,.12)}
html[data-mode="dark"] .seg button[aria-pressed="true"]{background:#fff;color:#101827}

/* ---------- editor ---------- */
.ed-view{min-height:100vh;min-height:100dvh;background:var(--surface);display:flex;flex-direction:column}
.ed-top{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:var(--surface);border-bottom:1px solid var(--line);padding:calc(env(safe-area-inset-top,0px)*0 + 8px) max(8px,env(safe-area-inset-right,0px)) 8px max(8px,env(safe-area-inset-left,0px))}
.ed-top .in{max-width:760px;margin:0 auto;display:flex;align-items:center;gap:2px}
.saved{display:flex;align-items:center;gap:5px;font-size:13px;font-weight:600;color:var(--muted);flex:1;min-width:0;white-space:nowrap;overflow:hidden}
.doc p.ph:empty{min-height:1.65em}
@media (max-width:420px){.saved .st{display:none}}
.saved svg{width:15px;height:15px;stroke:var(--ok);stroke-width:2.4}
.ed-meta{max-width:760px;margin:0 auto;width:100%;padding:14px 22px 0;display:flex;gap:8px;flex-wrap:wrap}
.ed-meta .tag{height:30px;padding:0 10px;font-size:12.5px}
.ed-meta button.tag.add{background:none;box-shadow:0 0 0 1px var(--line) inset;color:var(--muted)}
.doc{max-width:760px;margin:0 auto;width:100%;padding:14px 22px 200px;outline:none;font-family:var(--read);font-size:18px;line-height:1.65;color:var(--fg);caret-color:var(--gold);word-wrap:break-word;-webkit-user-select:text;user-select:text}
.doc>*{margin:0 0 .7em}
.doc h1{font-size:28px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin-bottom:.55em}
.doc h2{font-size:21px;line-height:1.3;font-weight:700;margin-top:1.1em}
.doc h3{font-family:var(--ui);font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;margin-top:1.2em}
.doc .lg{font-size:1.2em}
.doc mark{background:var(--gold-soft);color:inherit;border-radius:3px;padding:0 2px}
.doc blockquote{background:#F7F4EC;border-radius:14px;padding:12px 14px;font-style:italic}
html[data-mode="dark"] .doc blockquote{background:#1C2638}
.doc blockquote[data-ref]::before{content:attr(data-ref);display:block;font-family:var(--ui);font-style:normal;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:2px}
.doc .il{color:var(--muted);font-style:italic}
.doc .nt{font-family:var(--ui);font-size:14px;color:var(--muted);border:1px dashed var(--line);border-radius:10px;padding:8px 10px}
.doc ol,.doc ul{padding-left:1.4em}
.doc h1:empty::before{content:attr(data-ph);color:var(--faint)}
.doc p.ph:empty::before{content:attr(data-ph);color:var(--faint)}
.tb{position:fixed;left:0;right:0;bottom:0;z-index:25;background:var(--bg);border-top:1px solid var(--line);padding:8px max(10px,env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(10px,env(safe-area-inset-left,0px));transition:bottom .05s}
.tb .in{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:8px}
.tb .fmt{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.tb .fmt::-webkit-scrollbar{display:none}
.tb .fmt button{flex:none;width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;color:var(--fg)}
.tb .fmt button[aria-pressed="true"]{background:var(--surface);box-shadow:0 0 0 1.5px var(--gold) inset}
.tb .big{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.tb .big button{height:44px;border-radius:12px;font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;gap:8px}
.tb .big .v{background:var(--navy);color:#fff}
html[data-mode="dark"] .tb .big .v{background:#1C2638}
.tb .big .v svg{stroke:var(--gold)}
.tb .big .p{background:var(--surface);box-shadow:0 0 0 1px var(--line) inset}

/* ---------- bible ---------- */
.bsel{display:flex;gap:8px}
.bsel select{height:46px;border-radius:14px;border:0;padding:0 36px 0 14px;font-size:15px;font-weight:700}
.bsel .book{flex:1;background-color:var(--navy);color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23D6AD55' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}
html[data-mode="dark"] .bsel .book{background-color:#1C2638}
.bsel .chap{width:120px;background-color:var(--surface);color:var(--fg)}
.verses{background:var(--surface);border-radius:22px;padding:14px 12px;font-family:var(--read);font-size:17.5px;line-height:1.6;display:flex;flex-direction:column;gap:2px}
.vs{display:block;text-align:left;padding:6px 8px;border-radius:10px;width:100%}
.vs sup{font-family:var(--ui);font-size:11px;font-weight:800;color:var(--gold-ink);margin-right:5px}
.vs[aria-pressed="true"]{background:var(--gold-soft)}
.vbar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--nav) + env(safe-area-inset-bottom,0px) + 12px);width:calc(100% - 32px);max-width:620px;z-index:22;background:#101827;color:#fff;border-radius:20px;padding:8px 8px 8px 16px;display:flex;align-items:center;gap:4px;box-shadow:0 12px 30px rgba(8,13,22,.3)}
.vbar .ref{flex:1;min-width:0;font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vbar .iconbtn{color:#fff}
.res{display:flex;flex-direction:column;gap:8px}
.res button{background:var(--surface);border-radius:14px;padding:12px 14px;text-align:left;display:flex;flex-direction:column;gap:4px}
.res b{font-size:12px;font-weight:800;color:var(--gold-ink);letter-spacing:.04em}
.res span{font-family:var(--read);font-size:15.5px;line-height:1.5}
.res mark{background:var(--gold-soft);color:inherit}

/* ---------- agenda ---------- */
.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.day{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 0;border-radius:14px;background:var(--surface)}
.day span{font-size:11px;font-weight:700;color:var(--muted)}
.day b{font-size:17px;font-weight:800}
.day i{width:5px;height:5px;border-radius:3px}
.day.has i{background:var(--gold)}
.day.today{background:var(--fg);color:var(--bg)}
.day.today span{color:var(--bg);opacity:.75}
.ev{background:var(--surface);border-radius:20px;padding:16px;display:flex;flex-direction:column;gap:12px}
.ev .hd{display:flex;gap:14px;align-items:center;text-align:left;width:100%}
.ev .link{display:flex;align-items:center;gap:10px;background:var(--bg);border-radius:14px;padding:12px;text-align:left;width:100%}
.ev .link span{flex:1;font-family:var(--read);font-size:15px;font-weight:700}
.ev .pick{height:44px;border-radius:14px;border:1px dashed var(--line);color:var(--gold-ink);font-size:14px;font-weight:700}

/* ---------- profile ---------- */
.pgrp{background:var(--surface);border-radius:20px;padding:4px 16px}
.prow{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:58px;border-bottom:1px solid var(--line);padding:8px 0;flex-wrap:wrap}
.prow:last-child{border-bottom:0}
.prow .k{font-size:15px;font-weight:600}
.prow .s{display:block;font-size:12px;color:var(--muted);font-weight:500;margin-top:2px}
.soon{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.soon div{background:var(--surface);border-radius:18px;padding:14px;display:flex;flex-direction:column;gap:10px;font-size:14px;font-weight:700;line-height:1.3}
.soon svg{stroke:var(--gold)}
.avatar{width:52px;height:52px;border-radius:26px;background:var(--gold);color:#101827;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:800;flex:none}
.catlist{display:flex;gap:8px;flex-wrap:wrap}
.catlist .tag{height:32px;padding:0 6px 0 10px;font-size:13px}
.catlist .tag button{width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:var(--muted)}

/* ---------- login ---------- */
.login{max-width:420px;margin:0 auto;padding:calc(env(safe-area-inset-top,0px) + 56px) 20px 40px;display:flex;flex-direction:column;gap:14px}
.login .logo{width:96px;height:96px;border-radius:24px}
.login h2{margin:6px 0 0;font-family:var(--read);font-size:26px;line-height:1.2;text-wrap:balance}
.err{color:var(--danger);font-size:14px;margin:0}

/* ---------- pregar ---------- */
.pg{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;background:var(--pbg);color:var(--pfg);font-family:var(--ui)}
.pg.negro{--pbg:#080D16;--pfg:#FFFFFF;--pmut:#A7AFBD;--pchip:#141C2B;--c-base:#7FB2F0;--c-intro:#6FD19C;--c-point:#D6AD55;--c-dev:#B79CF2;--c-concl:#F08AA8;--c-sub:#A8B0AA;--pmark:rgba(214,173,85,.3)}
.pg.azul{--pbg:#101827;--pfg:#FFFFFF;--pmut:#B3BAC7;--pchip:#1C2638;--c-base:#8DBDF5;--c-intro:#7AD9A6;--c-point:#D6AD55;--c-dev:#C2AAF5;--c-concl:#F49AB4;--c-sub:#B0B7C3;--pmark:rgba(214,173,85,.32)}
.pg.sepia{--pbg:#F4ECD8;--pfg:#3B2F1E;--pmut:#6E5E45;--pchip:#E9DDC2;--c-base:#2A5FA8;--c-intro:#2F6B3F;--c-point:#8A5A12;--c-dev:#6B4BB0;--c-concl:#A0304F;--c-sub:#6E5E45;--pmark:#EBD39B}
.pg.claro{--pbg:#FFFFFF;--pfg:#101827;--pmut:#4B5565;--pchip:#F1F3F6;--c-base:#2A5FA8;--c-intro:#1F7A4D;--c-point:#8A6A1F;--c-dev:#6B4BB0;--c-concl:#B0335A;--c-sub:#6D736E;--pmark:#F6E7C3}
.pg-top{display:flex;align-items:center;gap:6px;padding:calc(env(safe-area-inset-top,0px) + 6px) max(10px,env(safe-area-inset-right,0px)) 8px max(10px,env(safe-area-inset-left,0px));transition:opacity .25s}
.pg-top .iconbtn{color:var(--pmut)}
.pg-timer{height:40px;padding:0 14px;border-radius:20px;background:var(--pchip);font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:8px;white-space:nowrap}
.pg-timer svg{width:15px;height:15px;stroke:var(--gold);stroke-width:2.4}
.pg-timer small{font-size:13px;font-weight:600;color:var(--pmut)}
.pg-timer.warn{background:#F2C94C;color:#1A1406}.pg-timer.warn small{color:#1A1406}.pg-timer.warn svg{stroke:#1A1406}
.pg-timer.over{background:#E2603F;color:#fff}.pg-timer.over small{color:#fff}.pg-timer.over svg{stroke:#fff}
.pg-where{flex:1;text-align:right;font-size:13px;font-weight:700;color:var(--pmut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.pg-prog{height:3px;background:var(--pchip);margin:0 max(16px,env(safe-area-inset-left,0px));border-radius:2px;overflow:hidden}
.pg-prog i{display:block;height:100%;width:0;background:var(--gold)}
.pg-scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;position:relative;overscroll-behavior:contain}
.pg-text{max-width:min(100%,calc(780px + 2*var(--mx,24px)));margin:0 auto;padding:26px max(var(--mx,24px),env(safe-area-inset-right,0px)) 45vh max(var(--mx,24px),env(safe-area-inset-left,0px));font-family:var(--read);font-size:var(--fs,30px);line-height:var(--lh,1.5)}
.pg-text>*{margin:0 0 var(--ps,.75em)}
.pg-text .ref-top{font-family:var(--ui);font-size:.45em;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--c-base);margin-bottom:.3em}
.pg-text h1{font-size:1.15em;line-height:1.2;margin-bottom:.8em}
.pg-text h2{font-size:1em;line-height:1.25;font-weight:700;display:flex;gap:.45em;margin-top:1.4em}
.pg-text h2 .n{color:var(--c-point)}
.pg-text h2.sec{font-family:var(--ui);font-size:.5em;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--k,var(--c-sub));padding-top:.8em;border-top:1px solid var(--pchip);display:block}
.pg-text h3{font-family:var(--ui);font-size:.5em;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--c-sub);margin-top:1.4em}
.pg-text .s-intro{--k:var(--c-intro)}.pg-text .s-dev{--k:var(--c-dev)}.pg-text .s-concl{--k:var(--c-concl)}.pg-text .s-base{--k:var(--c-base)}
.pg-text .vq{background:var(--pchip);border-radius:16px;padding:.6em .75em;display:flex;flex-direction:column;gap:.25em}
.pg-text .vq button.r{text-align:left;background:none;padding:0;color:var(--c-base)}
.pg-text .vq .cv{opacity:.7;font-weight:700}
.pg-text .vq .r{font-family:var(--ui);font-size:.42em;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--c-base)}
.pg-text .vq .x{font-style:italic;font-size:.82em}
.pg-text .vq .src{font-family:var(--ui);font-size:.36em;color:var(--pmut)}
.pg-text mark{background:var(--pmark);color:inherit;border-radius:4px;padding:0 .1em}
.pg-text .lg{font-size:1.15em}
.pg-text .il{color:var(--pmut);font-size:.9em;font-style:italic}
.pg-text .nt{font-family:var(--ui);font-size:.5em;line-height:1.45;color:var(--pmut);border:1px dashed var(--pchip);border-radius:10px;padding:.5em .8em}
.pg-text .nt::before{content:attr(data-l);display:block;font-size:.8em;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.pg-text ol,.pg-text ul{padding-left:1.2em}
.pg-text.outline>p:not(.nt),.pg-text.outline>ol,.pg-text.outline>ul{display:none}
.pg-bot{display:flex;gap:10px;padding:12px max(16px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));max-width:820px;margin:0 auto;width:100%;transition:opacity .25s}
.pg-bot button{height:58px;border-radius:18px;font-weight:800;font-size:15.5px;display:flex;align-items:center;justify-content:center;gap:6px}
.pg-bot .prev{width:104px;background:var(--pchip);color:var(--pfg)}
.pg-bot .scr{width:58px;flex:none;background:var(--pchip);color:var(--pfg);position:relative}
.pg-bot .scr.on{background:var(--pfg);color:var(--pbg)}
.pg-bot .scr small{position:absolute;top:6px;right:8px;font-size:11px;font-weight:800}
.pg-dim{position:fixed;inset:0;background:#000;opacity:0;pointer-events:none;z-index:2;transition:opacity .2s}
.pg .ov{z-index:3}
.pg-bot .next{flex:1;background:var(--gold);color:#101827}
.pg.calm .pg-top,.pg.calm .pg-bot{opacity:.15}
.pg.calm.tw .pg-top{opacity:1}
.pg .sheet{background:var(--pbg);color:var(--pfg)}
.pg .sheet .seg{background:var(--pchip)}
.pg .sheet .inp{background:var(--pchip);border-color:var(--pchip);color:var(--pfg)}
.rng{width:100%;accent-color:#D6AD55}

/* ---------- print ---------- */
#printArea{display:none}
@media print{
  @page{margin:18mm 16mm}
  body{background:#fff!important;color:#101827}
  body>*:not(#printArea){display:none!important}
  body::before{display:none}
  #printArea{display:block;font-family:var(--read);font-size:12.5pt;line-height:1.55;color:#101827}
  #printArea .ph{display:flex;align-items:center;justify-content:space-between;border-bottom:1.5pt solid #D6AD55;padding-bottom:8pt;margin-bottom:16pt;font-family:var(--ui);font-size:9pt;color:#4B5565}
  #printArea .ph img{width:34pt;height:34pt;border-radius:8pt}
  #printArea h1{font-size:22pt;line-height:1.2;margin:0 0 6pt}
  #printArea .ref{font-family:var(--ui);font-size:9.5pt;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#8A6A1F;margin-bottom:14pt}
  #printArea h2{font-size:14.5pt;margin:16pt 0 6pt;break-after:avoid}
  #printArea h3{font-family:var(--ui);font-size:9.5pt;letter-spacing:.1em;text-transform:uppercase;margin:14pt 0 4pt;break-after:avoid}
  #printArea blockquote{margin:6pt 0 10pt;padding:8pt 12pt;background:#F7F4EC;border-radius:6pt;font-style:italic;break-inside:avoid}
  #printArea blockquote[data-ref]::before{content:attr(data-ref);display:block;font-family:var(--ui);font-style:normal;font-size:8.5pt;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#8A6A1F}
  #printArea mark{background:#F6E7C3}
  #printArea p{margin:0 0 7pt}
  #printArea .nt{display:none}
  #printArea .pf{margin-top:24pt;border-top:.5pt solid #E3E6EC;padding-top:6pt;font-family:var(--ui);font-size:8pt;color:#6B7280}
}

/* ---------- wide screens ---------- */
@media (min-width:900px){
  .view{padding-top:32px}
  .stats{gap:14px}
}

@media (orientation:landscape) and (max-height:500px){.pg-top{padding-top:4px;padding-bottom:4px}.pg-bot{padding-top:6px;padding-bottom:calc(6px + env(safe-area-inset-bottom,0px))}.pg-bot button{height:46px}}
.pg-text[data-al=justify]{hyphens:auto;-webkit-hyphens:auto}
.pg-text[data-al=justify] h1,.pg-text[data-al=justify] h2,.pg-text[data-al=justify] h3,.pg-text[data-al=justify] .vq{text-align:left;hyphens:manual}
.pg-text[data-al=center] h2{justify-content:center}

/* ---------- Biblia al lado del editor ---------- */
.bp{position:fixed;left:0;right:0;bottom:0;height:58vh;height:58dvh;z-index:26;background:var(--surface);border-top:1px solid var(--line);box-shadow:0 -10px 30px rgba(8,13,22,.18);border-radius:22px 22px 0 0;
  padding:12px max(14px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(14px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;gap:8px;animation:up .2s ease-out}
.bp-head{display:flex;align-items:center;gap:8px}
.bp-head b{flex:1;font-size:17px;font-weight:800}
.bp .inp{height:42px}
.bp .bsel select{height:42px}
.bp-body{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}
.bp .verses{background:var(--bg)}
.with-bp .tb{display:none}
.with-bp .doc{padding-bottom:62vh}
@media (min-width:900px){
  .bp{top:0;left:auto;width:400px;height:auto;border-radius:0;border-top:0;border-left:1px solid var(--line);box-shadow:none;padding-top:calc(env(safe-area-inset-top,0px) + 14px)}
  .with-bp{padding-right:400px}
  .with-bp .tb{display:block;right:400px}
  .with-bp .doc{padding-bottom:200px}
}

/* ---------- bloqueo ---------- */
.lock{position:fixed;inset:0;z-index:100;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px max(24px,env(safe-area-inset-right,0px)) 24px max(24px,env(safe-area-inset-left,0px));max-width:100%}
.lock>*{width:100%;max-width:340px}
.lock .logo{width:84px;height:84px;border-radius:22px}
.lock h2{margin:0;font-size:22px;font-weight:800;text-align:center}
.lock .lnk{text-align:center}
.inp.pin{text-align:center;font-size:28px;letter-spacing:.5em;height:58px;font-weight:800}

/* ---------- PDF ---------- */
@media print{
  #printArea .pinfo{font-family:var(--ui);font-size:9.5pt;line-height:1.5;background:#F1F3F6;border-radius:6pt;padding:8pt 10pt;margin:0 0 14pt}
  #printArea .pnotes{margin-top:18pt;font-family:var(--ui);font-size:10pt;break-inside:avoid}
  #printArea .pnotes i{display:block;border-bottom:.5pt solid #C9CED8;height:22pt}
  #printArea.pm-study{line-height:1.8}
  #printArea.pm-study .nt{display:block;font-family:var(--ui);font-size:9.5pt;color:#4B5565;border:.5pt dashed #C9CED8;border-radius:4pt;padding:4pt 6pt}
  #printArea.pm-preach{font-size:17pt;line-height:1.7}
  #printArea.pm-preach h1{font-size:28pt}
  #printArea.pm-preach h2{font-size:20pt;margin-top:22pt;padding-top:6pt;border-top:1pt solid #D6AD55}
  #printArea.pm-preach blockquote{font-size:15pt}
  #printArea.pm-preach mark{background:none;font-weight:700;text-decoration:underline;text-decoration-color:#D6AD55;text-decoration-thickness:2pt}
  #printArea.pm-preach .nt{display:block;font-family:var(--ui);font-size:11pt;color:#4B5565}
  #printArea.pm-points h2{font-size:16pt}
  #printArea.pm-points blockquote{font-size:11pt}
}
.bsel select{appearance:none;-webkit-appearance:none;background-repeat:no-repeat;background-position:right 12px center;background-size:14px}
.bsel .chap{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}
.mini .ti,.sm-card .ti{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ---------- lectura cómoda ---------- */
.doc h2[data-n]::before{content:attr(data-n) " ";color:var(--gold-ink)}
.doc h2.imp::after{content:" ★";color:var(--gold)}
.pg-text h2.imp{color:var(--pfg)}
.pg-text h2 .star-i{width:.7em;height:.7em;fill:var(--gold);stroke:var(--gold);vertical-align:.05em}
button.pg-where{background:none;padding:6px 4px;color:var(--pmut);font:inherit;font-size:13px;font-weight:700}
.pg.clean .pg-bot,.pg.clean .pg-prog{opacity:0;pointer-events:none;transition:opacity .25s}
.pg.clean .pg-top{pointer-events:none}
.pg.clean .pg-top>*{opacity:0;transition:opacity .25s}
.pg.clean .pg-top>[data-act=pgClose]{opacity:.55;pointer-events:auto}
.pg.clean.show .pg-top>*,.pg.clean.tw .pg-top>*{opacity:1}
.pg.clean.show .pg-top,.pg.clean.show .pg-bot,.pg.clean.show .pg-prog,.pg.clean.tw .pg-top{opacity:1;pointer-events:auto}
.pg.clean .pg-scroll{touch-action:pan-y}

/* iOS: la barra inferior queda fija; solo el contenido se desplaza */
html.tabs,html.tabs body{overflow:hidden;height:100%;overscroll-behavior:none}
html.tabs #app{position:fixed;inset:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}
.bsel{flex-wrap:wrap}.bsel .book{flex:1 1 100%}.bsel .chap{flex:1 1 0;width:auto;min-width:0}
.avbtn{position:relative;padding:0;border:0;cursor:pointer;overflow:visible}
.avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.avcam{position:absolute;right:-3px;bottom:-3px;width:22px;height:22px;border-radius:11px;background:var(--navy);border:2px solid var(--surface);display:flex;align-items:center;justify-content:center}
.avcam svg{width:12px;height:12px;stroke:#fff}
.iconbtn.hasph{padding:0;overflow:hidden}.iconbtn.hasph img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.linkbtn{background:none;border:0;padding:4px 0 0;color:var(--gold-ink);font:inherit;font-size:13px;font-weight:700;text-align:left;align-self:flex-start;cursor:pointer}

/* ---------- v3 · Inicio y tarjetas ---------- */
.hero{background:linear-gradient(135deg,#E4C277 0%,#D6AD55 55%,#C49A42 100%);color:#101827;box-shadow:0 14px 34px rgba(214,173,85,.22);align-items:center;padding:22px 22px 22px 24px}
.hero .k{color:rgba(16,24,39,.7)}
.hero .t{font-size:27px;margin:4px 0 6px}
.hero .d{color:rgba(16,24,39,.78)}
.hero .plus{width:58px;height:58px;border-radius:29px;background:#101827;color:#D6AD55;box-shadow:0 6px 16px rgba(16,24,39,.25)}
.hero .plus svg{stroke-width:2.4}
.hero:active{transform:scale(.99)}
.stats{background:var(--surface);border-radius:var(--r);gap:0;padding:4px 0}
.stat{background:none;border-radius:0;padding:10px 16px;gap:2px}
.stat+.stat{border-left:1px solid var(--line)}
.stat b{font-size:21px}
.mini .ref,.sm-card .ref,.favc .ref{font-size:13px;font-weight:700;color:var(--gold-ink);letter-spacing:.01em}
.mini .mt{font-size:12.5px;color:var(--faint);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.mini .mt .ok{color:var(--ok);font-weight:700}.mini .mt .warn{color:var(--warn);font-weight:700}
.mini .chev{color:var(--faint);display:flex}.mini .chev svg{width:18px;height:18px}
.mini .ti,.sm-card .ti{-webkit-line-clamp:2}
.favrow{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 20px;margin:0 -20px;padding:0 20px 4px;scrollbar-width:none}
.favrow::-webkit-scrollbar{display:none}
.favc{flex:0 0 min(64%,240px);scroll-snap-align:start;background:var(--surface);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:6px;text-align:left;min-height:150px;box-shadow:0 0 0 1px var(--gold-soft) inset}
.favc .st{color:var(--gold);display:flex}.favc .st svg{width:16px;height:16px;fill:var(--gold);stroke:var(--gold)}
.favc .ti{font-family:var(--read);font-size:16px;font-weight:700;line-height:1.25;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.favc .go{margin-top:auto;padding-top:6px;display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--fg)}
.favc .go svg{width:16px;height:16px;stroke:var(--gold)}
.sm-card{gap:8px;padding:16px 16px 14px}
.sm-card .open{gap:4px}
.sm-card .ti{font-size:18.5px}
.sm-card .pv{font-family:var(--read);font-size:14.5px;line-height:1.5;color:var(--muted);text-align:left;padding:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sm-card .ft{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:10px;border-top:1px solid var(--line);flex-wrap:wrap}
.sm-card .dt{font-size:12.5px;color:var(--faint);font-weight:600}
.sm-card .ft .tag{font-size:12px}
@media (min-width:760px){.list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.favrow{margin:0;padding:0 0 4px}}
@media (min-width:1100px){.list{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Pregar limpio: anterior/siguiente quedan discretos (sin fondo) para avanzar sin mostrar todo */
.pg.clean:not(.show) .pg-bot{opacity:1;pointer-events:auto}
.pg.clean:not(.show) .pg-bot button{background:transparent!important;color:var(--pmut)!important;opacity:.55;font-weight:700}
.pg.clean:not(.show) .pg-bot .scr{visibility:hidden}
.pg.clean:not(.show) .pg-bot .next{justify-content:flex-end}
.tb .sty{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.tb .sty[hidden]{display:none}
.tb .sty button{height:44px;border-radius:12px;background:var(--surface);box-shadow:0 0 0 1px var(--line) inset;color:var(--fg);font-size:13.5px;font-weight:700}
.tb .sty .s-h2{font-family:var(--read);font-size:16px;font-weight:700}
.tb .sty .s-h3{font-family:var(--read);font-size:14.5px;font-weight:700;color:var(--muted)}
.tb .sty .s-p{font-family:var(--read);font-weight:400}
.tb .sty .s-lg{font-family:var(--read);font-size:17px;font-weight:500}
.tb .sty button[aria-pressed="true"]{box-shadow:0 0 0 1.5px var(--gold) inset;background:var(--gold-soft)}
.tb .fmt #tbH[aria-expanded="true"]{background:var(--surface);box-shadow:0 0 0 1.5px var(--gold) inset}
.pwbox{position:relative}.pwbox .inp{padding-right:52px;width:100%}
.pwbox .iconbtn{position:absolute;right:4px;top:50%;transform:translateY(-50%);color:var(--faint)}
.pwbox .iconbtn[aria-pressed="true"]{color:var(--gold-ink)}
.login .okmark{width:64px;height:64px;border-radius:32px;background:var(--okbg);color:var(--ok);display:flex;align-items:center;justify-content:center}
.login .okmark svg{width:30px;height:30px;stroke-width:2.4}
.crop{position:relative;width:min(100%,340px);aspect-ratio:1;margin:4px auto 0;overflow:hidden;border-radius:20px;background:#000;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}
.crop img{position:absolute;max-width:none;pointer-events:none;-webkit-user-drag:none}
.crop-mask{position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 999px rgba(8,13,22,.62);outline:2px solid rgba(214,173,85,.9);outline-offset:-2px;pointer-events:none}
.crop-z{display:flex;align-items:center;gap:10px;color:var(--faint)}.crop-z .rng{flex:1}.crop-z svg{width:18px;height:18px;flex:none}
/* ---------- Diccionario Strong ---------- */
button.ow{display:inline;padding:0 1px;margin:0;border-radius:6px;font:inherit;color:inherit;background:none;border-bottom:1px dotted var(--gold);cursor:pointer}
button.ow:active,button.ow:hover{background:var(--gold-soft)}
.sd-head{display:flex;align-items:center;gap:10px}
.sd-num{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:13px;background:var(--navy);color:#D6AD55;font-size:13px;font-weight:800;letter-spacing:.03em}
html[data-mode="dark"] .sd-num{background:#1C2638}
.sd-num.sm{height:22px;padding:0 8px;font-size:12px;vertical-align:2px}
.sd-lemma{font-family:var(--read);font-size:34px;font-weight:600;line-height:1.2}
.sd-tr{font-size:16px;font-weight:700;color:var(--gold-ink)}
.sd-box{background:var(--chip);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:4px}
.sd-es{display:flex;gap:6px;flex-wrap:wrap}
.sd-p{margin:0;font-family:var(--read);font-size:16px;line-height:1.55}
.sref{display:inline;padding:0;font-weight:800}
.res em{font-style:normal;color:var(--gold-ink);font-weight:700}
.sd-en summary{cursor:pointer;color:var(--faint);font-size:13px;font-weight:700;padding:4px 0}
.sd-en .sd-p{font-size:14.5px;margin-top:6px}
.sd-name{margin:0;font-family:var(--read);font-size:26px;line-height:1.25}
.tag.eref{border:0;cursor:pointer;font:inherit;font-size:13px;font-weight:700}
.seg.sm button{height:30px;padding:0 12px;font-size:12.5px}
.sd-lemma.sm{font-size:26px}
.sd-box.po{gap:6px}
.res .pres span em{color:var(--gold-ink);font-weight:700;font-style:normal}
button.prow.plink{width:100%;background:none;border:0;text-align:left;font:inherit;color:inherit;cursor:pointer}
button.prow.plink>svg{width:18px;height:18px;color:var(--faint);flex:none}
/* Panel del administrador */
.adm-list{display:flex;flex-direction:column;gap:8px}
.adm-row{display:flex;gap:10px;align-items:center;background:var(--chip);border-radius:14px;padding:10px 12px}
.adm-row b{font-size:14.5px}
.adm-seg{flex:none}
.adm-seg button[aria-pressed=true][data-b="1"]{background:var(--danger);color:#fff;box-shadow:none}

/* ---------- identidad tipográfica (v32): Manrope en títulos, botones y menús · Inter en textos · Literata en la lectura ---------- */
h1,h2,h3,h4,h5,.h,.sect,.btn,.chip,.nav button,.seg button,.act,.tag,.lnk,.hero .t,.sd-num,.stat b,.hello b,.sheet h3,.dx-tt,.dx-h2,.dx-sec h4,.dx-mini,.sm-card .ti,.mini .ti{font-family:var(--head)}
body{font-feature-settings:"cv11","ss01";letter-spacing:-.003em}
h1.h{font-weight:800;letter-spacing:-.025em}
.sub,.res small{color:var(--muted)}
.btn{font-weight:700;letter-spacing:-.005em}
.nav button{font-weight:600;letter-spacing:0}
.nav button[aria-current="page"]{font-weight:700}

/* ---------- diccionarios ---------- */
.dx-host{display:flex;flex-direction:column;gap:16px}
.sheet.tall{height:92%;max-height:92%}
@media (min-width:760px){.sheet.tall{max-width:760px;border-radius:24px 24px 0 0}}
.dx-tiles{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:640px){.dx-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}.dx-tile{flex-direction:column;flex-wrap:nowrap;align-items:flex-start;min-height:210px;padding:20px}.dx-tile .dx-tt{flex:none;min-width:0}.dx-tile .dx-td{flex:none;padding-right:0}}
.dx-tile{position:relative;display:flex;align-items:center;gap:14px;text-align:left;background:var(--surface);border-radius:20px;padding:18px;box-shadow:0 0 0 1px var(--line) inset;flex-wrap:wrap}
.dx-tile:active{transform:scale(.99)}
.dx-tt{font-size:18px;font-weight:800;letter-spacing:-.01em;flex:1;min-width:150px}
.dx-td{font-size:14px;line-height:1.45;color:var(--muted);flex-basis:100%;padding-right:26px}
.dx-go{position:absolute;right:16px;top:20px;color:var(--gold-ink)}
.dx-gl{width:48px;height:48px;border-radius:14px;background:var(--navy);color:#D6AD55;display:inline-flex;align-items:center;justify-content:center;flex:none;font-family:var(--read);font-size:26px;font-weight:600}
.dx-gl.sm{width:38px;height:38px;border-radius:12px;font-size:20px}
.dx-gl svg{width:24px;height:24px}
.dx-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sheet .dx-mini,.sheet .dx-tile{box-shadow:0 0 0 1px var(--line) inset}
.dx-mini{display:flex;align-items:center;gap:8px;background:var(--surface);border-radius:16px;padding:14px;font-size:14px;font-weight:700}
.dx-mini span{flex:1;text-align:left}.dx-mini b{color:var(--gold-ink)}.dx-mini svg{width:19px;height:19px;color:var(--gold-ink)}
.dx-hc{display:inline-flex;align-items:center;background:var(--surface);border-radius:10px;box-shadow:0 0 0 1px var(--line) inset;font-size:13.5px;font-weight:600}
.dx-hc button{padding:7px 4px 7px 10px;display:inline-flex;gap:6px;align-items:center}
.dx-hc button+button{padding:7px 8px 7px 2px;color:var(--faint)}.dx-hc svg{width:15px;height:15px}
.dx-hc small{font-size:10.5px;font-weight:800;color:var(--gold-ink)}
.dx-back{display:inline-flex;align-items:center;gap:4px;align-self:flex-start;font-weight:700;color:var(--muted)}
.dx-back svg{width:18px;height:18px}
.dx-h2{margin:0;font-size:22px;font-weight:800;letter-spacing:-.015em}
.dx-res .res button{gap:3px}
.dx-res .res b{font-family:var(--head);font-weight:700;letter-spacing:0;color:var(--muted);font-size:12.5px}
.dx-ti{font-family:var(--head)!important;font-size:17px!important;font-weight:700;color:var(--fg)}
.dx-ti small{font-weight:600;color:var(--muted);font-size:13px}
.res small{font-size:12.5px;font-family:var(--ui)}
.dx-lrow{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.dx-lem{font-family:var(--read);font-size:21px!important;font-weight:600;color:var(--fg)}
.dx-lem[dir="rtl"]{font-size:23px!important}
.dx-trl{font-family:var(--ui)!important;font-size:14px!important;font-weight:600;color:var(--gold-ink)}
.dx-srcl{font-size:12px;margin:0}
.dx-row{display:flex;align-items:center;gap:6px;background:var(--surface);border-radius:14px;padding-right:6px}
.dx-row>button:first-child{flex:1;min-width:0}
.dx-row .iconbtn{color:var(--faint)}
.dx-entry{display:flex;flex-direction:column;gap:14px;padding-bottom:12px}
.dx-acts{display:flex;gap:8px;flex-wrap:wrap}
.dx-acts .btn svg{width:18px;height:18px}
.dx-fav[aria-pressed="true"]{box-shadow:0 0 0 1.5px var(--gold) inset;color:var(--gold-ink)}
.dx-fav[aria-pressed="true"] svg{fill:var(--gold);stroke:var(--gold)}
.dx-sec{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);padding-top:14px}
.dx-sec h4{margin:0;font-size:15px;font-weight:700;color:var(--fg)}
.dx-sec h5{margin:8px 0 0;font-family:var(--head);font-size:14px;font-weight:700;color:var(--gold-ink)}
.dx-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.dx-big{margin:0;font-family:var(--read);font-size:22px;font-weight:600;line-height:1.3}
.dx-grid .sd-p{font-family:var(--ui);font-size:15px}
.dx-pr{font-family:var(--ui);font-weight:600;letter-spacing:.02em}
.dx-pre{white-space:pre-line}
.dx-sm{margin:0;font-size:12.5px;line-height:1.45;color:var(--muted)}
.dx-na{margin:0;font-size:14px;color:var(--faint);font-style:italic}
.dx-src{margin:4px 0 0;font-size:12px;line-height:1.45;color:var(--faint)}
.dx-senses{display:flex;flex-direction:column;gap:6px}
.dx-sn{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--chip);border-radius:12px;padding:8px 10px}
.dx-snw{font-family:var(--read);font-size:16px;font-weight:600}
.dx-snc{font-size:12px;font-weight:800;color:var(--gold-ink)}
.dx-snr{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto}
.dx-snr .tag{background:var(--surface);font-size:12px}
.dx-ex{display:flex;flex-direction:column;gap:10px}
.dx-exi{display:flex;flex-direction:column;gap:4px;align-items:flex-start;border-left:3px solid var(--gold);padding-left:12px}
.dx-ext{font-style:italic;font-size:15.5px}
.dx-ailbl{display:flex;gap:6px;align-items:center;margin:0;font-size:12.5px;font-weight:700;color:var(--gold-ink)}
.dx-ailbl svg{width:16px;height:16px}
.dx-oth summary{list-style:none;cursor:pointer}.dx-oth summary::-webkit-details-marker{display:none}
.dx-oth summary h4::after{content:" ▾";color:var(--faint)}
.dx-po{text-align:left;width:100%}
.sd-lemma[dir="rtl"]{text-align:right}
.res .sd-num{font-family:var(--head)}

.login h2{font-family:var(--head);font-weight:800;letter-spacing:-.02em}
.brand{align-self:center;width:min(250px,64vw);margin:4px auto 6px}
.brand img{display:block;width:100%;height:auto}
.brand .b-d{display:none}
html[data-mode="dark"] .brand .b-d{display:block}html[data-mode="dark"] .brand .b-l{display:none}
.login h2,.login>p.sub{text-align:center;align-self:center}
.topbrand{gap:12px}
.mark{flex:none;height:50px;display:flex;align-items:center}.mark img{height:50px;width:auto}
.mark .b-d{display:none}html[data-mode="dark"] .mark .b-d{display:block}html[data-mode="dark"] .mark .b-l{display:none}
.wordmark b{display:block;font-family:var(--head);font-size:21px;font-weight:800;letter-spacing:-.01em;line-height:1.1}
.wordmark .w1{color:var(--fg)}.wordmark .w2{color:var(--gold-ink)}
html[data-mode="dark"] .wordmark .w2{color:var(--gold)}
.wordmark small{display:block;margin-top:3px;font-family:var(--head);font-size:10px;font-weight:700;letter-spacing:.12em;color:var(--muted);white-space:nowrap}
.hello{margin-top:-4px}.hello .sub{font-size:14px}
.cu-card{display:flex;align-items:center;gap:14px;background:var(--surface);border-radius:20px;padding:16px;width:100%;box-shadow:0 0 0 1px var(--line) inset}
.cu-card b{display:block;font-family:var(--head);font-size:17px;font-weight:800}.cu-card span span{display:block;font-size:13.5px;color:var(--muted);line-height:1.4;margin-top:2px}
.dx-go2{color:var(--gold-ink)}
.cu-search{height:54px;box-shadow:0 0 0 1.5px var(--gold) inset}
.cu-sect{margin:6px 0 -6px}
.cu-list{display:flex;flex-direction:column;background:var(--surface);border-radius:18px;overflow:hidden}
.cu-item{display:flex;align-items:center;gap:10px;padding:14px 14px 14px 16px;text-align:left;border-top:1px solid var(--line)}
.cu-item:first-child{border-top:0}.cu-item>svg{color:var(--faint);width:18px;height:18px}
.cu-q{flex:1;font-size:15.5px;font-weight:500;line-height:1.35}
.cu-st svg{width:16px;height:16px;fill:var(--gold);stroke:var(--gold)}
#cuRes{display:flex;flex-direction:column;gap:14px}
.cu-h{font-family:var(--head);font-size:22px!important;line-height:1.25;letter-spacing:-.01em}
.cu-ans{background:var(--navy);color:#fff;border-radius:18px;padding:14px 16px;display:flex;flex-direction:column;gap:4px}
.cu-ans .lbl{color:#D6AD55}.cu-ans p{margin:0;font-family:var(--read);font-size:19px;font-weight:600;line-height:1.4}
.cu-more{background:var(--gold-soft);border-top:0;border-radius:16px;padding:12px 14px}
.cu-ok{display:flex;align-items:center;gap:6px;margin:0;font-size:12.5px;font-weight:700;color:var(--ok)}.cu-ok svg{width:16px;height:16px}
.cu-ans p{font-size:17.5px}
html[data-mode="dark"] .cu-ans{background:var(--black);box-shadow:0 0 0 1px rgba(214,173,85,.45) inset}
.cu-q b{display:block;font-family:var(--head);font-weight:700}.cu-q small{display:block;font-size:13px;color:var(--muted);margin-top:2px}
/* barra de abajo: íconos centrados en la franja (menos espacio vacío bajo los íconos) */
:root{--navpb:max(6px,calc(env(safe-area-inset-bottom,0px) - 16px))}
.nav{padding-top:6px;padding-bottom:var(--navpb)}
.nav .in{height:58px}
.view{padding-bottom:calc(64px + var(--navpb) + 28px)}
.toast{bottom:calc(64px + var(--navpb) + 16px)}
.vbar{bottom:calc(64px + var(--navpb) + 12px)}
/* v39: íconos centrados en toda la barra, incluida la franja del iPhone */
.nav{padding-top:0;padding-bottom:0}
.nav .in{height:calc(60px + env(safe-area-inset-bottom,0px));align-items:center;padding-bottom:calc(env(safe-area-inset-bottom,0px) * .35)}
.nav .in button{height:56px}
:root{--navpb:env(safe-area-inset-bottom,0px)}
.view{padding-bottom:calc(60px + var(--navpb) + 28px)}
.toast{bottom:calc(60px + var(--navpb) + 16px)}
.vbar{bottom:calc(60px + var(--navpb) + 12px)}
.pg-lang{height:34px;min-width:44px;padding:0 10px;border-radius:17px;border:1.5px solid var(--c-base,#D6AD55);color:var(--pfg);font-family:var(--head);font-weight:800;font-size:13px;letter-spacing:.06em}
/* el botón de idioma queda siempre visible (discreto) como el de salir */
.pg.clean .pg-top>#pgLang{opacity:.6;pointer-events:auto}
.pg.clean.show .pg-top>#pgLang{opacity:1}
.pl-wrap{display:flex;flex-direction:column;gap:14px}
.pl-t{font-family:var(--head);font-size:24px!important;font-weight:800;letter-spacing:-.02em}
.pl-why{margin:0;background:var(--gold-soft);border-radius:14px;padding:12px 14px;font-size:14.5px;line-height:1.45}
.pl-testn{display:flex;gap:8px;align-items:center;margin:0;color:var(--ok);font-weight:700;font-size:13.5px}.pl-testn svg{width:18px;height:18px;flex:none}
.pl-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:700px){.pl-grid{grid-template-columns:1fr 1fr}}
.pl-card{position:relative;display:flex;flex-direction:column;gap:8px;background:var(--bg);border-radius:20px;padding:18px;box-shadow:0 0 0 1px var(--line) inset}
.pl-card.best{box-shadow:0 0 0 2px var(--gold) inset;padding-top:30px}
.pl-badge{position:absolute;top:-1px;left:16px;right:16px;transform:translateY(-50%);background:var(--gold);color:#101827;font-family:var(--head);font-size:11px;font-weight:800;letter-spacing:.05em;text-align:center;border-radius:12px;padding:6px 8px}
.pl-h{display:flex;align-items:center;gap:8px}.pl-h b{font-family:var(--head);font-size:18px;font-weight:800;flex:1}
.pl-price{font-family:var(--head);font-size:28px;font-weight:800;letter-spacing:-.02em}.pl-price small{font-size:14px;font-weight:600;color:var(--muted)}
.pl-save{align-self:flex-start;font-size:12.5px;font-weight:800;color:var(--ok);background:var(--okbg);border-radius:8px;padding:4px 8px}
.pl-f{list-style:none;margin:2px 0 4px;padding:0;display:flex;flex-direction:column;gap:6px}
.pl-f li{display:flex;gap:8px;font-size:14px;line-height:1.35}.pl-f svg{width:17px;height:17px;color:var(--gold-ink);flex:none;margin-top:1px}
.cu-lock{font-family:var(--head);font-size:10.5px;font-weight:800;letter-spacing:.04em;color:var(--gold-ink);border:1px solid var(--gold);border-radius:8px;padding:2px 6px}
.sub-grid{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:14px}.sub-grid>span{color:var(--muted)}.sub-grid b{font-weight:700}
.sub-pay{display:flex;justify-content:space-between;font-size:13.5px;border-top:1px solid var(--line);padding-top:6px}
.ac-row{display:grid;grid-template-columns:90px 1fr 1fr;gap:8px;align-items:center}.ac-row.ac3{grid-template-columns:1fr 1fr 1fr}.ac-h span{font-size:12px;color:var(--muted);font-weight:700}
a.btn{text-decoration:none}
.brand .tagline{display:flex;align-items:center;gap:8px;margin-top:6px}
.brand .tagline i{flex:1;height:2.5px;border-radius:2px;background:linear-gradient(90deg,transparent,#D6AD55)}.brand .tagline i:last-child{background:linear-gradient(90deg,#D6AD55,transparent)}
.brand .tagline span{font-family:var(--head);font-weight:800;font-size:clamp(11px,3.4vw,14px);letter-spacing:.07em;color:var(--fg);white-space:nowrap}
.brand .tagline{justify-content:center}.brand .tagline i{flex:0 0 20px}
/* editor: la fila de categoría, idioma, detalles y modelos queda fija bajo la barra de arriba */
.ed-meta{position:sticky;top:calc(env(safe-area-inset-top,0px) + var(--edTop,61px));z-index:9;background:var(--surface);padding-bottom:10px;max-width:none;padding-left:max(22px,calc((100% - 716px)/2));padding-right:max(22px,calc((100% - 716px)/2))}
/* que el cursor nunca quede escondido detrás de las barras fijas */
html:has(.ed-view){scroll-padding-top:calc(env(safe-area-inset-top,0px) + var(--edTop,61px) + 56px + 12px)}
.doc>*{scroll-margin-top:calc(env(safe-area-inset-top,0px) + var(--edTop,61px) + 56px + 12px)}
/* iPhone: la barra de arriba es "sticky" con el área de la cámara; el editor empieza debajo de esa área
   para que la barra y la fila de botones no tapen el título */
.ed-view{padding-top:env(safe-area-inset-top,0px)}
/* aviso de cuentas esperando */
.banner.adp{display:flex;align-items:center;gap:12px;text-align:left;width:100%;box-shadow:0 0 0 1.5px var(--gold) inset}
.banner.adp .tx{flex:1}.adp-n{min-width:34px;height:34px;border-radius:17px;background:var(--gold);color:#101827;font-family:var(--head);font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}
/* bienvenida */
.ob{display:flex;flex-direction:column;gap:18px;padding:6px 0 4px;min-height:330px}
#obIn{flex:1;display:flex;flex-direction:column;gap:10px;align-items:center;text-align:center;justify-content:center}
.ob-ic{width:64px;height:64px;border-radius:20px;background:var(--navy);color:#D6AD55;display:flex;align-items:center;justify-content:center}.ob-ic svg{width:30px;height:30px}
.ob-t{font-family:var(--head);font-size:22px!important;font-weight:800}
.ob-d{margin:0;font-size:15.5px;line-height:1.55;color:var(--muted);max-width:420px}
.ob-dots{display:flex;gap:6px;justify-content:center}.ob-dots i{width:7px;height:7px;border-radius:4px;background:var(--line);transition:all .2s}.ob-dots i.on{width:22px;background:var(--gold)}
/* barra del editor: todos los botones caben en la pantalla (micrófono y diccionarios a la vista) */
.tb .fmt{gap:0;justify-content:space-between}
.tb .fmt button{flex:1 1 0;width:auto;min-width:30px;max-width:48px}
.tb .fmt button svg{width:21px;height:21px}
.ob-ic{box-shadow:0 0 0 1.5px rgba(214,173,85,.55) inset}
.foot-brand{display:flex;flex-direction:column;align-items:center;gap:4px;padding:18px 0 6px;text-align:center}
.foot-brand .mark.sm,.foot-brand .mark.sm img{height:40px}
.foot-brand b{font-family:var(--head);font-size:17px;font-weight:800;letter-spacing:.01em}
.foot-brand .w1{color:var(--fg)}.foot-brand .w2{color:var(--gold-ink)}html[data-mode="dark"] .foot-brand .w2{color:var(--gold)}
.foot-brand small{font-family:var(--head);font-size:9.5px;font-weight:700;letter-spacing:.14em;color:var(--muted)}
.foot-brand .fb-v{margin-top:6px;font-size:11.5px;color:var(--faint)}
.foot-brand .mark .b-d{display:none}html[data-mode="dark"] .foot-brand .mark .b-d{display:block}html[data-mode="dark"] .foot-brand .mark .b-l{display:none}
.subhead{display:flex;align-items:center;gap:6px;margin-left:-10px}.subhead .h{font-size:26px}
html.subp .view{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 32px)}
.ig-link{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:7px 14px;border-radius:18px;box-shadow:0 0 0 1px var(--line) inset;color:var(--fg);text-decoration:none;font-family:var(--head);font-weight:700;font-size:13.5px}
.ig-link svg{width:18px;height:18px;color:var(--gold-ink)}html[data-mode="dark"] .ig-link svg{color:var(--gold)}
.ob-logo,.ob-logo img{height:96px}.ob-logo .b-d{display:none}html[data-mode="dark"] .ob-logo .b-d{display:block}html[data-mode="dark"] .ob-logo .b-l{display:none}
.banner.pv{box-shadow:0 0 0 1.5px var(--gold) inset}.banner.pv.warn{box-shadow:0 0 0 1.5px var(--danger) inset}
.inst{display:flex;flex-direction:column;align-items:center;gap:14px;padding:4px 0}
.inst-st{list-style:none;margin:4px 0;padding:0;display:flex;flex-direction:column;gap:12px;align-self:stretch}
.inst-st li{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.5}
.inst-st .n{width:28px;height:28px;border-radius:9px;background:var(--navy);color:#D6AD55;display:flex;align-items:center;justify-content:center;font-family:var(--head);font-weight:800;flex:none}
.inst-btn svg{width:19px;height:19px}.banner.inst-bn{box-shadow:0 0 0 1px var(--line) inset}
.res-n{margin:2px 2px -2px;font-size:13px;color:var(--muted);font-weight:500}
/* recordatorio de la próxima predicación */
.nextp{background:var(--surface);border-radius:var(--r);padding:14px 14px 12px;display:flex;flex-direction:column;gap:10px;box-shadow:inset 3px 0 0 var(--gold)}
.nextp .sn-hd{display:flex;align-items:center;gap:7px;font-family:var(--head);font-weight:700;font-size:12.5px;letter-spacing:.02em;color:var(--gold-ink)}
.nextp .sn-hd svg{width:16px;height:16px}
.nextp .sn-tx{display:flex;flex-direction:column;gap:3px;min-width:0}
.nextp .sn-tx b{font-size:15px}
.nextp .sn-tx span{font-size:14px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nextp .sn-tx span.serif{color:var(--fg);font-size:15.5px}
.nextp .row{display:flex;gap:8px;justify-content:flex-end}
.nextp .row .btn{flex:0 0 auto}
.nextp .row .btn.gold svg{stroke:currentColor}
.nextp.now{box-shadow:inset 3px 0 0 var(--gold),0 0 0 1px color-mix(in srgb,var(--gold) 35%,transparent)}
/* panel del sitio */
.adm-site{display:grid;grid-template-columns:1fr 1fr;gap:8px}.adm-site .btn{padding:0 10px;font-size:14px}
.as-t{display:flex;flex-direction:column;gap:8px;background:var(--chip);border-radius:14px;padding:12px}
.as-t .inp{background:var(--surface)}
.as-on{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--muted)}.as-on input{width:18px;height:18px}
.av-ch{display:flex;align-items:flex-end;gap:3px;height:120px;padding:8px 0 0;border-bottom:1px solid var(--line)}
.av-c{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;min-width:0}
.av-c i{display:block;width:100%;max-width:28px;height:var(--h);min-height:2px;background:var(--gold);border-radius:4px 4px 0 0}
.av-c span{font-size:10.5px;color:var(--muted);margin-bottom:-18px;height:14px}
.av-ch:has(.av-c span){margin-bottom:16px}
.av-b{display:grid;grid-template-columns:96px 1fr 34px;gap:10px;align-items:center;font-size:13.5px}
.av-b i{display:block;height:8px;border-radius:4px;background:linear-gradient(90deg,var(--gold) var(--w),var(--chip) var(--w))}
.av-b b{font-family:var(--head);font-size:13.5px;min-width:24px;text-align:right}
.as-t .iconbtn.sm{width:34px;height:34px}.as-t .iconbtn.sm svg{width:18px;height:18px}
.sheet.ns>*,.sheet.ns #avBody>*{flex-shrink:0}#avBody{display:flex;flex-direction:column;gap:12px}
button.prow.plink{flex-wrap:nowrap}button.prow.plink>span{flex:1;min-width:0}
.plink .k svg{vertical-align:-3px}
details.credits{text-align:center}details.credits summary{list-style:none;cursor:pointer;font-size:12.5px;font-weight:600;color:var(--muted);padding:6px}details.credits summary::-webkit-details-marker{display:none}
.dx-allres:empty{display:none}.dx-allres{display:flex;flex-direction:column;gap:16px}
.dx-allsec{display:flex;flex-direction:column;gap:8px}
.dx-allsec .res>*:nth-child(n+4){display:none}
.dx-allsec .empty{padding:10px 0}
/* búsqueda en toda la Biblia (Curiosidades) */
.bq-card{background:var(--surface);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:8px;box-shadow:inset 3px 0 0 var(--gold)}
.bq-h{margin:0;font-family:var(--head);font-weight:800;font-size:17px;line-height:1.35;color:var(--fg)}
.bq-s{margin:0;font-size:13.5px;color:var(--muted);line-height:1.45}
.bq-note{margin:0;font-size:12px;color:var(--faint);line-height:1.45}
.bq-v .cu-q small{display:block;font-family:var(--read);font-size:15px;line-height:1.5;color:var(--fg);margin-top:3px;white-space:normal}
.bq-v mark{background:var(--gold-soft);color:inherit;border-radius:3px;padding:0 2px}
/* novedades y ayuda */
.nw-list{display:flex;flex-direction:column;gap:14px}
.nw-i{display:flex;gap:12px;align-items:flex-start}.nw-i>span:last-child{display:flex;flex-direction:column;gap:3px;font-size:14.5px;line-height:1.45;color:var(--muted)}.nw-i b{color:var(--fg);font-family:var(--head);font-size:15.5px}
.nw-dot{width:28px;height:28px;border-radius:50%;background:var(--gold-soft);color:var(--gold-ink);display:grid;place-items:center;flex:none}.nw-dot svg{width:16px;height:16px}
.hp-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.hp-i{border-bottom:1px solid var(--line)}
.hp-i summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:15px 2px;font-family:var(--head);font-weight:700;font-size:15.5px;cursor:pointer}
.hp-i summary::-webkit-details-marker{display:none}.hp-i summary svg{width:18px;height:18px;color:var(--faint);transition:transform .2s;flex:none}.hp-i[open] summary svg{transform:rotate(180deg)}
.hp-i p{margin:0 2px 16px;font-size:15px;line-height:1.6;color:var(--muted)}