*{box-sizing:border-box}body{margin:0;background:#f6f8f7;color:#183b3c;font:16px Tahoma,Arial,sans-serif}main{max-width:450px;margin:8vh auto;padding:34px;background:#fff;border:1px solid #e4ebe7;border-radius:18px}h1{font:700 38px Arial;color:#14766c;margin:0 0 24px}h2{font-size:22px}p{line-height:1.9;color:#617773}label{display:block;margin-top:20px}input{display:block;width:100%;padding:13px;margin-top:9px;border:1px solid #bdcec8;border-radius:8px;font:inherit}button{margin-top:25px;padding:13px 20px;background:#14766c;border:0;color:#fff;border-radius:8px;font:inherit;cursor:pointer}button:disabled{opacity:.5}[role=alert]{color:#a44c36}a{color:#14766c}@media(max-width:500px){main{margin:20px;padding:25px}}
main.portal{max-width:800px;margin:4vh auto}.portal h2{margin-top:24px}.portal-heading,.month-select{display:flex;align-items:center;justify-content:space-between;gap:15px}.portal-heading h2,.portal-heading p,.portal-heading button{margin:0}.portal .secondary{color:#14766c;background:#e7f2ef}.portal select,.portal textarea{display:block;width:100%;padding:10px;margin-top:8px;font:inherit;border:1px solid #bdcec8;border-radius:8px}.portal .month-select{justify-content:flex-start}.shift-list{margin:18px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:8px}.shift-list div,.request-card,.portal details{padding:14px;border:1px solid #e4ebe7;border-radius:10px}.shift-list time{display:block;font-size:13px;color:#617773;margin-bottom:7px}.request-card,.portal details{margin:10px 0}.request-card p{margin:6px 0}.request-card button{margin-top:8px}.portal summary{cursor:pointer;font-weight:bold}@media(max-width:850px){main.portal{margin:16px}}

body{min-height:100dvh;background:radial-gradient(ellipse at 15% 12%,#d9eee7 0,transparent 46%),radial-gradient(ellipse at 90% 90%,#e3eeea 0,transparent 48%),#f5f8f6;padding:1px 16px}
main{max-width:480px;margin:7vh auto;padding:40px;border-radius:26px;border:1px solid #e0eae5;box-shadow:0 16px 60px #173b3510}
h1{font-size:40px;letter-spacing:-1.5px;margin-bottom:30px}
h2{font-size:26px;line-height:1.5;margin:10px 0}
p{font-size:14px;line-height:1.9;margin:10px 0 24px}
.eyebrow{font-size:12px;color:#78918a}
input,select{background:#f9fbfa;border:1px solid #d3e0da;border-radius:12px;min-height:49px;font:inherit}
select{width:100%;padding:12px;margin-top:9px}
input:focus,select:focus{outline:2px solid #14766c55;outline-offset:2px}
button{border-radius:12px;min-height:48px;font-weight:600}
.full{width:100%}
.auth-links{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:23px;font-size:13px}
a{text-underline-offset:4px}
.remember{display:flex;gap:9px;align-items:center;font-size:13px;color:#526c64}
.remember input{width:18px;min-height:18px;height:18px;margin:0;accent-color:#14766c}
.password-field{position:relative}
.password-field input{padding-left:48px}
.password-toggle{position:absolute;left:5px;top:4px;margin:0;padding:8px;background:transparent;color:#68847a;min-height:40px;display:grid;place-items:center}
[role=alert]{padding:12px 14px;background:#fff3ef;border-radius:12px;font-size:13px}
.welcome{text-align:center;padding:35px 0}
.brand-mark{margin:0 auto 25px;background:#14766c;color:white;width:84px;height:84px;display:grid;place-items:center;font:bold 46px Arial;border-radius:25px;animation:welcome-in .7s ease-out}
.continue{display:inline-block;margin-top:20px}
@keyframes welcome-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.brand-mark{animation:none}}
@media(max-width:500px){main{margin:24px auto;padding:27px 23px}}