/* T21: the approved blue-card target. Font files are local (SIL OFL). */
@font-face{font-family:Emma Montserrat;src:url('/fonts/montserrat-latin-600-normal.woff2') format('woff2');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:Emma Cinzel;src:url('/fonts/cinzel-latin-600-normal.woff2') format('woff2');font-style:normal;font-weight:600;font-display:swap}
#loginView.login-wrap{display:block;width:100%;height:auto;min-height:100svh;color:#fff;color-scheme:dark;background:radial-gradient(ellipse at 50% 15%,#4279ac 0%,#346699 55%,#2d5987 100%);padding:0;font-family:"Segoe UI",Arial,sans-serif}
#loginView .login-panel{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;min-height:100svh;gap:0;transform:none;padding:calc(24px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:transparent}
#loginView .login-composition{width:100%;max-width:430px;min-width:0;padding:62px 38px 58px;background:linear-gradient(145deg,#285175,#32638e 44%,#1e4263);border:1px solid #ffffff12;border-radius:28px;box-shadow:0 20px 70px #14334e26}
#loginView .emma-brand{display:flex;align-items:center;flex-direction:column;gap:26px;margin:0 0 48px}
#loginView .emma-emblem,.eem-loader-logo{display:block;width:88px;height:88px;flex:none;background:#ffdf29;-webkit-mask:var(--em-logo) center/contain no-repeat;mask:var(--em-logo) center/contain no-repeat}
#loginView .emma-wordmark{font-family:Emma Montserrat,"Segoe UI",sans-serif;font-size:25px;line-height:1.3;font-weight:600;letter-spacing:.2em;padding-left:.2em;color:#fff;white-space:nowrap}
#loginView .emma-form-card{width:100%;padding:0;margin:0;background:transparent;border:0;border-radius:0;box-shadow:none;color:#fff}
#loginView .emma-form-card .login-kicker{font-size:11px;font-weight:600;line-height:1.4;letter-spacing:.16em;text-align:center;color:#bdd3e6;margin:0}
#loginView .emma-form-card h2{margin:6px 0 30px;font-size:27px;line-height:1.2;font-weight:600;letter-spacing:-.02em;text-align:center;color:#fff}
#loginView .emma-form-card .field{display:block;margin:0 0 18px;min-width:0}
#loginView .emma-form-card .field label{display:block;color:#fff;font-size:12px;line-height:1.3;font-weight:600;letter-spacing:0;margin:0}
#loginView .emma-form-card .field input{display:block;margin-top:8px;width:100%;height:48px;padding:12px 14px;border:1px solid #ffffff38;border-radius:12px;background:#ffffff0c;color:#fff;font:400 16px/1.3 "Segoe UI",Arial,sans-serif;box-shadow:none}
#loginView .emma-form-card .field input:focus{outline:2px solid #ffe23a;outline-offset:2px;border-color:#ffe23a;background:#ffffff14;box-shadow:none}
#loginView .emma-form-card .login-options{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0 10px;margin:-2px 0 12px}
#loginView .emma-form-card .login-remember{display:flex;align-items:center;gap:7px;min-height:44px;font-size:11px;font-weight:500;color:#fff}
#loginView .emma-form-card .login-remember input{width:18px;height:18px;margin:0;accent-color:#ffdf29;color-scheme:light}
#loginView .emma-form-card .login-saved-btn{min-height:44px;padding:0;border:0;background:transparent;font:500 11px/1.3 "Segoe UI",Arial,sans-serif;color:#fff;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#ffffff80}
#loginView .emma-form-card .emma-submit{display:block;width:100%;height:48px;margin:0;padding:12px 14px;border:0;border-radius:12px;background:#ffdf29;color:#16324b;font:600 15px/1.3 "Segoe UI",Arial,sans-serif}
#loginView .emma-form-card .emma-submit:hover{background:#ffe968}
#loginView .emma-form-card .emma-submit:disabled{opacity:.7;cursor:wait}
#loginView .emma-scripture{display:block;width:100%;margin:38px auto 0;padding:30px 0 0;border-top:1px solid #ffffff29;text-align:center}
#loginView .emma-scripture .verse{margin:0;padding:0;border:0;font:400 14px/1.65 "Segoe UI",Arial,sans-serif;color:#fff;text-align:center;text-wrap:balance}
#loginView .emma-scripture .verse-ref{color:#ffdf29;font-size:12px;font-weight:600;line-height:1.5;letter-spacing:.04em;margin:12px 0 0;text-align:center}
@media(max-width:600px){#loginView .login-panel{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}#loginView .login-composition{max-width:430px;min-height:100svh;padding:58px 34px 48px}}
@media(max-width:359px){#loginView .login-composition{padding-left:24px;padding-right:24px}#loginView .emma-wordmark{font-size:23px}}
/* Only the pre-app opening screen gets the blue logo loader. In-app loading
   uses the original page/section placeholders from c24ad38. */
#sessionRestore:not(.retry){display:flex;align-items:center;justify-content:center;width:100%;min-height:100svh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:radial-gradient(ellipse at 50% 15%,#4279ac 0%,#346699 55%,#2d5987 100%)}
.eem-loader-logo{background:#ffe23a;animation:eem-breathe 1.6s ease-in-out infinite}
@keyframes eem-breathe{0%,100%{opacity:.65;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}
@media(prefers-reduced-motion:reduce){.eem-loader-logo{animation:none}}
#loginView.hidden,#sessionRestore.hidden{display:none}
#formationResourcesDraft{width:100%;min-width:0}
#formationResourcesDraft .formation-resource-draft{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,.9fr) minmax(0,1.55fr) auto;gap:7px;align-items:end;margin-bottom:12px}
#formationResourcesDraft .field{margin:0;min-width:0}
#formationResourcesDraft input{min-width:0;max-width:100%}
#formationResourcesDraft .forResFile{display:none}
#formationResourcesDraft .forResFileLabel{display:block;font-size:11px;font-weight:700;color:var(--muted);margin-bottom:6px}
#formationResourcesDraft .forResChoose{min-height:38px}
#formationResourcesDraft .forResFileName,#formationResourcesDraft .forResStatus{display:block;margin-top:6px;overflow-wrap:anywhere;word-break:break-word}
#formationResourcesDraft .forResProgress{width:100%;display:block;margin-top:6px}
#formationResourcesDraft .forResProgress.hidden{display:none}
@media(max-width:700px){
 #modalRoot .modal:has(#formationResourcesDraft){width:100%;max-width:100%;margin:0}
 #modalRoot .modal:has(#formationResourcesDraft) .modal-body{padding:16px;min-width:0}
 #formationResourcesDraft .formation-resource-draft{grid-template-columns:minmax(0,1fr);padding:12px;gap:10px}
 #formationResourcesDraft .formation-resource-draft>.btn{justify-self:start}
}