:root { color-scheme: dark; font-family: "Fraunces", Georgia, serif; background: #0b1710; color: #f4ede0; }
* { box-sizing: border-box; }
body { margin: 0; background: #0b1710; }
main { min-height: 100vh; padding: 10vh 8vw 8vh; max-width: 38rem; }
.eyebrow, .language-label { color: #c45828; font: .68rem "DM Mono", Consolas, monospace; letter-spacing: .16em; text-transform: uppercase; }
h1 { margin: 0 0 1.4rem; font-size: clamp(3rem, 13vw, 6rem); line-height: .92; font-weight: 300; }
.intro { max-width: 31rem; color: #d8ceba; font-size: 1.15rem; line-height: 1.7; }
#status { min-height: 1.5rem; margin: 2rem 0 1.5rem; color: #c45828; font: .72rem "DM Mono", Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; }
.language-label { display: block; margin-top: 2rem; margin-bottom: .5rem; }
#language { width: 100%; min-height: 3rem; margin-bottom: 1.5rem; border: 1px solid #3a6b47; border-radius: 0; background: #132018; color: #f4ede0; padding: .7rem; font: 1rem "DM Mono", Consolas, monospace; }
#mic-level { height: .5rem; margin: 0 0 1.5rem; border: 1px solid #4f594f; }
#mic-level-fill { display: block; width: 0; height: 100%; background: #d4b56a; transition: width .08s linear; }
button { width: 100%; min-height: 4rem; margin: 0 0 1rem; border: 1px solid #c45828; border-radius: 0; background: #c45828; color: #0b1710; font: .78rem "DM Mono", Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; }
button:disabled { opacity: .55; }
#end { background: transparent; color: #f4ede0; }
#transcript { min-height: 8rem; margin: 1rem 0; padding: 1rem 0; border-top: 1px solid #4f594f; border-bottom: 1px solid #4f594f; white-space: pre-wrap; }
#choice-fallback { margin: 1rem 0; border-top: 1px solid #4f594f; padding-top: 1rem; }
#choice-fallback p { color: #c45828; }
#choice-fallback button { min-height: 3rem; background: transparent; color: #f1eee4; }
.line { margin: 0 0 .75rem; }
.speaker { color: #c45828; font-weight: 700; }
#error { border-left: 3px solid #c36e5a; padding-left: 1rem; }
#error button { min-height: 3rem; background: transparent; color: #f1eee4; }
#diagnostics { margin: 1rem 0; border-top: 1px solid #4f594f; color: #a8b0a6; font-size: .78rem; }
#diagnostics p { margin: .45rem 0; }
#diagnostics span { color: #c45828; }
.service-notice, .privacy-notice { color: #7a7566; font: .75rem "DM Mono", Consolas, monospace; line-height: 1.7; margin-top: 2rem; }
.privacy-notice { border-top: 1px solid #1e3325; padding-top: 1rem; }
[hidden] { display: none !important; }