:root { color-scheme: light; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; background: #092b26; color: #fff; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; }
.app { min-height: 100dvh; display: flex; flex-direction: column; gap: 1rem; padding: max(1rem, env(safe-area-inset-top)) 1rem max(1rem, env(safe-area-inset-bottom)); }
button { width: 100%; border: 0; cursor: pointer; font: inherit; font-weight: 750; }
.app-title { margin: 0; color: #fff; font-size: clamp(1.75rem, 7vw, 2.5rem); line-height: 1.1; text-align: center; }
.passage-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
.passage-part { min-width: 0; padding: .75rem; border-radius: 1rem; background: #123c36; }
.passage-label { display: block; color: #bcd9d2; font-size: clamp(.75rem, 3vw, 1rem); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.passage-value { display: block; min-height: 1.3em; overflow: hidden; color: #fff; font-size: clamp(1rem, 4.5vw, 1.5rem); font-weight: 750; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.voice-button { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 18rem; border-radius: 1.5rem; background: #123c36; color: #fff; font-size: clamp(2rem, 10vw, 4rem); line-height: 1.15; padding: 1rem; }
.voice-instruction { display: block; min-height: 1.3em; margin-top: 1rem; color: inherit; font-size: clamp(1.5rem, 7vw, 2.5rem); font-weight: 750; line-height: 1.15; text-align: center; }
.voice-instruction:empty { display: none; }
.listening .voice-button { background: #4ee38c; color: #062319; }
.voice-button:focus-visible { outline: .3rem solid #fff; outline-offset: -.6rem; }
.mic { display: block; font-size: clamp(3rem, 15vw, 5rem); line-height: 1; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (prefers-reduced-motion: no-preference) { button { transition: transform .12s ease; } button:active { transform: scale(.99); } }
