/* Truth Teller Bible — Simple mode, high contrast, modern look, split study, words, tags, cards, topics */

/* High Contrast */
:root[data-theme="contrast"]{
  --bg:#000000; --surface:#0a0a0a; --surface-2:#161616; --ink:#ffffff; --ink-2:#ffffff; --muted:#f3f3f3;
  --verse-num:#ffe44d; --leather:#ffe44d;
  --line:#ffffff; --line-strong:#ffe44d; --accent:#ffe44d; --accent-ink:#000; --accent-soft:#241c00;
  --red:#ff6b6b; --red-ink:#000; --hl:#2a2400; --focus:#ffe44d;
  --band:linear-gradient(135deg,#1a1600 0%,#000 100%); --band-ink:#fff;
  --shadow:none;
  color-scheme: dark;
}
:root[data-theme="contrast"] .btn,
:root[data-theme="contrast"] .tile,
:root[data-theme="contrast"] .card,
:root[data-theme="contrast"] input,
:root[data-theme="contrast"] textarea,
:root[data-theme="contrast"] .nav a{
  border-width:2px;
}
:root[data-theme="contrast"] :focus-visible{outline:4px solid var(--focus);outline-offset:3px}
:root[data-theme="contrast"] .verse.listening{background:#3a3200;box-shadow:inset 6px 0 0 #ffe44d,0 0 0 2px #ffe44d}

/* Modern look (UI only; Scripture stays serif) */
html[data-look="modern"]{
  --sans: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --radius:20px;
}
html[data-look="modern"] body{letter-spacing:.01em}
html[data-look="modern"] .topbar{
  background:color-mix(in srgb,var(--bg) 86%,transparent);
  backdrop-filter:blur(16px);
  border-bottom:0;
  box-shadow:0 1px 0 color-mix(in srgb,var(--line) 70%,transparent);
}
html[data-look="modern"] .brand-name{font-family:var(--sans);font-weight:650;letter-spacing:-.02em}
html[data-look="modern"] .brand-name b{letter-spacing:-.02em}
html[data-look="modern"] .card{border:0;box-shadow:0 8px 28px color-mix(in srgb,var(--ink) 8%,transparent);padding:1.25rem 1.3rem}
html[data-look="modern"] .tile{border:0;background:var(--surface);box-shadow:0 4px 16px color-mix(in srgb,var(--ink) 6%,transparent);padding:1rem 1.05rem;border-radius:16px}
html[data-look="modern"] .btn{border-radius:14px;border-width:0;background:var(--surface-2);padding:.65rem 1.1rem}
html[data-look="modern"] .btn.primary{background:var(--accent)}
html[data-look="modern"] .eyebrow{letter-spacing:.08em;text-transform:uppercase;font-weight:650}
html[data-look="modern"] .scripture,
html[data-look="modern"] .focus-verse,
html[data-look="modern"] .votd blockquote,
html[data-look="modern"] .mem-text{font-family:var(--serif)}
html[data-look="modern"] .hero-logo{border-radius:24px}
html[data-look="modern"] .nav a{border-radius:14px}

/* Reader zoom control */
.reader-tools{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center;margin:.55rem 0 .2rem}
.reader-tools .zoom-ctl{display:inline-flex;align-items:center;gap:0;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:var(--surface)}
.reader-tools .zoom-ctl button{
  width:44px;height:44px;min-width:44px;border:0;background:transparent;color:var(--ink);cursor:pointer;
  font-family:var(--serif);font-weight:700;line-height:1
}
.reader-tools .zoom-ctl button:hover{background:var(--surface-2)}
.reader-tools .zoom-ctl #reader-font-label,
.reader-tools .zoom-val{min-width:3.2rem;text-align:center;font-size:.85rem;color:var(--muted);padding:0 .2rem}
.reader-tools .tool-toggle[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent)}

/* Simple mode */
html[data-simple] .nav a{display:none}
html[data-simple] .nav a[data-nav="read"],
html[data-simple] .nav a[data-nav="search"],
html[data-simple] .nav a[data-nav="saved"]{
  display:flex;align-items:center;justify-content:center;
  min-height:56px;font-size:1.05rem;font-weight:700;padding:.7rem .4rem
}
html[data-simple] .btn,
html[data-simple] .picker-btn,
html[data-simple] .searchbar input,
html[data-simple] .composer textarea,
html[data-simple] .icon-btn{
  min-height:56px;
}
html[data-simple] .icon-btn{width:56px;min-width:56px}
html[data-simple] .btn.small{min-height:56px;padding:.7rem 1rem;font-size:1rem}
html[data-simple] .top-actions{margin-left:auto}
html[data-simple] .nav{gap:.4rem}
@media (max-width:640px){
  html[data-simple] .nav{padding:.4rem .5rem calc(.45rem + env(safe-area-inset-bottom))}
  html[data-simple] .nav a{flex:1}
  html[data-simple] main{padding-bottom:8rem}
  html[data-simple] .toast{bottom:calc(5.4rem + env(safe-area-inset-bottom))}
}
html[data-simple] .coming,
html[data-simple] [data-hide-simple]{display:none !important}
.simple-home{display:flex;flex-direction:column;gap:.8rem;margin:1rem 0}
.simple-home a.simple-btn{
  display:flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:64px;font-size:1.25rem;font-weight:700;border-radius:16px;
  background:var(--accent);color:var(--accent-ink);text-decoration:none;border:0
}
.simple-home a.simple-btn.secondary{background:var(--surface);color:var(--ink);border:2px solid var(--line)}

/* First-run welcome */
#first-run{border:1px solid var(--line);border-radius:20px;background:var(--surface);color:var(--ink);padding:1.3rem 1.3rem 1.2rem;width:min(440px,94vw)}
#first-run::backdrop{background:rgba(0,0,0,.55)}
#first-run h2{margin:.2rem 0 .5rem}
#first-run .choice{display:flex;flex-direction:column;gap:.7rem;margin:1rem 0 .2rem}
#first-run .choice button{min-height:64px;width:100%;text-align:left;padding:.9rem 1rem;border-radius:14px;border:1px solid var(--line);background:var(--bg);color:var(--ink);cursor:pointer;font:inherit}
#first-run .choice button strong{display:block;font-size:1.15rem}
#first-run .choice button span{display:block;color:var(--muted);font-size:.92rem;margin-top:.2rem}
#first-run .choice button.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}

/* Tappable Strong's words */
.scripture .w{
  font:inherit;color:inherit;background:transparent;border:0;padding:0;margin:0;
  cursor:pointer;border-radius:3px;line-inherit:inherit;
  text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--accent) 45%,transparent);
  text-decoration-thickness:1px;text-underline-offset:3px
}
.scripture .w:hover,.scripture .w:focus-visible{background:var(--accent-soft)}
.scripture .w[data-s=""]{text-decoration:none;cursor:inherit}
html[data-words="off"] .scripture .w{text-decoration:none;cursor:inherit;background:transparent;pointer-events:none}
#word-pop{
  position:fixed;z-index:50;max-width:min(360px,calc(100vw - 1.5rem));
  background:var(--surface);color:var(--ink);border:1px solid var(--line-strong);
  border-radius:14px;box-shadow:var(--shadow);padding:.85rem 1rem;line-height:1.45
}
#word-pop[hidden]{display:none !important}
#word-pop .wp-word{font-family:var(--serif);font-size:1.15rem;margin:0 0 .2rem}
#word-pop .wp-num{font-weight:700;color:var(--accent);font-family:var(--sans)}
#word-pop .wp-lemma{font-size:1.05rem;margin:.15rem 0}
#word-pop .wp-def{margin:.35rem 0 .5rem}
#word-pop .wp-src{font-size:.75rem;color:var(--muted);margin:0}
#word-pop .wp-close{float:right;border:0;background:transparent;color:var(--ink);cursor:pointer;width:36px;height:36px}

