:root { color-scheme:light; --ink:#17251f; --paper:#f2f1e9; --white:#fffefa; --lime:#d9f27d; --display:"Space Grotesk",sans-serif; --body:"DM Sans",sans-serif; --mono:"DM Mono",monospace; }
* { box-sizing:border-box; }
body { min-height:100vh; margin:0; color:var(--ink); background:var(--paper); font:14px/1.5 var(--body); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
.login-page { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; padding:25px; position:relative; background:radial-gradient(circle at 14% 17%,rgba(166,190,134,.18),transparent 28%),radial-gradient(circle at 90% 84%,rgba(187,179,130,.17),transparent 31%),var(--paper); }
.login-page::before,.login-page::after { content:""; position:absolute; width:420px; height:210px; border:1px solid rgba(81,116,80,.13); border-radius:50%; transform:rotate(-32deg); pointer-events:none; }.login-page::before { top:10%; left:-190px; }.login-page::after { right:-210px; bottom:9%; transform:rotate(29deg); }
.login-brand { position:absolute; top:25px; left:6%; display:flex; align-items:center; gap:9px; color:#24352b; font:700 13px var(--display); }.login-brand > span:last-child { display:flex; gap:4px; }.login-brand > span:last-child > span { color:#899286; font-weight:400; }.brand-symbol { width:27px; height:27px; display:grid; place-items:center; border-radius:8px; background:var(--lime); color:var(--ink); font:700 18px var(--display); letter-spacing:-2px; transform:rotate(-5deg); }.brand-symbol span { color:#6b8c47; }
.login-card { width:min(100%,390px); padding:37px 34px 27px; border:1px solid #e3e2d9; border-radius:12px; background:var(--white); box-shadow:0 22px 65px rgba(36,48,35,.09); position:relative; z-index:1; }.login-mark { width:39px; height:39px; display:grid; place-items:center; border-radius:11px; background:#edf2e2; color:#607b50; font-size:21px; }.login-kicker { margin-top:20px; color:#8c9387; font:8px var(--mono); letter-spacing:1px; }.login-card h1 { margin:11px 0 9px; color:#1b2b21; font:600 39px/.99 var(--display); letter-spacing:-2px; }.login-card h1 em { color:#64804f; font-style:normal; }.login-card > p { margin:0; color:#858b80; font-size:10px; line-height:1.7; }.login-card form { margin-top:24px; }.login-card label { display:block; margin-bottom:6px; color:#4e5e4e; font-size:9px; font-weight:700; }.login-card input { width:100%; height:42px; padding:0 11px; outline:0; border:1px solid #dfdfd6; border-radius:5px; background:#fff; color:var(--ink); font-size:12px; }.login-card input:focus { border-color:#8fa47d; box-shadow:0 0 0 3px rgba(95,125,79,.1); }.login-card form button { width:100%; height:41px; margin-top:12px; display:flex; justify-content:space-between; align-items:center; padding:0 13px; border:0; border-radius:5px; background:var(--ink); color:white; cursor:pointer; font-size:10px; font-weight:700; transition:background .18s,transform .18s; }.login-card form button:hover { background:#3b5942; transform:translateY(-1px); }.login-card form button span { color:var(--lime); font-size:15px; }.login-card form button:disabled { opacity:.65; cursor:wait; }.login-error { margin:8px 0 -4px; color:#a14e43; font-size:9px; }.login-error[hidden] { display:none; }.session-note { margin-top:21px; padding-top:13px; display:flex; align-items:center; gap:7px; border-top:1px solid #efeee7; color:#9a9f94; font-size:8px; }.session-note span { color:#78a16a; font-size:8px; }.back-link { position:relative; z-index:1; margin-top:18px; color:#758072; font-size:9px; }.back-link:hover { color:#3d5a42; }
@media(max-width:480px) { .login-page { padding:20px; }.login-brand { top:19px; left:20px; }.login-card { padding:30px 23px 23px; }.login-card h1 { font-size:36px; } }