:root{font-family:Segoe UI,Arial,sans-serif;color:#293b38;background:#f7f7f2;font-size:16px;--green:#28584d;--line:#dce2da;--reading-size:21px}*{box-sizing:border-box}body{margin:0}header{height:94px;padding:20px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#fff}a{color:var(--green)}.brand{display:flex;gap:13px;align-items:center;text-decoration:none;font-family:Georgia,serif;font-size:30px}.brand small{display:block;font-family:Segoe UI,sans-serif;font-size:12px;letter-spacing:.03em;margin-top:3px}.brand-icon{background:var(--green);color:white;border-radius:50% 50% 5px 5px;width:43px;height:48px;display:grid;place-items:center}.preview{font-size:12px;border:1px solid var(--line);padding:7px 12px;border-radius:20px;color:#61746b}.layout{display:grid;grid-template-columns:230px minmax(0,1fr);max-width:1500px;margin:auto}nav{padding:42px 24px;border-right:1px solid var(--line);min-height:calc(100vh - 94px)}.eyebrow{font-size:11px;font-weight:700;letter-spacing:.15em;color:#718377;margin:0 0 16px}.nav{display:block;text-align:left;width:100%;margin:10px 0;padding:15px;border:0;background:none;font-size:16px}.nav span{display:block;font-size:12px;color:#728077;margin-top:5px}.nav.active{background:#e8eee6;color:var(--green)}.nav-note{font-family:Georgia,serif;font-style:italic;color:#738379;line-height:1.7;margin:50px 15px}.lab-note{font-size:12px;line-height:1.7;color:#7c847e;margin:30px 15px}main{padding:48px 6% 20px;min-width:0}h1{font-family:Georgia,serif;font-weight:400;font-size:38px;letter-spacing:-.03em;margin:0 0 16px}h2{font-family:Georgia,serif;font-weight:400;font-size:26px;margin:0}.intro{color:#66756d;line-height:1.7;max-width:750px;margin-bottom:28px}button,input,textarea,select{font:inherit}button{cursor:pointer;border:1px solid var(--line);border-radius:7px;padding:10px 15px;background:#fff;color:var(--green)}button:hover{background:#edf1e9}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #ad8a39;outline-offset:3px}input,textarea,select{border:1px solid var(--line);border-radius:6px;background:#fff;padding:11px;color:#293b38}input:focus,textarea:focus,select:focus{outline:2px solid #8aa997;outline-offset:2px}.primary{background:var(--green);color:#fff;border-color:var(--green)}.primary:hover{background:#1d453b}.question-card{background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 5px 18px #28392e06;padding:22px}label{font-size:13px;font-weight:600;display:block;margin-bottom:8px}textarea{display:block;width:100%;resize:vertical;min-height:108px;line-height:1.6;border:0;padding:6px 0;margin:10px 0 15px}.form-footer{display:flex;justify-content:space-between;align-items:center;gap:15px;padding-top:15px;border-top:1px solid #edf0e9}.form-footer>span{font-size:12px;color:#7a877d}.suggestions{display:flex;gap:10px;margin:15px 0 30px;flex-wrap:wrap}.suggestions button{font-size:12px;background:transparent;border-radius:20px;color:#65796c}.progress-card{background:#eaf0e7;border:1px solid #d8e3d3;border-radius:10px;padding:20px;margin:25px 0}.progress-heading{display:flex;gap:20px;justify-content:space-between;font-size:14px;line-height:1.6}#elapsed{white-space:nowrap;font-size:12px}.track{height:5px;background:#d5e0d1;overflow:hidden;border-radius:4px;margin:16px 0}.track span{display:block;width:35%;height:100%;background:#6f9479;animation:working 2s ease-in-out infinite}@keyframes working{from{transform:translateX(-100%)}to{transform:translateX(390%)}}@media(prefers-reduced-motion:reduce){.track span{animation:none;width:100%}}.progress-card p{font-size:12px;color:#5e7463;margin:0}.status{font-size:14px;line-height:1.6;color:#65776d}.status.error{color:#9b3c32}.answer{font:var(--reading-size)/1.95 Georgia,serif;overflow-wrap:anywhere}.answer h3{font:600 14px Segoe UI,sans-serif;margin-top:26px}.answer p{white-space:pre-wrap;margin:0 0 18px}.answer .source-block{font:14px/1.7 Segoe UI,sans-serif;border-top:1px solid var(--line);padding-top:16px}.section-label{font:600 13px Segoe UI,sans-serif;color:#65776d}.bible-form{display:flex;gap:12px;align-items:end;background:white;border:1px solid var(--line);padding:20px;border-radius:10px}.bible-form>div:first-child{flex:1}.bible-form input{width:100%}.library-panel{margin:18px 0;border:1px solid var(--line);border-radius:9px;background:#fff;padding:16px}summary{cursor:pointer;font-size:14px;color:var(--green)}#libraryForm{margin-top:20px}.inline{display:flex;gap:8px}.inline input{flex:1;min-width:0}.library-heading{display:flex;gap:12px;align-items:center;margin:15px 0;font-size:13px;overflow-wrap:anywhere}.library-items{max-height:290px;overflow:auto}.library-items button{display:block;border:0;border-bottom:1px solid #eef0eb;width:100%;text-align:left;border-radius:0;font-size:14px;overflow-wrap:anywhere}.reader-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:30px}.reader-heading .eyebrow{margin-bottom:8px}.text-size{display:flex;gap:5px}.audio-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:20px 0;padding:14px;background:#eaf0e7;border-radius:8px}.audio-toolbar label{margin:0;font-size:12px}.audio-toolbar select{max-width:200px;padding:8px}.reader{font:var(--reading-size)/1.95 Georgia,serif;background:#fff;border:1px solid var(--line);border-radius:10px;padding:34px;margin-top:20px}.reader p{margin:0 0 18px}.reader h3{font:600 14px Segoe UI,sans-serif;color:#537260;border-bottom:1px solid var(--line);padding:0 0 13px;margin:22px 0}.reader h3:first-child{margin-top:0}.verse-number{font:11px Segoe UI,sans-serif;color:#7e8e81;vertical-align:super;margin-right:6px}.sentence{border-radius:3px}.sentence.speaking{background:#f3df95;box-shadow:0 0 0 3px #f3df95}.sentence:hover{background:#eef2e9;cursor:pointer}.reader-note,#libraryNote{font-size:12px;line-height:1.6;color:#6d7b71}.warning{background:#fff5db;border-left:3px solid #bc9744;padding:14px 18px;margin:14px 0;font-size:14px;line-height:1.65}.warning strong{display:block}#documentNav{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:13px}footer{font-size:11px;color:#899489;border-top:1px solid var(--line);padding:22px 0;margin-top:50px}[hidden]{display:none!important}@media(max-width:800px){header{padding:16px 20px}.layout{display:block}nav{min-height:0;padding:12px 20px;display:flex;gap:8px;border-right:0;border-bottom:1px solid var(--line)}nav>.eyebrow,.nav-note,.lab-note{display:none}.nav{margin:0;padding:10px 15px;width:auto}.nav span{display:none}main{padding:30px 20px}h1{font-size:31px}.bible-form{flex-wrap:wrap}.bible-form>div:first-child{flex-basis:100%}.reader{padding:22px}.form-footer>span{max-width:170px}.preview{font-size:10px}.progress-heading{display:block}#elapsed{display:block;margin-top:5px}}


/* Darker interface copy. Keep answer/reader text, verse numbers and typography unchanged. */
.preview,
.eyebrow,
.nav span,
.nav-note,
.lab-note,
.intro,
.form-footer > span,
.suggestions button,
.progress-card p,
.status:not(.error),
.reader-note,
#libraryNote,
footer {
  color: #40564b;
}

/* Give input hints the same readable contrast without changing entered text. */
input::placeholder,
textarea::placeholder {
  color: #40564b;
  opacity: 1;
}


/* Shared frame keeps the header and navigation aligned on wide screens. */
:root { --frame-width: 1500px; --gutter: clamp(20px, 2vw, 30px); }
header { height: auto; min-height: 94px; padding: 0; }
.header-inner {
  width: 100%; max-width: var(--frame-width); margin-inline: auto;
  padding: 20px var(--gutter); display: flex; align-items: center;
  justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
.layout { display: flex; max-width: var(--frame-width); align-items: stretch; }
.layout > nav {
  flex: 0 0 clamp(205px, 18vw, 250px); min-width: 0;
  padding: 42px var(--gutter);
}
.layout > main { flex: 1 1 0; min-width: 0; padding: 48px clamp(24px, 4vw, 60px) 20px; }
.bible-form { flex-wrap: wrap; }
.bible-form > div:first-child { flex: 1 1 300px; min-width: 0; }
.form-footer, .reader-heading, .library-heading { flex-wrap: wrap; }
.reader-heading h2 { overflow-wrap: anywhere; }
.audio-toolbar select { max-width: min(200px, 100%); }

@media (max-width: 800px) {
  .header-inner { padding: 16px var(--gutter); }
  .layout { flex-direction: column; }
  .layout > nav {
    flex: 0 0 auto; min-height: 0; padding: 12px var(--gutter);
    display: flex; flex-wrap: wrap; gap: 8px;
    border-right: 0; border-bottom: 1px solid var(--line);
  }
  .layout > main { flex: 1 1 auto; padding: 30px var(--gutter) 20px; }
  .bible-form > div:first-child { flex-basis: 100%; }
}

/* Original lighthouse photograph, shown without cropping or distortion. */
.brand-lighthouse { display: block; width: 78px; height: auto; flex-shrink: 0; border-radius: 6px; }


/* Tablet/phone menu; desktop retains its sidebar. */
.header-actions { display: flex; align-items: center; gap: 14px; }
.navigation-toggle { display: none; align-items: center; gap: 9px; min-height: 44px; }
.menu-bars { display: flex; flex-direction: column; gap: 4px; width: 20px; }
.menu-bars i { display: block; height: 2px; width: 20px; background: currentColor; }
@media (max-width: 1050px) {
  .navigation-toggle { display: inline-flex; }
  .layout { flex-direction: column; }
  .layout > nav {
    display: none; flex: 0 0 auto; min-height: 0; padding: 12px var(--gutter);
    border-right: 0; border-bottom: 1px solid var(--line);
  }
  .layout > nav.is-open { display: flex; flex-wrap: wrap; gap: 8px; }
  nav > .eyebrow, .nav-note, .lab-note { display: none; }
  .nav { width: auto; flex: 1 1 180px; margin: 0; padding: 12px 16px; }
  .nav span { display: block; }
  .layout > main { flex: 1 1 auto; padding: 30px var(--gutter) 20px; }
}
@media (max-width: 600px) {
  .header-actions .preview { display: none; }
  .brand-lighthouse { width: 60px; }
  .header-inner { gap: 10px; }
}


/* Scripture panels are independent, non-modal windows; answer typography is unchanged. */
.answer-bible-label { margin: 0; color: #40564b; }
.answer-bible-label select { display: block; max-width: 100%; margin-top: 6px; font:400 16px Segoe UI,Arial,sans-serif; }
.bible-form select { max-width: 100%; }
.scripture-link { color: #28584d; text-decoration: underline; text-underline-offset: 3px; }
.scripture-panel {
  position: fixed; width: 470px; max-width: calc(100vw - 16px); height: 440px;
  max-height: calc(100dvh - 16px); min-width: min(280px, calc(100vw - 16px));
  min-height: 150px; display: flex; flex-direction: column; resize: both; overflow: hidden;
  background: #fff; border: 1px solid #9cab9f; border-radius: 10px;
  box-shadow: 0 12px 44px #17332938;
}
.scripture-panel-header { display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding:10px 14px; background:#e8eee6; cursor:move; touch-action:none; }
.scripture-panel-header h2 { font:600 15px/1.5 'Segoe UI',sans-serif; overflow-wrap:anywhere; }
.scripture-close { padding:3px 12px; font-size:26px; min-height:40px; flex-shrink:0; }
.scripture-panel-body { overflow:auto; flex:1; padding:18px 22px; font:21px/1.8 Georgia,serif; }
.scripture-panel-body h3 { font:600 14px 'Segoe UI',sans-serif; }
.scripture-panel-body .warning { font-family:'Segoe UI',sans-serif; }

/* Study controls wrap independently of the unchanged answer typography. */
.study-toolbar { margin: 22px 0; padding: 16px 0; border-block: 1px solid #d8dfd6; }
.study-toolbar h2 { font-size: 26px; margin: 0; }
.study-toolbar p,.study-meta { font-size: 14px; line-height:1.65; color: #40564b; }
.study-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.study-actions button,.saved-study-row button,.delete-entry { padding: 8px 12px; }
.study-actions details { position: relative; }
.study-actions summary { cursor: pointer; padding: 8px; }
.study-entry { margin: 24px 0; border: 1px solid #d8dfd6; border-radius: 10px; background: white; padding: clamp(14px,2vw,25px); overflow-wrap: anywhere; }
.study-entry > summary { cursor: pointer; font-size: 1.1rem; font-weight: 600; color: #28584d; }
.study-entry .answer { margin-top: 16px; }
.study-entry .delete-entry { margin-top: 15px; }
dialog { max-width: min(560px,calc(100vw - 32px)); width: 100%; max-height: calc(100dvh - 32px); overflow: auto; padding: 24px; border: 1px solid #c5d1c3; border-radius: 12px; color: #293b38; background: #f7f7f2; }
dialog::backdrop { background: #152c2666; }
dialog h2 { margin-top: 0; }
dialog input { display: block; width: 100%; margin: 8px 0 20px; }
dialog .study-actions { margin-top: 20px; }
.saved-study-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; border-top: 1px solid #d8dfd6; padding: 12px 0; }
.saved-study-row span { flex: 1 1 180px; overflow-wrap: anywhere; }

.publication-link { color: #28584d; text-decoration: underline; }
.cited-passage { border-left: 3px solid #28584d; padding-left: 12px; }
.scripture-panel-header h2 { overflow-wrap: anywhere; }

/* Equal prominence for both ways into the reading room. */
.reading-choice { width:100%; min-width:0; margin:20px 0; padding:clamp(18px,2.5vw,26px); background:#fff; border:1px solid var(--line); border-radius:12px; }
.reading-choice h2 { font-size:26px; margin-bottom:18px; }
.reading-choice .bible-form { padding:0; border:0; border-radius:0; flex-wrap:wrap; }
.reading-choice .bible-form > div { min-width:0; }
.reading-choice .bible-form .book-field { flex:1 1 160px; }
.reading-choice .bible-form .verses-field { flex:2 1 240px; }
.reading-choice .bible-form .translation-field { flex:0 1 220px; }
.reading-choice select { width:100%; }
.reading-help { color:#40564b; font-size:14px; line-height:1.65; margin:16px 0 0; }
.reading-choice .library-panel { margin:18px 0 0; padding:0; border:0; }
.reading-choice .library-panel > summary { padding:12px 16px; border:1px solid var(--line); border-radius:7px; background:#e8eee6; font-size:16px; font-weight:600; }

/* Local time and guidance for keeping a personal copy of a study. */
.local-clock { font:400 16px Segoe UI,Arial,sans-serif; color:#40564b; font-variant-numeric:tabular-nums; white-space:nowrap; }
.study-help { margin-top:36px; padding-top:22px; border-top:1px solid var(--line); color:#40564b; font-size:14px; line-height:1.65; }
.study-help summary { padding:9px 0; line-height:1.5; overflow-wrap:anywhere; }
.help-menu > summary { font-size:16px; font-weight:600; }
.help-section { margin-top:4px; border-top:1px solid var(--line); }
.help-section > summary { font-weight:600; }
.help-topic { display:block; width:100%; text-align:left; padding:9px 10px; margin:2px 0; border:0; background:transparent; font-size:14px; line-height:1.5; }
.help-topic:hover { background:#e8eee6; }
.help-panel .scripture-panel-body { font:16px/1.7 Segoe UI,Arial,sans-serif; }
.help-window-hint { color:#40564b; font-size:14px; border-top:1px solid var(--line); padding-top:16px; }
.study-help p { margin:4px 0 0; overflow-wrap:anywhere; }
@media(max-width:1050px) { .study-help { flex:1 1 100%; margin-top:12px; } }

/* Keep the website exit visible and usable beside the clock on small screens. */
.website-home { font: 400 14px Segoe UI,Arial,sans-serif; padding: 9px 10px; border: 1px solid var(--line); border-radius: 6px; text-decoration: none; }
.website-home:hover { background: #eef2e9; }
.website-home:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }
.header-actions { flex-wrap: wrap; justify-content: flex-end; }

/* Separate layout experiment: session management in the navigation pane. */

nav .study-toolbar {margin:20px 0 0;padding:16px 0;border-bottom:0;}
nav .study-toolbar h2 {font:600 18px/1.4 'Segoe UI',sans-serif;overflow-wrap:anywhere;}
nav .study-toolbar p {font-size:13px;margin:8px 0 14px;}
nav .study-actions {display:flex;flex-direction:column;align-items:stretch;gap:8px;}
nav .study-actions > button {width:100%;text-align:left;min-height:42px;}
nav .study-actions details {width:100%;}
nav .study-actions details button {display:block;width:100%;text-align:left;margin:6px 0;}
nav .nav-note {margin:24px 0;font-size:13px;}
nav .study-help {margin-top:14px;padding-top:10px;}
body:has(#readView:not([hidden])) nav .study-toolbar {display:none;}
body:has(#askView:not([hidden])) nav .nav-note {display:none;}
@media(min-width:1051px) {body:has(#askView:not([hidden])) .layout > nav {height:calc(100dvh - 94px);min-height:0;overflow-y:auto;padding-top:20px;padding-bottom:12px;scrollbar-width:thin;scrollbar-color:#cbd5ca transparent;}}
nav::-webkit-scrollbar {width:6px;}
nav::-webkit-scrollbar-track {background:transparent;}
nav::-webkit-scrollbar-thumb {background:#cbd5ca;border-radius:6px;}

body:has(#askView:not([hidden])) .layout > main {height:calc(100dvh - 94px);display:flex;flex-direction:column;padding-top:14px;padding-bottom:14px;}
#askView {display:flex;flex-direction:column;flex:1;min-height:0;gap:10px;}
#askView > .eyebrow {margin:0;font-size:11px;}
#askView > h1 {font-size:28px;margin:0;}
#askView > .intro {margin:0;font-size:14px;line-height:1.5;}
.answer-pane {flex:1;min-height:120px;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-gutter:stable;background:white;border:1px solid var(--line);border-radius:12px;padding:18px 24px;}
.answer-empty {color:#65776d;line-height:1.7;font-size:15px;}
.answer-pane .study-entry:first-child {margin-top:0;}
.answer-pane .study-entry:last-child {margin-bottom:0;}
.answer-pane .progress-card {margin:0 0 14px;}
#askForm {flex:none;padding:12px 18px;}
#askForm textarea {min-height:54px;height:64px;max-height:160px;margin:4px 0 8px;resize:vertical;}
#askForm .form-footer {padding-top:8px;}
#askForm .answer-bible-label {display:flex;align-items:center;gap:10px;font-size:12px;}
#askForm .answer-bible-label select {display:inline-block;margin:0;padding:7px;}
@media(max-height:650px) {#askView > .intro,#askView > .eyebrow,#askView > h1{font-size:22px;}#askForm textarea{height:44px;min-height:44px;}}
@media(max-width:1050px) {body:has(#askView:not([hidden])) .layout > main {height:calc(100dvh - 100px);padding:12px var(--gutter);}body:has(nav.is-open) .layout > main{height:calc(100dvh - 100px);}#askView > h1{font-size:24px;}.answer-pane{padding:14px;}#askView > .intro{display:none;}}
@media(max-width:1050px) {nav .study-toolbar {flex:1 1 100%;margin:8px 0 0;}nav .study-actions {flex-direction:row;flex-wrap:wrap;}nav .study-actions > button {width:auto;flex:1 1 140px;}nav .study-actions details {width:auto;flex:1 1 140px;}}