/* Verse color tags */
.vtags{display:inline-flex;gap:3px;margin-left:.3em;vertical-align:middle}
.vdot{width:10px;height:10px;border-radius:99px;display:inline-block;border:1px solid color-mix(in srgb,var(--ink) 20%,transparent)}
.tag-chip{display:inline-flex;align-items:center;gap:.35rem;border-radius:999px;padding:.28rem .7rem;border:1px solid var(--line);background:var(--surface);cursor:pointer;font-size:.85rem;color:var(--ink)}
.tag-chip[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft)}
.tag-chip .vdot{margin:0}

/* Split-screen study workspace */
#split-panel{
  position:fixed;left:0;right:0;bottom:0;z-index:18;
  height:var(--split-h, 38vh);
  background:var(--surface);border-top:1px solid var(--line);
  display:flex;flex-direction:column;
  padding-bottom:env(safe-area-inset-bottom);
}
#split-panel[hidden]{display:none !important}
@media (max-width:640px){
  body.split-on #split-panel{bottom:calc(62px + env(safe-area-inset-bottom))}
  body.split-on main{padding-bottom:calc(var(--split-h, 38vh) + 4.5rem)}
  html[data-simple].split-on #split-panel, body.split-on html[data-simple] #split-panel{bottom:calc(64px + env(safe-area-inset-bottom))}
}
@media (min-width:641px){
  body.split-on main{padding-bottom:calc(var(--split-h, 38vh) + 1.5rem)}
}
.split-div{
  height:18px;flex:none;cursor:ns-resize;display:flex;align-items:center;justify-content:center;
  touch-action:none
}
.split-div::before{content:"";width:48px;height:5px;border-radius:99px;background:var(--line-strong)}
.split-tabs{display:flex;gap:.35rem;padding:0 .8rem .45rem;flex-wrap:wrap}
.split-body{flex:1;overflow:auto;padding:.2rem 1rem 1rem;min-height:0}
.split-body .note-area{min-height:6rem}
body.split-on .verse.active{box-shadow:inset 3px 0 0 var(--accent);background:var(--accent-soft)}

