/* AskBibleQuestions Memorization Coach. Uses the site's own colour tokens (with the same fallbacks the
 * Bible pages use), its heading and text faces, square corners and ink buttons. One calm column. */
.abqc {
	--c-paper: var(--base, #FBF7EF);
	--c-card: var(--base-3, #FFFDF8);
	--c-panel: var(--base-2, #F4ECDA);
	--c-ink: var(--contrast, #2A2118);
	--c-ink2: var(--contrast-2, #6F5F4A);
	--c-ink3: var(--contrast-3, #9A8A70);
	--c-gold: var(--accent, #B07D1E);
	--c-gold2: var(--gold-2, #8C6014);
	--c-rubric: var(--rubric, #9B2F1A);
	--c-rubric-wash: #F6E3DC;
	--c-line: var(--line, #E8DCC4);
	--c-line2: var(--line-2, #DECFB2);
	--c-amber: var(--amber-soft, #EED9AC);
	--c-on-ink: #FBF7EF;
	--c-sans: -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
	--c-serif: Newsreader, Georgia, serif;
	--c-head: Fraunces, Georgia, serif;
	max-width: 34rem;
	margin-inline: auto;
	color: var(--c-ink);
	font-family: var(--c-serif);
}
.abqc.abqc-dark {
	--c-paper: #1C1711; --c-card: #241D15; --c-panel: #2A2218; --c-ink: #EDE4D3; --c-ink2: #BDAF98; --c-ink3: #8E806A;
	--c-gold: #D9A441; --c-gold2: #E2B55C; --c-rubric: #E58A6C; --c-rubric-wash: #4A2A20; --c-line: #3A2F22; --c-line2: #4B3D2C;
	--c-amber: #4D3C1B; --c-on-ink: #1C1711;
	background: var(--c-paper);
}
.abqc *, .abqc *::before, .abqc *::after { box-sizing: border-box; }
.abqc [hidden] { display: none !important; }
.abqc-page { display: flex; flex-direction: column; gap: 1.35rem; padding: 1.5rem 0 1rem; }
.abqc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* small uppercase labels */
.abqc-label, .abqc-top, .abqc-btn, .abqc-link, .abqc-segbtn, .abqc-more summary { font-family: var(--c-sans); font-weight: 700; text-transform: uppercase; }
.abqc-label { display: block; margin: 0; font-size: .66rem; letter-spacing: .14em; color: var(--c-ink2); }
.abqc-top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; font-size: .66rem; letter-spacing: .16em; }
.abqc-top-site { color: var(--c-ink2); }
.abqc-top-name { color: var(--c-rubric); }

.abqc-h1, .abqc-h2 { margin: 0; font-family: var(--c-head); font-weight: 600; color: var(--c-ink); text-wrap: balance; }
.abqc-h1 { font-size: clamp(1.8rem, 7vw, 2.25rem); line-height: 1.1; letter-spacing: -.015em; margin-top: 1rem; }
.abqc-h2 { font-size: 1.625rem; line-height: 1.15; }
.abqc-headline { display: flex; align-items: baseline; flex-wrap: wrap; gap: .3rem .75rem; margin-top: .75rem; }
.abqc-lede { margin: -.6rem 0 0; font-size: 1.125rem; line-height: 1.5; color: var(--c-ink2); }
.abqc-soft { margin: 0; font-size: 1.125rem; line-height: 1.5; color: var(--c-ink2); }
.abqc-fine { margin: 0; font-size: .92rem; line-height: 1.45; color: var(--c-ink2); }
.abqc-center { text-align: center; }
.abqc-heard { overflow-wrap: anywhere; font-style: italic; }
.abqc-status { margin: 0; font-size: 1.2rem; font-style: italic; color: var(--c-ink2); }
.abqc-note { margin: 0; padding: .8rem 1rem; background: var(--c-panel); border-left: 3px solid var(--c-rubric); font-size: 1.02rem; line-height: 1.45; }

/* fields and buttons */
.abqc-field, .abqc-opt { display: flex; flex-direction: column; gap: .6rem; }
.abqc-input { width: 100%; min-height: 52px; border: 1px solid var(--c-line2); border-radius: 0; background: var(--c-card); padding: .6rem .9rem; font-family: var(--c-serif); font-size: 1.25rem; color: var(--c-ink); }
.abqc-area { resize: vertical; line-height: 1.5; }
.abqc-btn { min-height: 54px; padding: .5rem 1.2rem; border: 1px solid var(--c-ink); border-radius: 0; background: transparent; color: var(--c-ink); font-size: .78rem; letter-spacing: .16em; cursor: pointer; }
.abqc-primary { background: var(--c-ink); color: var(--c-on-ink); }
.abqc-primary:hover { background: var(--c-gold2); border-color: var(--c-gold2); }
.abqc-second:hover { border-color: var(--c-gold2); color: var(--c-gold2); }
.abqc-link { min-height: 44px; padding: 0 .1rem; border: 0; background: none; color: var(--c-gold2); font-size: .75rem; letter-spacing: .1em; cursor: pointer; }
.abqc-link:hover { color: var(--c-rubric); }
.abqc :is(.abqc-btn, .abqc-link, .abqc-input, .abqc-segbtn, summary, .abqc-w[role="button"]):focus-visible { outline: 3px solid var(--c-gold); outline-offset: 2px; }

.abqc-seg { display: flex; border: 1px solid var(--c-line2); background: var(--c-card); }
.abqc-set .abqc-opt { gap: .45rem; }
.abqc-segbtn { flex: 1 1 0; min-height: 46px; padding: .3rem .4rem; border: 0; border-left: 1px solid var(--c-line2); border-radius: 0; background: transparent; color: var(--c-ink2); font-size: .7rem; letter-spacing: .08em; cursor: pointer; }
.abqc-segbtn:first-child { border-left: 0; }
.abqc-segbtn[aria-pressed="true"] { background: var(--c-amber); color: var(--c-ink); box-shadow: inset 0 -2px 0 var(--c-gold); }
.abqc-more { border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
.abqc-more summary { min-height: 48px; display: flex; align-items: center; justify-content: space-between; font-size: .75rem; letter-spacing: .12em; color: var(--c-gold2); cursor: pointer; list-style: none; }
.abqc-more summary::-webkit-details-marker { display: none; }
.abqc-more summary::after { content: "+"; font-size: 1.1rem; font-weight: 400; }
.abqc-more[open] summary::after { content: "\2212"; }
.abqc-more-body { display: flex; flex-direction: column; gap: 1.1rem; padding: .4rem 0 1.2rem; }

/* the first screen: a heading, one card that starts, and a quieter panel of choices beneath it */
.inside-article:has(> .entry-content > #abq-coach) > .entry-header { display: none; }
.abqc-pick { gap: 1.75rem; padding-top: 2.25rem; }
.abqc-hero { display: flex; flex-direction: column; align-items: center; gap: .9rem; text-align: center; }
.abqc-eyebrow { margin: 0; font-family: var(--c-sans); font-size: .7rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--c-rubric); }
.abqc-hero .abqc-h1 { margin-top: 0; font-size: clamp(2rem, 7.5vw, 2.9rem); max-width: 14em; }
.abqc-hero .abqc-lede { margin: 0; max-width: 30em; font-size: 1.2rem; }
.abqc-orn { display: flex; align-items: center; gap: .7rem; width: min(13rem, 60%); margin-top: .35rem; }
.abqc-orn span { flex: 1 1 0; height: 1px; background: var(--c-gold); opacity: .7; }
.abqc-orn i { width: 7px; height: 7px; background: var(--c-gold); transform: rotate(45deg); }

.abqc-start { display: flex; flex-direction: column; gap: .7rem; padding: clamp(1.1rem, 4vw, 1.6rem); background: var(--c-card); border: 1px solid var(--c-line2); border-top: 3px solid var(--c-gold); box-shadow: 0 1px 0 var(--c-line), 0 14px 30px -22px rgba(42, 33, 24, .45); }
.abqc-startrow { display: flex; flex-direction: column; gap: .7rem; }
.abqc-start .abqc-input { min-height: 58px; font-size: 1.4rem; background: var(--c-paper); }
.abqc-begin { min-height: 58px; font-size: .86rem; letter-spacing: .2em; }
.abqc-try { display: flex; flex-wrap: wrap; align-items: center; gap: .1rem .9rem; margin-top: .2rem; }
.abqc-try-l { font-family: var(--c-sans); font-size: .66rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--c-ink2); }
.abqc-chip { min-height: 40px; padding: 0; border: 0; background: none; color: var(--c-gold2); font-family: var(--c-serif); font-size: 1.05rem; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--c-gold) 55%, transparent); text-underline-offset: 3px; cursor: pointer; }
.abqc-chip:hover { color: var(--c-rubric); }

.abqc-set { display: flex; flex-direction: column; gap: .8rem; padding: clamp(1.1rem, 4vw, 1.6rem); background: var(--c-panel); }
.abqc-h3 { margin: 0; font-family: var(--c-head); font-weight: 600; font-size: 1.2rem; color: var(--c-ink); }
.abqc-set .abqc-h3:not(:first-child) { margin-top: .7rem; }
.abqc-cards { display: grid; gap: .6rem; }
.abqc-cards2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.abqc-pick-card { position: relative; display: flex; flex-direction: column; gap: .3rem; min-height: 56px; padding: .85rem 2.4rem .85rem 1rem; text-align: left; background: color-mix(in srgb, var(--c-card) 55%, transparent); border: 1px solid var(--c-line2); border-radius: 0; color: var(--c-ink); font-family: var(--c-serif); cursor: pointer; }
.abqc-pick-card strong { font-family: var(--c-head); font-weight: 600; font-size: 1.15rem; }
.abqc-pick-card span:not(.abqc-face) { font-size: .98rem; line-height: 1.4; color: var(--c-ink2); }
.abqc-pick-card::after { content: ""; position: absolute; top: 1rem; right: 1rem; width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid var(--c-ink3); }
.abqc-pick-card:hover { border-color: var(--c-gold); }
.abqc-pick-card[aria-pressed="true"] { background: var(--c-card); border-color: var(--c-gold); box-shadow: inset 3px 0 0 var(--c-gold); }
.abqc-pick-card[aria-pressed="true"]::after { border-color: var(--c-gold); background: radial-gradient(circle, var(--c-gold) 0 4.5px, transparent 5px); }
.abqc-pick-coach { flex-direction: row; align-items: center; gap: .8rem; }
.abqc-pick-coach .abqc-face { width: 40px; height: 40px; font-size: 1.1rem; }
.abqc-set .abqc-more { margin-top: .5rem; border-color: var(--c-line2); border-bottom: 0; }
.abqc-set .abqc-more-body { padding-bottom: .2rem; }
.abqc :is(.abqc-pick-card, .abqc-chip):focus-visible { outline: 3px solid var(--c-gold); outline-offset: 2px; }
@media (min-width: 720px) {
	.abqc:has(.abqc-pick) { max-width: 46rem; }
	.abqc-startrow { flex-direction: row; }
	.abqc-startrow .abqc-input { flex: 1 1 auto; }
	.abqc-begin { flex: 0 0 11rem; }
	.abqc-cards3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.abqc-cards3 .abqc-pick-card { padding: 1rem 1rem 1.1rem; }
	.abqc-cards3 .abqc-pick-card strong { padding-right: 1.6rem; }
}
html.abqc-full .abqc-pick { max-width: 46rem; }

/* the session */
.abqc-bar { height: 4px; background: var(--c-line); }
.abqc-bar span { display: block; height: 100%; background: var(--c-gold); transition: width .3s; }
.abqc-text, .abqc-quote { margin: 0; font-size: clamp(1.5rem, 6.4vw, 1.94rem); line-height: 1.5; color: var(--c-ink); overflow-wrap: break-word; }
.abqc-text.abqc-long, .abqc-quote.abqc-long { font-size: clamp(1.15rem, 4.6vw, 1.35rem); line-height: 1.6; }
.abqc-quote { font-size: 1.3rem; padding-left: 1rem; border-left: 3px solid var(--c-gold); }
.abqc-text .abqc-later { color: var(--c-ink3); }
.abqc-text .abqc-now { background: var(--c-amber); box-shadow: 0 0 0 4px var(--c-amber); }
.abqc-blank { display: inline-block; height: 1em; border-bottom: 2px solid var(--c-ink3); vertical-align: baseline; }
.abqc-blank.abqc-tail { margin-left: 2px; }
.abqc-w { position: relative; }
/* what was heard instead sits on its own line beneath the word, never over it */
.abqc-w small { position: absolute; left: 0; top: 100%; margin-top: 3px; white-space: nowrap; font-family: var(--c-sans); font-size: .62rem; font-weight: 500; line-height: 1; letter-spacing: 0; color: var(--c-ink2); background: none; pointer-events: none; }
.abqc-marked { line-height: 2.15; }
.abqc-close { border-bottom: 2px dotted var(--c-gold); }
.abqc-fixed { border-bottom: 2px dotted var(--c-ink3); }
.abqc-sub, .abqc-miss { color: var(--c-rubric); background: var(--c-rubric-wash); border-bottom: 2px solid var(--c-rubric); padding: 0 4px; cursor: pointer; }
.abqc-extra { color: var(--c-ink3); font-size: .7em; text-decoration: line-through; }
.abqc-main { display: flex; flex-direction: column; gap: 1.1rem; }
.abqc-levelnote { letter-spacing: .12em; }

.abqc-coach { display: flex; gap: .9rem; align-items: flex-start; background: var(--c-panel); padding: 1rem; }
.abqc-coach-reading, .abqc-coach-thinking { background: none; padding: 0; align-items: center; }
.abqc-face { width: 46px; height: 46px; border-radius: 50%; background: var(--c-ink); color: var(--c-on-ink); display: flex; align-items: center; justify-content: center; font-family: var(--c-head); font-size: 1.25rem; flex-shrink: 0; }
.abqc-coach-body { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.abqc-coach-say { font-size: 1.25rem; line-height: 1.45; }
.abqc-wave { display: flex; align-items: flex-end; gap: 4px; height: 22px; }
.abqc-wave span { width: 4px; height: 100%; background: var(--c-gold); transform-origin: bottom; animation: abqc-wave 1.1s ease-in-out infinite; }
.abqc-wave span:nth-child(2) { animation-delay: -.9s; } .abqc-wave span:nth-child(3) { animation-delay: -.3s; } .abqc-wave span:nth-child(4) { animation-delay: -.6s; }
.abqc-wave span:nth-child(5) { animation-delay: -.15s; } .abqc-wave span:nth-child(6) { animation-delay: -.75s; } .abqc-wave span:nth-child(7) { animation-delay: -.45s; }
@keyframes abqc-wave { 0%, 100% { transform: scaleY(.3); } 50% { transform: scaleY(1); } }
.abqc-coach-thinking .abqc-face { animation: abqc-think 1.2s ease-in-out infinite; }
@keyframes abqc-think { 50% { opacity: .55; } }

.abqc-micwrap { display: flex; flex-direction: column; align-items: center; gap: 1.6rem; padding: 1.6rem 0 .4rem; }
.abqc-mic { --abqc-level: 0; width: 112px; height: 112px; border-radius: 50%; background: var(--c-ink3); display: flex; align-items: center; justify-content: center; }
.abqc-mic.abqc-on { background: var(--c-rubric); box-shadow: 0 0 0 calc(8px + var(--abqc-level) * 10px) color-mix(in srgb, var(--c-rubric) 16%, transparent), 0 0 0 calc(18px + var(--abqc-level) * 22px) color-mix(in srgb, var(--c-rubric) 8%, transparent); transition: box-shadow .08s linear; }
.abqc-mic svg { width: 40px; height: 40px; fill: none; stroke: #FBF7EF; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.abqc-miclabel { margin: 0; font-size: 1.25rem; }

.abqc-foot { display: flex; flex-direction: column; gap: .5rem; margin-top: auto; padding-top: .4rem; }
.abqc-actions { display: flex; flex-direction: column; gap: .6rem; }
.abqc-links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0 1.25rem; }
.abqc-stats { display: flex; border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); padding: .9rem 0; }
.abqc-stat { flex: 1 1 0; display: flex; flex-direction: column; gap: .15rem; }
.abqc-stat-n { font-family: var(--c-head); font-weight: 600; font-size: 1.625rem; }
.abqc-ver { margin: 0; font-family: var(--c-sans); font-size: .68rem; color: var(--c-ink3); text-align: right; user-select: none; }
.abqc-logbox { display: flex; flex-direction: column; gap: .6rem; margin-top: 1rem; padding: 1rem; border: 1px solid var(--c-line); background: var(--c-card); }
.abqc-logbox textarea { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .75rem; white-space: pre; }

/* a session fills the window height so the main button sits low, within thumb reach */
.abqc-session { min-height: min(46rem, calc(100vh - 6rem)); min-height: min(46rem, calc(100dvh - 6rem)); }

/* full screen: the coach alone, and the passage as large as the screen allows (as in the Bible reader's
 * full screen: the same sizing, the same text-size steps, the same floating controls) */
html.abqc-full, html.abqc-full body { overflow: hidden !important; }
html.abqc-full .abqc { position: fixed; inset: 0; z-index: 2147483000; max-width: none; margin: 0; overflow-y: auto; background: var(--c-paper); padding: 0 max(20px, 4vw); }
html.abqc-full .abqc-page { max-width: 38rem; margin-inline: auto; padding-top: 72px; }
html.abqc-full .abqc-session { max-width: none; min-height: 0; height: 100vh; height: 100dvh; overflow: hidden; padding-top: 64px; padding-bottom: max(.8rem, env(safe-area-inset-bottom, 0px)); }
html.abqc-full .abqc-session.abqc-scroll { height: auto; min-height: 100dvh; overflow: visible; }
html.abqc-full .abqc-session > * { flex-shrink: 0; }
html.abqc-full .abqc-ver { position: fixed; right: 14px; bottom: 4px; width: auto; opacity: .6; }
html.abqc-full .abqc-session > * { width: 100%; max-width: 38rem; margin-inline: auto; }
html.abqc-full .abqc-session > :is(.abqc-top, .abqc-bar, .abqc-headline, .abqc-text, .abqc-quote, .abqc-h1) { max-width: none; }
html.abqc-full .abqc-session .abqc-text, html.abqc-full .abqc-session .abqc-quote { margin-block: auto; padding-block: .6em; font-size: calc(clamp(24px, 3.6vw, 96px) * var(--abqc-scale, 1)); line-height: 1.5; }
html.abqc-full .abqc-session .abqc-text.abqc-long, html.abqc-full .abqc-session .abqc-quote.abqc-long { font-size: calc(clamp(21px, 2.7vw, 72px) * var(--abqc-scale, 1)); }
html.abqc-full .abqc-session .abqc-marked { line-height: 2; }
html.abqc-full .abqc-session .abqc-w small { font-size: max(.7rem, .26em); margin-top: .12em; }
html.abqc-full .abqc-session .abqc-h2 { font-size: clamp(1.625rem, 2.4vw, 2.6rem); }
html.abqc-full .abqc-session .abqc-foot { margin-top: 0; }
html.abqc-full .abqc-micwrap { padding-top: .4rem; gap: 1.2rem; }
html.abqc-full .abqc-logbox { max-width: 38rem; margin-inline: auto; }
/* when the text is large, the lower part sits side by side to leave it room */
html.abqc-full .abqc-tight { gap: .7rem; padding-top: 56px; }
html.abqc-full .abqc-tight > * { max-width: none; }
html.abqc-full .abqc-tight .abqc-headline, html.abqc-full .abqc-tight .abqc-h1 { margin-top: 0; }
html.abqc-full .abqc-tight .abqc-h1 { font-size: clamp(1.4rem, 2.4vw, 2rem); }
html.abqc-full .abqc-tight .abqc-text, html.abqc-full .abqc-tight .abqc-quote { padding-block: .15em; line-height: 1.32; }
html.abqc-full .abqc-tight .abqc-marked { line-height: 1.75; }
html.abqc-full .abqc-tight .abqc-main { flex-direction: row; flex-wrap: wrap; align-items: center; gap: .6rem 1.5rem; }
html.abqc-full .abqc-tight .abqc-main > * { flex: 1 1 16rem; }
html.abqc-full .abqc-tight .abqc-extra-note, html.abqc-full .abqc-tight .abqc-soft { display: none; }
html.abqc-full .abqc-tight .abqc-coach { padding: .6rem .9rem; }
html.abqc-full .abqc-tight .abqc-coach-say { font-size: 1.1rem; line-height: 1.35; }
html.abqc-full .abqc-tight .abqc-stats { border: 0; padding: 0; }
html.abqc-full .abqc-tight .abqc-micwrap { flex-direction: row; justify-content: center; gap: 1.4rem; padding: .5rem 0; }
html.abqc-full .abqc-tight .abqc-mic { width: 64px; height: 64px; }
html.abqc-full .abqc-tight .abqc-mic.abqc-on { box-shadow: 0 0 0 calc(5px + var(--abqc-level) * 6px) color-mix(in srgb, var(--c-rubric) 16%, transparent); }
html.abqc-full .abqc-tight .abqc-mic svg { width: 26px; height: 26px; }
html.abqc-full .abqc-tight .abqc-foot { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .3rem 1.5rem; }
html.abqc-full .abqc-tight .abqc-actions { flex-direction: row; flex: 1 1 16rem; }
html.abqc-full .abqc-tight .abqc-actions .abqc-btn { flex: 1 1 0; min-height: 48px; }
html.abqc-full .abqc-tight .abqc-links { flex: 0 1 auto; justify-content: flex-end; }
html.abqc-full .abqc-tight .abqc-foot > .abqc-fine { display: none; }
html.abqc-full .abqc-tight .abqc-area { min-height: 0; height: 3.4em; }
.abqc-float { position: fixed; top: calc(12px + env(safe-area-inset-top, 0px)); left: 14px; right: 14px; z-index: 2147483001; display: flex; align-items: center; justify-content: space-between; gap: 12px; pointer-events: none; }
.abqc-float > * { pointer-events: auto; }
.abqc-float-brand { display: inline-flex; align-items: center; min-height: 40px; font-family: var(--c-sans); font-size: .72rem; font-weight: 600; letter-spacing: .04em; color: var(--c-ink2); text-decoration: none; }
.abqc-float-brand:hover { opacity: .8; }
.abqc-float-brand:focus-visible { outline: 3px solid var(--c-gold); outline-offset: 3px; }
.abqc-float-logo { display: block; height: 36px; width: auto; max-width: min(46vw, 240px); object-fit: contain; object-position: left center; }
.abqc-has-logo { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.abqc-dark .abqc-float-logo { display: none; }
.abqc-dark .abqc-has-logo { position: static; width: auto; height: auto; clip-path: none; color: var(--c-ink2); }
@media (max-width: 600px) { .abqc-float-logo { height: 28px; } }
.abqc-float-btns { display: flex; gap: 8px; }
.abqc-fbtn { min-width: 44px; height: 40px; padding: 0 10px; border: 0; border-radius: 20px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font: 600 15px/1 system-ui, -apple-system, "Segoe UI", sans-serif; color: #f6eedd; background: rgba(29, 22, 16, .55); opacity: .6; transition: opacity .2s; }
.abqc-fbtn:hover, .abqc-fbtn:focus-visible { opacity: 1; }
.abqc-fbtn:focus-visible { outline: 2px solid #d9a53a; outline-offset: 2px; }
.abqc-fbtn[disabled] { opacity: .25; cursor: default; }
.abqc-fx { width: 40px; min-width: 40px; padding: 0; border-radius: 50%; }
.abqc-dark .abqc-fbtn { background: rgba(237, 228, 211, .22); }

@media (prefers-reduced-motion: reduce) {
	.abqc-bar span, .abqc-mic.abqc-on { transition: none; }
	.abqc-wave span, .abqc-coach-thinking .abqc-face { animation: none; }
	.abqc-wave span:nth-child(odd) { transform: scaleY(.5); }
}
.abqc-pick-coach { padding-right: 1rem; }
.abqc-pick-coach::after { display: none; }

/* the site's theme styles every button as an uppercase, spaced label; these are not labels */
.abqc .abqc-pick-card, .abqc .abqc-chip { text-transform: none; letter-spacing: normal; font-weight: 400; line-height: 1.4; }
.abqc .abqc-pick-card strong { text-transform: none; letter-spacing: normal; font-weight: 600; line-height: 1.25; }
.abqc .abqc-pick-card span:not(.abqc-face) { text-transform: none; letter-spacing: normal; font-weight: 400; }
.abqc .abqc-chip:hover, .abqc .abqc-chip:focus { background: none; color: var(--c-rubric); }
.abqc .abqc-pick-card:hover, .abqc .abqc-pick-card:focus { color: var(--c-ink); }
.abqc .abqc-pick-card:not([aria-pressed="true"]):hover, .abqc .abqc-pick-card:not([aria-pressed="true"]):focus { background: color-mix(in srgb, var(--c-card) 55%, transparent); }
.abqc .abqc-pick-card[aria-pressed="true"]:hover, .abqc .abqc-pick-card[aria-pressed="true"]:focus { background: var(--c-card); }
.abqc .abqc-link:hover, .abqc .abqc-link:focus { background: none; }
.abqc .abqc-segbtn:not([aria-pressed="true"]):hover, .abqc .abqc-segbtn:not([aria-pressed="true"]):focus { background: transparent; color: var(--c-ink); }
.abqc .abqc-segbtn[aria-pressed="true"]:hover, .abqc .abqc-segbtn[aria-pressed="true"]:focus { background: var(--c-amber); color: var(--c-ink); }
.abqc .abqc-second:hover, .abqc .abqc-second:focus { background: transparent; }
.abqc .abqc-fbtn:hover, .abqc .abqc-fbtn:focus { background: rgba(29, 22, 16, .55); color: #f6eedd; }

/* ---------- topics, lists, the list builder and listening (plain for now; the design pass comes last) ---------- */
.abqc-rows { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--c-line); }
.abqc-rows > li { margin: 0; padding: 0; list-style: none; }
.abqc .abqc-rowbtn { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; min-height: 52px; padding: .6rem .2rem; border: 0; border-bottom: 1px solid var(--c-line); border-radius: 0; background: none; color: var(--c-ink); font-family: var(--c-serif); font-size: 1.15rem; font-weight: 400; line-height: 1.3; text-align: left; text-transform: none; letter-spacing: normal; cursor: pointer; }
.abqc .abqc-rowbtn:hover, .abqc .abqc-rowbtn:focus { background: var(--c-panel); color: var(--c-ink); }
.abqc .abqc-rowbtn:focus-visible, .abqc .abqc-mini:focus-visible { outline: 3px solid var(--c-gold); outline-offset: -3px; }
.abqc-row-main { min-width: 0; }
.abqc-row-side { flex-shrink: 0; font-family: var(--c-sans); font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--c-gold2); }
.abqc-row-done { color: var(--c-ink3); }
.abqc-numbered { counter-reset: abqc-n; }
.abqc-numbered > li { counter-increment: abqc-n; }
.abqc-numbered .abqc-row-main::before { content: counter(abqc-n) ". "; color: var(--c-ink3); font-variant-numeric: tabular-nums; }
.abqc-found { display: flex; flex-direction: column; }
.abqc-found:empty { display: none; }
.abqc-found .abqc-rowbtn { padding-inline: .6rem; background: var(--c-paper); }
.abqc-actions-row { flex-direction: row; flex-wrap: wrap; }
.abqc-actions-row .abqc-btn { flex: 1 1 8rem; }
.abqc-h1-list { margin-top: 0; }
.abqc-listview .abqc-eyebrow { margin-top: .6rem; margin-bottom: -.9rem; }
.abqc-listview .abqc-links, .abqc-pick > .abqc-links { justify-content: flex-start; gap: 0 1.6rem; }
.abqc-share { display: flex; flex-direction: column; gap: .8rem; padding: clamp(1rem, 4vw, 1.4rem); background: var(--c-panel); }
.abqc-share-url { font-family: var(--c-sans); font-size: .9rem; min-height: 46px; }
.abqc-optrow { display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; }
.abqc-check { display: inline-flex; align-items: center; gap: .5rem; min-height: 40px; font-size: 1.05rem; cursor: pointer; }
.abqc-check input { width: 20px; height: 20px; accent-color: var(--c-gold2); }
.abqc-qr { align-self: center; width: min(13rem, 70%); padding: .6rem; background: #fff; }
.abqc-qr svg { display: block; width: 100%; height: auto; }
.abqc-buildrow { display: flex; align-items: center; gap: .8rem; min-height: 52px; padding: .3rem .2rem; border-bottom: 1px solid var(--c-line); font-size: 1.15rem; }
.abqc-buildrow .abqc-row-main { flex: 1 1 auto; }
.abqc .abqc-mini { min-height: 40px; padding: 0 .7rem; border: 1px solid var(--c-line2); border-radius: 0; background: none; color: var(--c-ink2); font-family: var(--c-sans); font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }
.abqc .abqc-mini:hover, .abqc .abqc-mini:focus { background: none; border-color: var(--c-rubric); color: var(--c-rubric); }
.abqc-add { flex: 0 0 auto; min-width: 7rem; }
.abqc-listenopts > .abqc-opt { flex: 1 1 12rem; }
.abqc-listen .abqc-foot { gap: 1rem; }
html.abqc-full .abqc-tight .abqc-listenopts { display: none; }

/* passage text under each reference in a list, and the coach placed inside a Memorize page */
.abqc-row-text { margin: 0; padding: .1rem .2rem 1rem; font-size: 1.12rem; line-height: 1.55; color: var(--c-ink); border-bottom: 1px solid var(--c-line); }
.abqc-rows > li:has(.abqc-row-text) .abqc-rowbtn { border-bottom: 0; padding-bottom: .2rem; }
.abqc-embedded { padding-top: .4rem; }
.abqc:has(.abqc-embedded) { max-width: none; margin-inline: 0; }
.abqc-embedded .abqc-h1 { font-size: 1.5rem; margin-top: 0; }
.abqc-plain { margin: 0; padding-left: 1.3em; font-size: 1.12rem; line-height: 1.55; }
.abqc-plain li { margin: 0 0 .9em; }
html.abqc-full .abqc:has(.abqc-embedded) { max-width: none; }

/* list rows: note, listen-on-repeat and context links; the pause countdown in listen-only */
.abqc-row-note { margin: 0; padding: 0 .2rem .3rem; font-family: var(--c-sans); font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--c-rubric); }
.abqc-rows > li:has(.abqc-row-text) .abqc-row-text { border-bottom: 0; padding-bottom: .2rem; }
.abqc-row-acts { display: flex; flex-wrap: wrap; gap: 0 1.6rem; padding: 0 .2rem .5rem; border-bottom: 1px solid var(--c-line); }
.abqc .abqc-alink { display: inline-flex; align-items: center; text-decoration: none; }
.abqc .abqc-abtn { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.abqc-countdown { font-family: var(--c-head); font-weight: 600; font-size: 1.625rem; color: var(--c-gold2); font-variant-numeric: tabular-nums; }

/* The landing page on the site: the options sit behind one control. */
.abqc-fold { border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
.abqc-fold > summary { min-height: 52px; display: flex; align-items: center; gap: .8rem; cursor: pointer; list-style: none; font-family: var(--c-sans); }
.abqc-fold > summary::-webkit-details-marker { display: none; }
.abqc-fold > summary::after { content: "+"; margin-left: auto; font-size: 1.2rem; color: var(--c-gold2); }
.abqc-fold[open] > summary::after { content: "\2212"; }
.abqc-fold-l { font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--c-gold2); }
.abqc-fold-v { font-size: .95rem; color: var(--c-ink2); }
.abqc-fold > .abqc-set { margin-bottom: 1rem; }
.abqc-landing .abqc-hero { padding-top: 0; }

/* Full screen: the site's logo sits centered at the top. On a phone the text-size buttons move to the left so the logo has the middle to itself. */
.abqc-float { justify-content: flex-end; }
.abqc-float-brand { position: absolute; left: 50%; top: 0; transform: translateX(-50%); justify-content: center; white-space: nowrap; }
.abqc-float-logo { object-position: center; }
@media (max-width: 700px) {
	.abqc-float { justify-content: flex-start; gap: 8px; }
	.abqc-float-btns { display: contents; }
	.abqc-float .abqc-fx { margin-left: auto; }
	.abqc-float-logo { height: 28px; max-width: calc(100vw - 250px); }
	.abqc-float-brand { max-width: calc(100vw - 250px); overflow: hidden; }
}

/* A written example of praying the passage. */
.abqc-pray { margin: .8rem 0 .4rem; padding: 1rem 1.1rem; background: var(--c-panel); border-left: 3px solid var(--c-gold); text-align: left; }
.abqc-pray .abqc-label { margin: 0 0 .5rem; }
.abqc-pray-text { margin: 0 0 .6rem; font-size: 1.12rem; line-height: 1.55; font-style: italic; }
.abqc-pray .abqc-fine { margin: 0; }
.abqc-prayoffer { margin: .4rem 0; }
.abqc-plain-pray { display: block; margin-top: .35em; font-size: .95em; }
html.abqc-full .abqc-prayoffer .abqc-pray { max-width: 60ch; margin-inline: auto; }

/* ==========================================================================
   The approved design (October 2026). Every control is a real, labeled button;
   one filled action per screen; sections set apart; the reference set large in
   the passage. The site's own faces and colors.
   ========================================================================== */
.abqc { --c-sans: Sora, system-ui, -apple-system, 'Segoe UI', sans-serif; --c-ink2: var(--contrast-2, #5E4F3C); --c-line2: var(--line-2, #CDBB96); --c-hl: #EBCB7C; }
.abqc.abqc-dark { --c-hl: #6B5220; }
.abqc-ico { display: inline-flex; flex: none; }
.abqc-ico svg { display: block; }

/* buttons */
.abqc-btn { min-height: 58px; padding: .5rem 1.6rem; border-width: 1.5px; font-size: .8rem; letter-spacing: .18em; }
.abqc-link { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 48px; padding: 0 1rem; border: 1.5px solid var(--c-ink); background: transparent; color: var(--c-ink); font-size: .68rem; letter-spacing: .14em; }
.abqc-link:hover { border-color: var(--c-gold2); color: var(--c-gold2); }
.abqc-alink { display: inline-flex; align-items: center; min-height: 48px; padding: 0 1rem; border: 1.5px solid var(--c-ink); color: var(--c-ink); text-decoration: none; }
.abqc-links { justify-content: center; gap: .6rem; }
.abqc-note { border-left: 0; border-top: 2px solid var(--c-rubric); }
.abqc-quote { padding-left: 0; border-left: 0; }

/* the first screen */
.abqc-hero .abqc-h1 { font-size: clamp(2.2rem, 5.4vw, 3.6rem); line-height: 1.06; letter-spacing: -.02em; max-width: 13em; }
.abqc-landing .abqc-hero .abqc-h1, .abqc-embedded.abqc-landing .abqc-h1 { font-size: clamp(1.9rem, 4.2vw, 2.9rem); }
.abqc-hero .abqc-lede { font-size: 1.3rem; }
.abqc-landing .abqc-orn { display: none; }
.abqc-start { gap: 1rem; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--c-line2); box-shadow: 0 30px 60px -40px rgba(60, 40, 10, .45); }
.abqc-start .abqc-label { font-size: .72rem; letter-spacing: .18em; }
.abqc-start .abqc-input { min-height: 68px; padding: 0 1.3rem; border-color: var(--c-line2); font-size: 1.6rem; }
.abqc-begin { min-height: 68px; font-size: .94rem; letter-spacing: .2em; }
.abqc-try { gap: .5rem .6rem; margin-top: 0; }
.abqc-try-l { font-size: .7rem; margin-right: .2rem; }
.abqc-chip { min-height: 44px; padding: 0 1rem; border: 1px solid var(--c-line2); color: var(--c-ink); font-size: 1.06rem; text-decoration: none; }
.abqc-chip:hover { border-color: var(--c-ink); color: var(--c-ink); }
.abqc-ways .abqc-btn { min-height: 56px; }
.abqc-fold { border: 0; text-align: center; }
.abqc-fold > summary { display: inline-flex; min-height: 48px; padding: 0 1.2rem; gap: .8rem; color: var(--c-gold2); }
.abqc-fold > summary::after { margin-left: .4rem; }
.abqc-fold-l { font-size: .78rem; letter-spacing: .16em; }
.abqc-fold-v { font-size: .86rem; color: var(--c-ink2); }
.abqc-fold > .abqc-set { text-align: left; margin-top: .6rem; }
.abqc-pick-card[aria-pressed="true"] { box-shadow: none; border: 1.5px solid var(--c-ink); }
@media (min-width: 720px) { .abqc-begin { flex: 0 0 12.5rem; } }

/* the session */
.abqc-top { font-size: .72rem; }
.abqc-session .abqc-headline { flex-direction: column; align-items: center; gap: .45rem; margin-top: 1.1rem; text-align: center; }
.abqc-session .abqc-headline .abqc-h2 { display: flex; align-items: center; gap: .9rem; font-family: var(--c-sans); font-weight: 700; font-size: .92rem; line-height: 1.2; letter-spacing: .26em; text-transform: uppercase; color: var(--c-rubric); }
.abqc-session .abqc-headline .abqc-h2::before, .abqc-session .abqc-headline .abqc-h2::after { content: ""; flex: none; width: 2.75rem; height: 1px; background: var(--c-gold); }
.abqc-text [data-cite] { font-family: var(--c-head); font-weight: 600; color: var(--c-gold2); }
.abqc-text [data-cite].abqc-later { color: color-mix(in srgb, var(--c-gold2) 55%, var(--c-paper)); }
.abqc-text .abqc-now { background: var(--c-hl); box-shadow: 0 0 0 5px var(--c-hl); }
.abqc-coach { background: transparent; padding: .2rem 0; align-items: center; }
.abqc-coach-say { font-size: 1.3rem; }
button.abqc-mic { border: 0; padding: 0; cursor: pointer; }
.abqc-mic { width: 96px; height: 96px; }
.abqc-mic svg { width: 36px; height: 36px; }
.abqc-foot { gap: .9rem; padding: 1.1rem; background: var(--c-panel); border-top: 1px solid var(--c-line); }
.abqc-foot .abqc-links .abqc-link { flex: 1 1 8.5rem; background: var(--c-card); border-color: var(--c-line2); }
.abqc-foot .abqc-links .abqc-link:hover { border-color: var(--c-ink); color: var(--c-ink); }
.abqc-stats { border-color: var(--c-line2); }

/* a prayer: its own dark panel */
.abqc-pray { margin: .6rem 0; padding: 1.4rem 1.4rem 1.5rem; background: #2A2118; color: #F6EEDD; border-left: 0; }
.abqc-pray .abqc-label { margin: 0 0 .7rem; font-size: .72rem; letter-spacing: .22em; color: #E0B04A; }
.abqc-pray-text { font-size: 1.22rem; color: #F6EEDD; }
.abqc-pray .abqc-fine { font-family: var(--c-sans); font-size: .78rem; line-height: 1.5; color: #D9CDB6; }
.abqc-dark .abqc-pray { background: var(--c-panel); }

/* lists */
.abqc-row-acts { display: flex; flex-wrap: wrap; gap: .5rem; }
.abqc-row-acts .abqc-link, .abqc-row-acts .abqc-alink { min-height: 44px; border-color: var(--c-line2); font-family: var(--c-sans); font-weight: 700; font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; }

/* full screen: a strip of the page's color with the logo in the middle, and square outlined buttons */
html.abqc-full .abqc-float { top: 0; left: 0; right: 0; height: calc(64px + env(safe-area-inset-top, 0px)); padding: env(safe-area-inset-top, 0px) 14px 0; background: var(--c-paper); border-bottom: 1px solid var(--c-line); pointer-events: auto; }
html.abqc-full .abqc-float-brand { top: calc(50% + env(safe-area-inset-top, 0px) / 2); transform: translate(-50%, -50%); }
.abqc-fbtn { min-width: 46px; height: 46px; border: 1px solid var(--c-line2); border-radius: 0; background: transparent; color: var(--c-ink); opacity: 1; font-family: var(--c-head); }
.abqc-fbtn:hover, .abqc-fbtn:focus-visible { border-color: var(--c-ink); }
.abqc-fbtn.abqc-fx { border-color: var(--c-ink); }
html.abqc-full .abqc-page { padding-top: 88px; }
html.abqc-full .abqc-session { padding-top: 80px; }
html.abqc-full .abqc-tight { padding-top: 72px; }
@media (min-width: 700px) { html.abqc-full .abqc-session .abqc-text:not(.abqc-marked) { text-align: center; } }

/* the dock: the microphone in the middle of it, and compact labeled buttons beneath */
.abqc-foot .abqc-micwrap { padding: .4rem 0 .2rem; gap: .9rem; }
.abqc-foot .abqc-miclabel { font-size: 1.05rem; color: var(--c-ink2); text-align: center; }
.abqc-foot .abqc-links .abqc-link { flex: 1 1 5.6rem; flex-direction: column; gap: .35rem; min-height: 62px; padding: .5rem .4rem; font-size: .6rem; letter-spacing: .1em; line-height: 1.2; text-align: center; }
html.abqc-full .abqc-session .abqc-headline .abqc-h2 { font-size: clamp(.86rem, 1.15vw, 1.2rem); white-space: nowrap; }
@media (max-width: 480px) { .abqc-session .abqc-headline .abqc-h2 { letter-spacing: .2em; gap: .6rem; } .abqc-session .abqc-headline .abqc-h2::before, .abqc-session .abqc-headline .abqc-h2::after { width: 1.5rem; } }
html.abqc-full .abqc-tight .abqc-foot .abqc-micwrap { flex-direction: row; }
/* 0.6.1: the voice can be changed from the listening screen */
.abqc-voice { display: flex; align-items: center; justify-content: space-between; flex-wrap: nowrap; gap: .4rem 1.25rem; }
.abqc .abqc-voice button.abqc-voicebtn { min-height: 44px; padding: 0 .1rem; border: 0; border-bottom: 1px solid var(--c-line2); border-radius: 0; background: none; box-shadow: none; color: var(--c-gold2); font-family: var(--c-sans); font-weight: 700; font-size: .68rem; line-height: 1.2; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; }
.abqc .abqc-voice button.abqc-voicebtn:hover, .abqc .abqc-voice button.abqc-voicebtn:focus { background: none; color: var(--c-rubric); border-bottom-color: var(--c-rubric); }
.abqc .abqc-voice button.abqc-voicebtn[disabled] { color: var(--c-ink2); border-bottom-color: transparent; cursor: default; }
html.abqc-full .abqc-tight .abqc-voice button.abqc-voicebtn { min-height: 32px; }
.abqc-voice > .abqc-coach { flex: 1 1 auto; min-width: 0; } .abqc .abqc-voice button.abqc-voicebtn { flex: none; }