:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#1c2b27;background:#f5f0e6;font-synthesis:none}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;overflow:hidden;background:radial-gradient(circle at 50% -10%,#fff9e9 0,transparent 38%),#f5f0e6}button,input{font:inherit}main{width:min(680px,100%);height:100dvh;min-height:0;margin:0 auto;padding:max(12px,env(safe-area-inset-top)) 18px max(18px,env(safe-area-inset-bottom));display:flex;flex-direction:column;overflow:hidden}.topline{display:flex;align-items:center;justify-content:center;gap:8px;color:#6b746f;text-transform:uppercase;font-size:10px;letter-spacing:.12em;font-weight:800}.topline span{width:8px;height:8px;border-radius:50%;background:#a6ada9}.topline span.live-dot{background:#2a9c6b;box-shadow:0 0 12px #5bc994}header{text-align:center;margin:14px 0 16px}.church-mark{width:36px;height:36px;margin:0 auto 7px;display:grid;place-items:center;border-radius:50%;color:#fff;background:#17352d;font-size:15px}header p{margin:0;color:#6c746f;font-size:13px}h1{margin:2px 0 4px;font-family:Georgia,serif;font-size:clamp(28px,7vw,40px);font-weight:500}.delay{color:#8a8d86;font-size:11px}.language-picker{display:grid;grid-template-columns:repeat(4,1fr);padding:5px;border-radius:16px;background:#e7e0d4}.language-picker button{border:0;border-radius:12px;padding:9px 4px;color:#67716c;background:transparent;cursor:pointer}.language-picker button strong,.language-picker button span{display:block}.language-picker button strong{font-size:13px}.language-picker button span{font-size:9px;margin-top:3px}.language-picker button.selected{color:#17352d;background:#fffdf8;box-shadow:0 5px 14px #2a37321f}.language-picker button:disabled{opacity:.35}.player{margin-top:10px;padding:14px 20px 12px;color:#fff;background:#172f29;border-radius:20px;box-shadow:0 20px 45px #18312a38;text-align:center}.wave{height:28px;display:flex;justify-content:center;align-items:center;gap:5px;margin-bottom:10px}.wave i{display:block;width:4px;border-radius:999px;background:linear-gradient(#f2c55f,#67ad8b);opacity:.82}.listen{min-width:180px;border:0;padding:12px 24px;border-radius:999px;color:#18302a;background:#f4c963;font-weight:850;font-size:16px;cursor:pointer}.listen:disabled{opacity:.5}.volume{margin:12px auto 0;max-width:300px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px;color:#c1cec8;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.volume input{accent-color:#f4c963;width:100%}.stream-status{margin-top:9px;color:#9eada7;font-size:10px}.stream-status i{display:inline-block;width:7px;height:7px;background:#9eada7;border-radius:50%;margin-right:7px}.stream-status.connected i{background:#51c38d}.captions{flex:1 1 auto;min-height:0;margin-top:10px;padding:14px 14px 12px;border:1px solid #e3dbcd;border-radius:18px;background:#fffdf8cc;display:flex;flex-direction:column}.captions.hidden{min-height:auto;flex:0 0 auto}.caption-title{display:flex;justify-content:space-between;align-items:center;color:#80857f;font-size:9px;letter-spacing:.12em;font-weight:800}.caption-title>span{display:flex;align-items:center;gap:9px}.caption-title em{color:#9b7951;font-size:8px;font-style:normal;letter-spacing:.04em;text-transform:none}.caption-title>div{display:flex;gap:5px}.caption-title button{border:0;color:#50615a;background:transparent;cursor:pointer}.caption-viewport{min-height:0;flex:1 1 auto;margin-top:10px;padding:4px 7px 18px 2px;overflow-y:auto;overscroll-behavior:contain;scroll-behavior:smooth;scrollbar-gutter:stable}.caption-copy{min-height:100%;margin:0;font-family:Georgia,serif;font-size:21px;line-height:1.48}.caption-final{color:#1f1c22}.caption-word{border-radius:.28em;transition:color .12s ease,background-color .12s ease,box-shadow .12s ease}.caption-word.spoken{color:#1f1c22}.caption-word.current{color:#172f29;background:#f4c963;box-shadow:0 0 0 .13em #f4c963}.caption-word.future{color:#aaa6ad}.caption-live{margin:0;color:#9a969e;font-style:italic}.caption-live small{display:block;margin-bottom:4px;font-family:ui-sans-serif,system-ui,sans-serif;font-size:8px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;font-style:normal;color:#aaa5ad}.caption-placeholder{color:#7d817d}.disclosure{color:#81847f;font-size:10px;line-height:1.55;text-align:center;margin:10px 22px 0}.offline-card{margin:auto 0;padding:48px 28px;text-align:center;border:1px solid #ded6ca;border-radius:24px;background:#fffdf9c2}.offline-card div{font-size:42px;color:#7c8b84}.offline-card h2{font-family:Georgia,serif;font-size:26px;margin:15px 0 8px}.offline-card p{color:#7d817d;font-size:13px}.error{margin-top:14px;padding:12px;text-align:center;color:#913140;background:#f7dfe1;border-radius:12px;font-size:12px}footer{margin-top:auto;padding-top:12px;text-align:center;color:#9b9b94;font-size:9px;letter-spacing:.05em}@media(max-width:440px){main{padding-left:14px;padding-right:14px}.language-picker button span,.church-mark{display:none}header{margin:8px 0 10px}header p{font-size:11px}h1{font-size:27px}.delay{font-size:9px}.wave{display:none}.player{padding:12px 14px 10px}.listen{min-width:160px}.caption-copy{font-size:19px}}@media(max-height:680px){header{margin:5px 0 7px}header p,.delay,.wave{display:none}h1{margin:0;font-size:24px}.language-picker button{padding:6px 4px}.player{margin-top:7px;padding:8px 12px 7px}.listen{padding:9px 20px}.volume{margin-top:7px}.stream-status,.disclosure{margin-top:6px}footer{padding-top:4px}}