/* Life situation topics */
.topic-card{border-left:4px solid var(--accent)}
.topic-card h2{margin:0 0 .3rem}
.topic-verse{display:block;padding:.65rem 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.topic-verse:last-child{border-bottom:0}
.topic-verse .ref{color:var(--accent);font-weight:700;font-size:.85rem}
.topic-verse .txt{display:block;font-family:var(--serif);margin-top:.2rem;line-height:1.55}
.topic-chiprow{display:flex;flex-wrap:wrap;gap:.4rem;margin:.3rem 0 1rem}

/* Aesthetic verse cards */
#card-dlg{border:1px solid var(--line);border-radius:20px;background:var(--surface);color:var(--ink);padding:0;width:min(440px,96vw);max-height:min(94vh,820px)}
#card-dlg::backdrop{background:rgba(0,0,0,.5)}
.card-ui{padding:1rem 1.05rem 1.15rem;overflow:auto}
.card-ui h2{margin:0 0 .7rem;font-size:1.25rem}
.card-preview-wrap{display:flex;justify-content:center;margin:.4rem 0 .8rem;background:#111;border-radius:14px;padding:.7rem}
#card-preview{max-width:100%;height:auto;max-height:min(42vh,420px);width:auto;margin:0 auto;border-radius:8px;display:block}
@media (max-height:700px){#card-preview{max-height:32vh}}
.card-styles{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem;margin:.4rem 0}
.card-styles button{border:2px solid var(--line);background:var(--bg);color:var(--ink);border-radius:12px;padding:.3rem .28rem .45rem;cursor:pointer;font-size:.7rem;line-height:1.25;display:flex;flex-direction:column;align-items:center;gap:.3rem;text-align:center}
.card-styles button canvas{width:100%;height:auto;aspect-ratio:3/4;border-radius:8px;display:block;background:#111}
.card-styles button[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft)}

/* Settings extras */
.look-seg,.theme-seg{margin-bottom:.2rem}
.check.block{align-items:flex-start;margin:.35rem 0}
.check.block span{display:block;font-size:.85rem;color:var(--muted);font-weight:400}

/* Saved tag lists */
.tag-legend{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1rem}

/* Rating prompt (hidden unless a store link is configured) */
.rating-prompt{
  position:fixed;left:50%;bottom:calc(4.8rem + env(safe-area-inset-bottom));
  transform:translateX(-50%);z-index:40;width:min(420px,calc(100vw - 1.5rem));
  background:var(--surface);color:var(--ink);border:1px solid var(--line-strong);
  border-radius:16px;box-shadow:var(--shadow);padding:.9rem 1rem
}
.rating-prompt[hidden]{display:none !important}
.rating-prompt p{margin:0 0 .65rem;font-weight:650}
html[data-simple] .rating-prompt{bottom:calc(6.2rem + env(safe-area-inset-bottom))}

/* Privacy page */
.privacy-page{max-width:720px;margin:0 auto;padding:1.25rem 1.1rem 4rem}
.privacy-page h1{margin:.2rem 0 .6rem}
.privacy-page h2{font-size:1.2rem;margin:1.4rem 0 .4rem}
.privacy-page p,.privacy-page li{color:var(--ink);line-height:1.6}
.privacy-page ul{padding-left:1.2rem}
.privacy-page .lead{font-size:1.05rem}

/* Bible version switcher */
.ver-seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;flex-shrink:0;background:var(--surface)}
.ver-btn{appearance:none;-webkit-appearance:none;border:0;background:transparent;color:var(--ink);font:650 .78rem/1 inherit;letter-spacing:.04em;padding:.35rem .75rem;min-height:36px;min-width:48px;cursor:pointer}
.ver-btn[aria-pressed="true"]{background:var(--accent,#2B4C7E);color:#fff}
.reader-head-actions{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;justify-content:flex-end}
.verse-missing{font-style:italic;color:var(--muted);font-size:.95em}
.strongs-note{margin:.7rem 0 0}
button.text-link, .text-link{appearance:none;border:0;background:none;color:var(--accent,#2B4C7E);text-decoration:underline;cursor:pointer;font:inherit;padding:0}
.guides-block{margin:0 0 1.4rem}
.guides-block > h2, .guides-plans-h{font-family:var(--serif);font-size:1.35rem;margin:1.1rem 0 .35rem}
.guide-scripture{font-size:var(--scripture-size,1.15rem);line-height:1.65}
.guide-scripture .guide-verse{display:inline}
.guide-note-card p{line-height:1.6}
.guide-included{margin:.15rem 0 .7rem;font-size:.92rem;color:var(--ink-2)}
.guide-included a{font-weight:600}
#guide-journal-box{margin-top:.6rem}
.empty .ver-seg{display:flex;margin-top:.6rem;width:max-content}

/* Context at a Glance */
.ctx-strip{margin:0 0 .85rem;padding:.15rem 0 .15rem}
.ctx-line{appearance:none;-webkit-appearance:none;display:block;width:100%;text-align:left;border:1px solid var(--line);background:var(--surface);color:var(--ink-2);border-radius:10px;padding:.45rem .7rem;font-size:.86rem;letter-spacing:.01em;cursor:pointer;line-height:1.4}
.ctx-line:hover,.ctx-line:focus{border-color:var(--accent);color:var(--ink)}
.ctx-line .ctx-kicker{display:block;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:.15rem}
.ctx-note{margin:.4rem 0 0;padding:.55rem .7rem .65rem;border-left:3px solid var(--accent);background:var(--surface);border-radius:0 10px 10px 0;font-size:.92rem;line-height:1.55}
.ctx-note p{margin:0 0 .45rem}
.ctx-note p:last-child{margin:0}
.xref-more{margin-top:.2rem}
#xrefs .xref, #split-x .xref{display:block;text-decoration:none;color:inherit;margin:0 0 .55rem;padding:.5rem .55rem;border-radius:10px;background:var(--surface)}
#xrefs .xref .txt, #split-x .xref .txt{display:block;font-family:var(--serif);margin-top:.2rem;color:var(--ink)}

/* Journal print / export view */
html[data-export="1"] .topbar,
html[data-export="1"] .nav,
html[data-export="1"] #offline-banner,
html[data-export="1"] #listen-dock,
html[data-export="1"] #toast{display:none !important}
html[data-export="1"] main{padding:1.2rem 1.1rem 3rem;max-width:42rem;margin:0 auto}
html[data-export="1"] body{background:#fff;color:#1F1D1A}
.j-toolbar{display:flex;gap:.5rem;flex-wrap:wrap;margin:0 0 1.2rem}
.j-cover{text-align:center;padding:2.2rem 1rem 2rem;border-bottom:1px solid #ddd;margin-bottom:1.6rem}
.j-cover h1{font-family:var(--serif);font-size:2rem;margin:.4rem 0 .3rem;font-weight:600}
.j-cover .j-kicker{letter-spacing:.12em;text-transform:uppercase;font-size:.78rem;color:#7A7267}
.j-toc{margin:0 0 1.8rem;padding:0;list-style:none}
.j-toc a{color:#2B4C7E}
.j-sec{margin:0 0 2rem}
.j-sec h2{font-family:var(--serif);font-size:1.45rem;margin:0 0 .7rem;padding-bottom:.3rem;border-bottom:1px solid #ddd}
.j-item{margin:0 0 1.15rem;page-break-inside:avoid}
.j-item h3{font-size:1.05rem;margin:0 0 .3rem}
.j-verse{font-family:var(--serif);font-size:1.05rem;line-height:1.55;margin:.2rem 0 .35rem}
.j-meta{font-size:.86rem;color:#5c564e;margin:0}
@media print{
  .j-toolbar,html[data-export="1"] .topbar,html[data-export="1"] .nav{display:none !important}
  html[data-export="1"] main{padding:0;max-width:none}
  .j-cover{padding-top:2.4in;min-height:8in;border:0;page-break-after:always}
  .j-toc-wrap{page-break-after:always}
  a{color:inherit;text-decoration:none}
}

/* Voice settings */
#voice-settings select{display:block;width:100%;max-width:100%;margin:.25rem 0 0;padding:.45rem .55rem;font:inherit;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink)}
#voice-settings .voice-label{display:block;font-size:.86rem;margin:.15rem 0 0}
#listen-rate{width:100%}

/* Sleep mode */
.sleep-panel{margin:.55rem 0 0;padding:.65rem .7rem .7rem;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.sleep-panel select{display:block;width:100%;margin:.2rem 0 .55rem;padding:.45rem .55rem;font:inherit;border:1px solid var(--line);border-radius:10px;background:var(--bg,var(--surface));color:var(--ink)}
.sleep-picks{flex-wrap:wrap;gap:.4rem}
.sleep-dim{position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.88);display:flex;align-items:flex-end;justify-content:center;padding:0 1.2rem 2.2rem}
.sleep-dim[hidden]{display:none !important}
.sleep-dim-stop{appearance:none;-webkit-appearance:none;min-width:4.5rem;min-height:3.5rem;padding:.6rem 1.1rem;border:1px solid #3a3a3a;border-radius:999px;background:#1a1a1a;color:#eee;font:inherit;font-size:1rem;cursor:pointer}
html[data-sleep-dim="1"] .topbar,html[data-sleep-dim="1"] .nav,html[data-sleep-dim="1"] #offline-banner,html[data-sleep-dim="1"] #toast{opacity:.15}