@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--green:#123d31;--green2:#1c5745;--gold:#c7a65a;--cream:#f7f5ef;--paper:#fffefa;--ink:#172923;--muted:#7b8780;--line:#e7e8df;--shadow:0 18px 50px #153c2b0d}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:14px}h1,h2,h3,h4,.brand{font-family:Manrope,sans-serif}a{color:inherit;text-decoration:none}.app-shell{display:flex;min-height:100vh}.sidebar{width:258px;background:var(--green);color:#f9f7ef;padding:28px 18px;display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;z-index:10}.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:13px;letter-spacing:1.2px;padding:0 10px 42px}.brand small{display:block;font:9px 'DM Sans';letter-spacing:1.7px;color:#b9c9bd;margin-top:6px}.brand-mark{display:grid;place-items:center;background:var(--gold);color:var(--green);width:39px;height:39px;border-radius:14px;font-size:23px}.nav-label{font-size:10px;letter-spacing:2px;color:#91ab9d;padding:0 12px 13px}.nav-link{display:flex;gap:13px;align-items:center;padding:13px 14px;border-radius:12px;color:#c6d5cc;margin:3px 0;font-size:13px;transition:.25s}.nav-link:hover,.nav-link:focus{background:#ffffff13;color:white;transform:translateX(3px)}.nav-link span{font-weight:600}.sidebar-bottom{margin-top:auto}.user-chip{display:flex;align-items:center;gap:10px;padding:15px 8px;border-top:1px solid #ffffff20;margin-bottom:7px}.avatar,.top-avatar{display:grid;place-items:center;background:#d9c58b;color:var(--green);border-radius:50%;width:36px;height:36px;font-weight:800}.user-chip b,.user-chip small{display:block}.user-chip b{font-size:12px}.user-chip small{color:#a8c0b3;font-size:11px;margin-top:4px}.main-area{margin-left:258px;width:calc(100% - 258px);min-height:100vh}.topbar{height:78px;display:flex;align-items:center;justify-content:flex-end;padding:0 4.5%;border-bottom:1px solid var(--line);background:#f9f8f3}.topbar-right{display:flex;align-items:center;gap:12px;font-size:12px;font-weight:700}.live-dot{width:8px;height:8px;background:#55a67a;border-radius:50%;box-shadow:0 0 0 5px #55a67a19}.top-avatar{width:34px;height:34px}.mobile-brand{display:none}.page-content{padding:34px 4.5% 70px;max-width:1600px;margin:auto}.eyebrow{color:#9b7d35;font-size:10px;font-weight:800;letter-spacing:2.4px;text-transform:uppercase}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:28px}.page-heading h1{font-size:clamp(27px,3vw,40px);letter-spacing:-1.8px;margin:9px 0}.subtext{color:var(--muted);line-height:1.7}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:12px;padding:12px 18px;font-weight:700;font-size:12px;cursor:pointer;transition:.2s}.btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #123d3120}.btn-primary{background:var(--green);color:white}.btn-gold{background:var(--gold);color:var(--green)}.btn-light{background:#edf1eb;color:var(--green)}.grid{display:grid;gap:18px}.stats{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:22px}.stat,.panel,.form-card{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:23px;box-shadow:var(--shadow)}.stat-top{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;font-weight:600}.stat-icon{width:38px;height:38px;border-radius:12px;background:#eaf0e9;color:var(--green);display:grid;place-items:center;font-size:18px}.stat strong{display:block;font:800 30px Manrope;margin:17px 0 6px;letter-spacing:-1px}.stat small{color:var(--muted)}.two-col{grid-template-columns:1.3fr 1fr}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.panel-head h2{font-size:17px;margin:0}.panel-head a{font-size:12px;color:#8e7337;font-weight:700}.hero{background:var(--green);color:white;border-radius:26px;padding:38px 40px;position:relative;overflow:hidden;margin-bottom:24px;min-height:230px}.hero:after{content:'✦';position:absolute;font-size:300px;color:#ffffff08;right:25px;top:-90px}.hero h2{font-size:clamp(26px,3vw,38px);letter-spacing:-1.5px;max-width:600px;margin:12px 0}.hero p{color:#c6d6cc;max-width:550px;line-height:1.7}.hero .eyebrow{color:#d6bd78}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:23px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th{text-align:left;font-size:10px;color:#89948d;text-transform:uppercase;letter-spacing:1px;padding:12px;border-bottom:1px solid var(--line)}td{padding:15px 12px;border-bottom:1px solid #eff0e9;font-size:12px}tr:last-child td{border-bottom:0}.pill{display:inline-block;padding:6px 9px;border-radius:30px;font-size:10px;font-weight:800;background:#edf2ec;color:#326b4e}.pill.gold{background:#f6f0df;color:#92722d}.pill.red{background:#fae9e5;color:#a74a37}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.field{display:flex;flex-direction:column;gap:7px}.field.full{grid-column:1/-1}.field label{font-size:11px;font-weight:800;color:#58655d}.field input,.field select,.field textarea{width:100%;border:1px solid #dfe4dc;border-radius:11px;padding:12px 13px;background:#fffefa;font:13px 'DM Sans';outline:none;color:var(--ink)}.field input:focus,.field select:focus,.field textarea:focus{border-color:#7c9a87;box-shadow:0 0 0 3px #7c9a871c}.field textarea{min-height:95px;resize:vertical}.form-actions{display:flex;gap:10px;margin-top:20px}.empty{text-align:center;padding:32px;color:var(--muted)}.sermon-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.sermon-card{background:var(--paper);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow);transition:.25s}.sermon-card:hover{transform:translateY(-5px)}.sermon-art{height:160px;background:linear-gradient(135deg,#123d31,#27654e);display:grid;place-items:center;color:#d5bd7a;font-size:50px;position:relative}.play-button{position:absolute;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#ffffffed;color:var(--green);font-size:21px;box-shadow:0 8px 20px #0002}.sermon-info{padding:20px}.sermon-info h3{font-size:16px;margin:0 0 8px}.sermon-info p{color:var(--muted);font-size:12px;line-height:1.6}.modal{display:none;position:fixed;inset:0;background:#081b15d9;z-index:100;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(7px)}.modal.open{display:flex;animation:fade .2s}.modal-box{width:min(900px,100%);background:#101a16;border-radius:20px;overflow:hidden;box-shadow:0 25px 90px #0008;animation:rise .3s}.modal-head{display:flex;justify-content:space-between;align-items:center;color:white;padding:16px 20px}.modal-head button{background:#ffffff18;color:white;border:0;border-radius:10px;padding:8px 12px;cursor:pointer}.video-frame{aspect-ratio:16/9;background:#000}.video-frame iframe{width:100%;height:100%;border:0}.modal-caption{padding:18px 22px;color:white}.modal-caption p{color:#b4c0b9;font-size:12px}.mobile-nav{display:none}.alert{padding:13px 16px;border-radius:12px;background:#e9f3e9;color:#2e6947;margin-bottom:18px;font-size:13px}.alert.error{background:#fae9e5;color:#a74a37}.auth-wrap{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:var(--cream)}.auth-art{background:var(--green);color:white;padding:8%;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.auth-art h1{font-size:clamp(35px,5vw,64px);letter-spacing:-3px;line-height:1.1;max-width:560px}.auth-art p{color:#c4d3c9;line-height:1.8;max-width:450px}.auth-panel{display:grid;place-items:center;padding:30px}.auth-card{width:min(420px,100%)}.auth-card h2{font-size:30px;letter-spacing:-1px}.auth-card .field{margin:15px 0}.auth-card .btn{width:100%;padding:15px}.notice{font-size:12px;color:var(--muted);line-height:1.7;margin-top:20px}@keyframes fade{from{opacity:0}to{opacity:1}}@keyframes rise{from{transform:translateY(15px) scale(.98);opacity:0}to{transform:none;opacity:1}}@media(max-width:1100px){.stats{grid-template-columns:repeat(2,1fr)}.sermon-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.sidebar{display:none}.main-area{margin:0;width:100%;padding-bottom:75px}.topbar{height:64px;padding:0 20px;justify-content:space-between}.mobile-brand{display:block;font:800 14px Manrope;color:var(--green)}.topbar-right{font-size:11px}.page-content{padding:24px 17px 35px}.page-heading{align-items:flex-start;flex-direction:column;margin-bottom:22px}.page-heading h1{font-size:29px}.hero{padding:28px 24px;border-radius:22px}.hero h2{font-size:28px}.stats{gap:10px}.stat{padding:16px;border-radius:16px}.stat strong{font-size:25px;margin:12px 0 4px}.stat-top{font-size:10px}.stat-icon{width:32px;height:32px}.two-col,.sermon-grid{grid-template-columns:1fr}.panel,.form-card{padding:18px;border-radius:17px}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;background:#fffefa;border-top:1px solid var(--line);height:70px;z-index:20;justify-content:space-around;padding:7px 4px max(7px,env(safe-area-inset-bottom));box-shadow:0 -8px 30px #123d310b}.mobile-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:55px;color:#718077}.mobile-nav b{font-size:21px;font-weight:500}.mobile-nav small{font-size:9px;font-weight:700}.auth-wrap{grid-template-columns:1fr}.auth-art{display:none}.auth-panel{min-height:100vh;padding:25px}.modal{padding:10px}.modal-box{border-radius:14px}.video-frame{aspect-ratio:16/9}.table-wrap{margin:0 -8px}.form-actions{flex-wrap:wrap}}
/* Accessible mobile navigation drawer */
.menu-toggle{display:none;border:0;background:transparent;color:inherit;font-size:24px;padding:8px;cursor:pointer}.mobile-scrim{display:none}.mobile-nav button{border:0;background:transparent;color:inherit;display:grid;gap:3px;justify-items:center;font:inherit;cursor:pointer}.mobile-nav button b{font-size:20px}.mobile-nav button small{font-size:10px}
@media(max-width:900px){.sidebar{transform:translateX(-105%);transition:transform .25s ease;box-shadow:20px 0 60px #0003;width:min(300px,85vw);overflow-y:auto}.sidebar.mobile-open{transform:translateX(0)}.mobile-scrim.active{display:block;position:fixed;inset:0;background:#071a13a8;z-index:9}.main-area{margin-left:0!important;width:100%}.menu-toggle{display:inline-flex;align-items:center;justify-content:center}.mobile-brand{display:flex!important;align-items:center;gap:10px}.mobile-nav{display:flex!important;position:fixed;bottom:0;left:0;right:0;z-index:8;justify-content:space-around;padding:9px 8px calc(9px + env(safe-area-inset-bottom));background:#fffefa;border-top:1px solid var(--line);box-shadow:0 -8px 30px #153c2b10}.page-content{padding-bottom:100px!important}}

/* Mobile drawer fix: keep sidebar rendered and slide it over the scrim */
@media(max-width:900px){.sidebar{display:flex!important;visibility:visible!important;position:fixed!important;top:0;bottom:0;left:0;right:auto;z-index:120!important;transform:translateX(-110%);transition:transform .28s ease;max-height:100dvh;overflow-y:auto}.sidebar.mobile-open{transform:translateX(0)!important}.mobile-scrim{display:block!important;position:fixed;inset:0;background:#071a13a8;z-index:110!important;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s}.mobile-scrim.active{opacity:1;visibility:visible;pointer-events:auto}.mobile-nav{z-index:100!important}}

/* Facebook Live replay: preserve full native frame and avoid iframe zoom/cropping */
.video-frame{width:100%;height:auto;aspect-ratio:16/9;max-height: min(70vh,720px);overflow:hidden;position:relative;background:#000}.video-frame iframe{display:block;width:100%!important;height:100%!important;min-height:0!important;max-width:100%;border:0;transform:none;object-fit:contain}.modal-box{width:min(960px,96vw);max-height:94vh;overflow-y:auto}
/* Reliable responsive Facebook sermon playback: preserve the complete 16:9 frame. */
.video-frame{position:relative;width:100%;height:auto;aspect-ratio:16/9;overflow:hidden;background:#000}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;display:block;border:0}
.modal{overflow-y:auto;align-items:flex-start}
.modal-box{margin:auto;max-height:calc(100dvh - 40px);overflow-y:auto}
@media(max-width:600px){.modal{padding:10px}.modal-box{border-radius:14px;max-height:calc(100dvh - 20px)}.video-frame{aspect-ratio:16/9}}

/* Responsive sermon player: preserve the full 16:9 frame without zoom/cropping */
#sermonFrame,.modal-frame{width:100%;aspect-ratio:16/9;max-height:70vh;background:#000;overflow:hidden;position:relative}
#sermonFrame iframe,.modal-frame iframe{display:block!important;width:100%!important;height:100%!important;min-height:0!important;max-width:100%!important;border:0!important;position:absolute;inset:0}
.modal-box{width:min(960px,96vw);max-height:94vh;overflow:auto}
@media(max-width:600px){#sermonFrame,.modal-frame{aspect-ratio:16/9;max-height:60vh}.modal{padding:10px}.modal-box{max-height:calc(100dvh - 20px)}}