:root{--brand-navy:#233e59;--brand-blue:#086da9;--brand-blue-hover:#064d7d;--text:#233d56;--muted:#536a7e;--border:#d8e2e9;--focus:#e79e23}
:root{font-family:"Lato", "Segoe UI",Arial,sans-serif;color:var(--text);background:#f2f6f9;font-size:17px}*{box-sizing:border-box}body{margin:0;border-top:7px solid #0879c0}main{max-width:820px;margin:auto;padding:28px 20px 56px}.site-header{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:28px;padding:14px 0 26px;border-bottom:1px solid #d2dfe8}.church-logo{display:block;width:min(100%,430px);height:auto}.product-name{border-left:3px solid #0879c0;padding-left:15px;color:#243f59;font-weight:700;white-space:nowrap}.product-name span{display:block;color:var(--muted);font-size:.72rem;font-weight:400;white-space:normal;line-height:1.4;margin-top:4px}section{background:white;border:1px solid var(--border);border-radius:8px;padding:28px;margin-bottom:20px;box-shadow:0 3px 16px rgba(30,60,85,.05)}section.notice{background:#fff8e4;border-color:#e6d4a3;line-height:1.55;color:#493d21}h1,h2{color:var(--brand-navy);margin-top:0;line-height:1.2}h1{font-family:Georgia,serif;font-size:2rem;font-weight:500}h2{font-family:Georgia,serif;font-size:1.45rem;font-weight:500}p{line-height:1.6}label{display:block;font-weight:700;margin:16px 0 7px}input,select{width:100%;min-height:48px;padding:11px;border:1px solid #8fa5b5;border-radius:5px;font:inherit;background:white;color:var(--text)}button{background:var(--brand-blue);color:white;border:0;border-radius:5px;min-height:48px;padding:12px 20px;font:inherit;font-weight:700;cursor:pointer}button:hover:not(:disabled){background:var(--brand-blue-hover)}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--focus);outline-offset:3px}button:disabled{opacity:.5;cursor:not-allowed}.buttons{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}meter{width:100%;height:24px}#timer{font-variant-numeric:tabular-nums;font-size:1.3rem}audio{display:block;width:100%;margin-top:16px}audio[hidden]{display:none}a{color:#075e96;font-weight:700}#recoveries p{display:flex;gap:10px;flex-wrap:wrap}@media(max-width:620px){.site-header{align-items:flex-start;flex-direction:column;gap:16px}.church-logo{max-width:360px}.product-name{white-space:normal}section{padding:20px}h1{font-size:1.7rem}}
/* Keep intrinsic widths of logos, controls and long device names inside the viewport. */
html,body{width:100%;max-width:100%}
main,section,.site-header,.product-name,.controls,#recoveries,#organizations{min-width:0;max-width:100%}
.site-header{justify-content:flex-start}
.church-logo{flex:0 1 430px;min-width:0;max-width:calc(100% - 250px);object-fit:contain;object-position:left center}
.product-name{flex:1 1 220px;overflow-wrap:anywhere;white-space:normal}
input,select,meter,audio,button{max-width:100%;min-width:0}
select{overflow:hidden;text-overflow:ellipsis}
section,p,#identity,#account-status,#status{overflow-wrap:anywhere}
#recoveries button{white-space:normal;text-align:left}
@media(max-width:620px){main{padding:20px 14px 40px}.site-header{display:block;padding:8px 0 20px}.church-logo{width:100%;max-width:360px}.product-name{margin-top:16px}.buttons button{flex:1 1 150px}.controls button{width:100%}}
@media(max-width:360px){section{padding:16px}.buttons button{flex-basis:100%}}

button,input,select{font-family:inherit;line-height:1.4}button{white-space:normal;overflow-wrap:anywhere}h1,h2{font-family:Georgia,serif;font-weight:500}#organizations button{margin:6px 8px 6px 0}

.controls{margin-top:16px}
details{margin-top:20px;padding-top:18px;border-top:1px solid var(--border)}summary{cursor:pointer;font-weight:700;color:var(--brand-blue);min-height:44px;display:list-item}details form{margin-bottom:12px}
