/* Shared identity for the HTML startup screen and React sign-in page. No external font required. */
:root { --entry-ink:#152e40; --entry-muted:#607380; --entry-line:#dbe3e7; --entry-blue:#215b85; --entry-paper:#f7f9fa; }
.crystal-entry, #caritas-splash { font-family:'Segoe UI',Roboto,Helvetica,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
.crystal-entry, .crystal-entry *, #caritas-splash, #caritas-splash * { box-sizing:border-box; }
.crystal-entry { min-height:100vh; min-height:100svh; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(400px,1fr); background:var(--entry-paper); color:var(--entry-ink); }
.entry-story { position:relative; overflow:hidden; min-height:100svh; display:flex; flex-direction:column; padding:42px clamp(36px,5vw,84px); background:#102b3d; color:#f3f8fa; }
.entry-story::before { content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse at 70% 42%,#255a705c,transparent 60%),linear-gradient(130deg,transparent 56%,#8dbac207 56.1%,transparent 56.3%); }
.entry-brand { display:flex; align-items:center; gap:13px; position:relative; }
.entry-brand img { width:31px; height:42px; }
.entry-wordmark { font-size:29px; line-height:1; letter-spacing:-1px; font-weight:600; }
.entry-wordmark span { display:block; font-size:9px; font-weight:600; letter-spacing:4px; margin-top:8px; margin-left:2px; }
.entry-story-content { position:relative; margin:auto 0; padding:60px 0 32px; max-width:560px; }
.entry-eyebrow { display:block; font-size:10px; letter-spacing:2.5px; line-height:1.8; font-weight:600; text-transform:uppercase; }
.entry-story .entry-eyebrow { color:#a6c7d1; }
.entry-story h2 { font-size:clamp(39px,4.1vw,66px); line-height:1.08; letter-spacing:-2.4px; font-weight:450; margin:24px 0; }
.entry-story h2 em { color:#b2dfdf; font-family:Georgia,'Times New Roman',serif; font-weight:400; letter-spacing:-1.7px; }
.entry-story-description { color:#b8cbd3; font-size:15px; line-height:1.8; max-width:365px; margin:0; }
.entry-constellation { height:235px; position:relative; margin:32px 0 24px; max-width:410px; }
.entry-orbit { position:absolute; border:1px solid #afd8e222; border-radius:50%; width:300px; height:180px; left:50%; top:50%; transform:translate(-50%,-50%) rotate(-23deg); }
.entry-orbit + .entry-orbit { width:210px; height:210px; transform:translate(-50%,-50%) rotate(26deg); border-color:#afd8e215; }
.entry-crystal { position:absolute; width:98px; height:132px; left:50%; top:50%; transform:translate(-50%,-50%); filter:drop-shadow(0 15px 32px #61c5d932); }
.entry-node { position:absolute; border:1px solid #678da546; border-radius:8px; background:#17374b; padding:9px 13px; color:#e4eff3; font-size:11px; letter-spacing:.2px; display:flex; align-items:center; gap:8px; box-shadow:0 6px 25px #071b2a22; }
.entry-node i { display:block; width:5px; height:5px; border-radius:50%; background:var(--node-color,#abd9dd); }
.entry-node:nth-of-type(1) { left:0; top:28px; }
.entry-node:nth-of-type(2) { right:0; top:48px; }
.entry-node:nth-of-type(3) { left:10px; bottom:33px; }
.entry-node:nth-of-type(4) { right:9px; bottom:14px; }
.entry-story-footer { position:relative; border-top:1px solid #adc6d026; padding-top:20px; font-size:11px; color:#9db6c2; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; }
.entry-form-side { display:flex; flex-direction:column; justify-content:center; min-width:0; padding:44px clamp(28px,5vw,80px) 26px; }
.entry-mobile-brand { display:none; margin-bottom:42px; }
.entry-form-wrap { width:100%; max-width:410px; margin:auto; padding:48px 0; }
.entry-form-wrap>.entry-eyebrow { color:#667f8e; }
.entry-form-wrap h1 { font-size:clamp(29px,2.8vw,40px); font-weight:600; line-height:1.16; letter-spacing:-1.3px; margin:17px 0 13px; }
.entry-intro { color:var(--entry-muted); font-size:14px; line-height:1.7; margin:0 0 30px; max-width:360px; }
.entry-form { display:grid; gap:21px; }
.entry-field label { display:block; font-size:12px; font-weight:600; margin-bottom:9px; }
.entry-input-shell { display:flex; align-items:center; gap:11px; background:#fff; border:1px solid #cedae1; border-radius:9px; padding:0 15px; min-height:54px; transition:border-color .15s,box-shadow .15s; }
.entry-input-shell:focus-within { border-color:#397397; box-shadow:0 0 0 3px #34769612; }
.entry-input-shell.invalid { border-color:#ac3945; }
.entry-input-shell>.MuiSvgIcon-root { width:19px; height:19px; color:#7b939f; flex-shrink:0; }
.entry-input-shell input { min-width:0; width:100%; border:0; outline:0; background:transparent; padding:16px 0; color:var(--entry-ink); font:inherit; font-size:14px; }
.entry-input-shell input::placeholder { color:#8a9aa4; opacity:1; }
.entry-input-shell:has(input:disabled) { opacity:.65; }
.entry-password-toggle { display:grid; place-items:center; width:40px; height:44px; padding:0; margin-right:-9px; border:0; border-radius:6px; background:transparent; color:#607988; cursor:pointer; flex-shrink:0; }
.entry-password-toggle:hover { background:#edf3f5; }
.entry-password-toggle .MuiSvgIcon-root { width:19px; height:19px; }
.entry-field-error { color:#a13441; font-size:12px; margin:7px 0 0; }
.entry-caps-lock { font-size:12px; color:#866219; margin:8px 0 0; }
.entry-submit { display:flex; align-items:center; justify-content:center; gap:12px; min-height:54px; padding:14px 22px; width:100%; border:1px solid var(--entry-ink); border-radius:9px; background:var(--entry-ink); color:#fff; font:inherit; font-size:14px; font-weight:600; cursor:pointer; transition:background .15s,box-shadow .15s; margin-top:5px; }
.entry-submit:hover:not(:disabled) { background:#22475e; box-shadow:0 5px 16px #183c5018; }
.entry-submit:disabled { opacity:.7; cursor:wait; }
.entry-submit .MuiSvgIcon-root { width:18px; height:18px; }
.crystal-entry :is(button,summary,a):focus-visible { outline:3px solid #4084ad; outline-offset:4px; }
.entry-feedback { margin:0 0 22px; padding:13px 15px; border:1px solid #e8cbd0; border-radius:8px; background:#fff2f3; color:#913643; font-size:13px; line-height:1.6; }
.entry-feedback.session { color:#526d80; background:#ecf3f7; border-color:#d5e1e9; }
.entry-access-note { display:flex; gap:8px; align-items:flex-start; justify-content:center; color:#5d7381; font-size:11px; line-height:1.6; margin:17px 0 28px; }
.entry-access-note .MuiSvgIcon-root { width:14px; height:14px; margin-top:1px; flex-shrink:0; }
.entry-help { border-top:1px solid var(--entry-line); padding-top:22px; color:var(--entry-muted); font-size:12px; line-height:1.7; }
.entry-help summary { cursor:pointer; width:fit-content; color:#31586c; border-radius:3px; }
.entry-help p { margin:12px 0 0; }
.entry-form-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; width:100%; max-width:410px; margin:0 auto; color:#607380; font-size:10px; }
.entry-spinner { width:16px; height:16px; border:2px solid #ffffff60; border-top-color:#fff; border-radius:50%; animation:entry-spin .8s linear infinite; }
@keyframes entry-spin { to { transform:rotate(360deg); } }
/* The startup view is rendered by HTML, including when the JavaScript bundle cannot load. */
#caritas-splash { position:fixed; inset:0; z-index:99999; display:flex; align-items:center; justify-content:center; overflow:auto; min-height:100svh; background:#102b3d; color:#f3f8fa; padding:32px 24px; transition:opacity .22s ease,visibility .22s ease; }
#caritas-splash::before { content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse at 50% 42%,#23586d70,transparent 62%); }
#caritas-splash.hidden { opacity:0; visibility:hidden; pointer-events:none; }
.splash-inner { position:relative; text-align:center; margin:auto; width:100%; max-width:440px; }
.splash-emblem { position:relative; width:180px; height:180px; display:grid; place-items:center; margin:0 auto 24px; }
.splash-emblem::before,.splash-emblem::after { content:''; position:absolute; inset:0; border:1px solid #b1dee321; border-radius:50%; transform:rotate(-25deg) scaleY(.65); }
.splash-emblem::after { inset:20px; transform:rotate(35deg); border-color:#b1dee313; }
.splash-emblem img { width:76px; height:102px; filter:drop-shadow(0 0 28px #9cdbf02b); }
.splash-wordmark { font-size:44px; font-weight:500; letter-spacing:-1.8px; line-height:1.1; margin:0; }
.splash-wordmark span { display:block; font-size:10px; font-weight:600; letter-spacing:6px; margin:12px 0 0 6px; color:#a9c6d1; }
.splash-tagline { color:#c0d4dc; font-size:13px; line-height:1.8; margin:28px 0; }
.splash-progress { width:132px; height:2px; background:#436071; overflow:hidden; margin:32px auto 18px; border-radius:2px; }
.splash-progress-bar { height:100%; width:45%; background:#b1dee3; animation:entry-progress 1.6s ease-in-out infinite; }
@keyframes entry-progress { from { transform:translateX(-105%); } to { transform:translateX(325%); } }
.splash-hint { font-size:11px; color:#98b6c4; line-height:1.8; margin:0; }
.splash-retry { margin:20px auto 0; border:1px solid #7fa7b8; border-radius:8px; background:#214458; color:#f0f8fc; padding:12px 20px; font:inherit; font-size:13px; cursor:pointer; }
.splash-retry:focus-visible { outline:3px solid #abd9dd; outline-offset:4px; }
.splash-retry[hidden],.splash-progress[hidden] { display:none; }
.splash-footer { position:absolute; bottom:26px; left:24px; right:24px; text-align:center; color:#7695a5; font-size:10px; letter-spacing:.5px; }
.splash-failure-title { font-size:23px; line-height:1.35; font-weight:500; margin:28px 0 12px; }
@media(min-width:1600px) { .entry-story-content { margin-left:auto; margin-right:auto; width:100%; } }
@media(max-width:1000px) { .crystal-entry { grid-template-columns:minmax(0,1fr) minmax(360px,1fr); } .entry-story { padding:32px; } .entry-form-side { padding:32px; } .entry-story h2 { font-size:42px; } .entry-node { font-size:10px; padding:8px 10px; } }
@media(max-width:760px) { .crystal-entry { display:block; } .entry-story { display:none; } .entry-mobile-brand { display:flex; } .entry-form-side { min-height:100vh; min-height:100svh; padding:32px 24px 22px; } .entry-form-wrap { padding:0 0 32px; } .entry-form-wrap h1 { font-size:34px; } .entry-form-footer { padding-top:16px; border-top:1px solid var(--entry-line); } }
@media(max-width:360px) { .entry-form-side { padding:26px 20px 20px; } .entry-form-wrap h1 { font-size:30px; } }
@media(max-height:650px) and (min-width:761px) { .entry-story-content { padding:24px 0; } .entry-constellation { height:155px; margin:16px 0; } .entry-story h2 { font-size:40px; } .entry-form-wrap { padding:10px 0 24px; } }
@media(prefers-reduced-motion:reduce) { .crystal-entry *,#caritas-splash,#caritas-splash * { animation:none!important; transition:none!important; } .splash-progress-bar { width:100%; opacity:.65; } }

.entry-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
#caritas-splash { flex-direction:column; gap:24px; }
.splash-footer { position:relative; bottom:auto; left:auto; right:auto; flex-shrink:0; }
@media(max-height:550px) { #caritas-splash { padding:16px 24px; gap:16px; } .splash-emblem { width:80px; height:80px; margin-bottom:12px; } .splash-emblem img { width:45px; height:60px; } .splash-wordmark { font-size:30px; } .splash-tagline { margin:12px 0; } .splash-progress { margin:16px auto 12px; } }