@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@1,600&display=swap');
:root{--deep:#063b4c;--sea:#087b86;--cream:#f8f6f0;--ink:#102f3a;--muted:#718188;--coral:#d96f52;--line:rgba(16,47,58,.13);--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{font-family:'DM Sans',system-ui,sans-serif;background:var(--cream);color:var(--ink)}body{margin:0;min-width:320px;min-height:100vh;background:var(--cream)}button,input{font:inherit}.login-shell{min-height:100svh;display:grid}.login-visual{position:relative;min-height:38svh;background:radial-gradient(circle at 22% 28%,rgba(85,205,199,.52),transparent 26rem),linear-gradient(145deg,#087b86 0%,#063b4c 58%,#032833 100%);overflow:hidden}.visual-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,34,44,.05),rgba(4,34,44,.7))}.visual-copy{position:absolute;inset:auto 26px 32px;color:#fff}.visual-copy span,.kicker,.brand small{font-size:10px;font-weight:700;letter-spacing:.18em}.visual-copy h1{margin:9px 0 10px;font-size:clamp(36px,11vw,58px);line-height:.94;letter-spacing:-.05em}.visual-copy h1 em{font-family:'Playfair Display',serif;font-weight:600;color:#ffd2bf}.visual-copy p{margin:0;font-size:12px;opacity:.82}.login-panel{position:relative;z-index:2;margin-top:-18px;padding:25px max(24px,env(safe-area-inset-right)) calc(30px + env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));border-radius:28px 28px 0 0;background:var(--cream)}.brand{display:flex;align-items:center;gap:12px}.brand>span{display:grid;width:46px;height:46px;place-items:center;border-radius:50%;background:linear-gradient(145deg,var(--sea),var(--deep));color:#fff;font-size:11px;font-weight:700;box-shadow:0 10px 26px rgba(6,59,76,.22)}.brand em{color:#ffad94;font-style:normal}.brand div{display:flex;flex-direction:column}.brand small{color:var(--sea)}.brand strong{margin-top:2px;font-size:16px}.welcome{margin:32px 0 26px}.kicker{color:var(--sea)}.welcome h2{margin:7px 0 9px;font-size:29px;line-height:1.1;letter-spacing:-.045em}.welcome p{max-width:430px;margin:0;color:var(--muted);font-size:13px;line-height:1.55}form{display:grid;gap:17px}label{display:grid;gap:7px}label>span:first-child{font-size:11px;font-weight:700;color:#36545d}input{width:100%;height:54px;border:1px solid var(--line);border-radius:16px;background:#fffefa;color:var(--ink);padding:0 16px;outline:none;box-shadow:0 6px 18px rgba(6,59,76,.04);transition:.2s}input:focus{border-color:var(--sea);box-shadow:0 0 0 4px rgba(8,123,134,.11)}.password-wrap{position:relative;display:block}.password-wrap input{padding-right:90px}.password-wrap button{position:absolute;right:7px;top:7px;height:40px;padding:0 11px;border:0;border-radius:11px;background:#e6f2ef;color:var(--sea);font-size:10px;font-weight:700}.error{min-height:17px;margin:-3px 2px -4px;color:#b74f39;font-size:11px;font-weight:600}.submit{height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 19px 0 22px;border:0;border-radius:17px;background:linear-gradient(135deg,var(--sea),var(--deep));color:#fff;font-weight:700;box-shadow:0 15px 34px rgba(6,59,76,.22);transition:transform .2s var(--ease),opacity .2s}.submit i{display:grid;width:31px;height:31px;place-items:center;border-radius:50%;background:rgba(255,255,255,.14);font-style:normal;font-size:19px}.submit:active{transform:scale(.98)}.submit:disabled{opacity:.6;cursor:wait}.privacy{margin:24px 0 0;text-align:center;color:var(--muted);font-size:9px}.privacy span{color:#56a48e;font-size:8px;margin-right:5px}button:focus-visible,input:focus-visible{outline:3px solid rgba(8,123,134,.35);outline-offset:3px}
@media(min-width:820px){body{padding:28px;background:radial-gradient(circle at 10% 0,rgba(66,184,178,.15),transparent 38rem),var(--cream)}.login-shell{min-height:calc(100vh - 56px);grid-template-columns:minmax(420px,1.1fr) minmax(400px,.9fr);max-width:1120px;margin:auto;overflow:hidden;border-radius:34px;background:#fffefa;box-shadow:0 30px 90px rgba(6,45,57,.16)}.login-visual{min-height:auto}.visual-copy{left:50px;bottom:52px}.login-panel{display:flex;flex-direction:column;justify-content:center;margin:0;padding:55px clamp(44px,7vw,82px);border-radius:0}.welcome{margin-top:55px}.privacy{margin-top:30px}}
