@import url('fonts/ranch.css');
:root{color-scheme:light;--paper:#E4E2D6;--sheet:#F7F5EE;--brand:#471614;--on-brand:#F7F1E8;--orange:#FF6F03;--ink:#2A0F0D;--ink-2:#5C4641;--ink-3:#8D7B74;--rule:#D6CFC2;--up:#2F6B2B;--down:#B3261E;--display:'Instrument Serif',serif;--sans:'Inter',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;--pill:var(--sans)}
@media (prefers-color-scheme:dark){:root{color-scheme:dark;--paper:#1A0C0B;--sheet:#2A1312;--brand:#4E1A18;--ink:#F3EBE2;--ink-2:#CDB8AE;--ink-3:#A08A80;--rule:#4A2C29;--up:#8FD18A;--down:#FF9C8C}}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;display:grid;place-items:center;background:var(--paper);color:var(--ink);font:400 15px/1.5 var(--sans);padding:24px 16px}
.auth{width:min(480px,100%);padding:36px 36px 32px;background:var(--sheet);border-radius:28px;box-shadow:0 18px 40px -26px rgba(71,22,20,.35)}
.logo{width:40px;height:46px;background:var(--brand);-webkit-mask:url(brand/flr-logo.png) center/contain no-repeat;mask:url(brand/flr-logo.png) center/contain no-repeat;font-size:0;color:transparent}
@media (prefers-color-scheme:dark){.logo{background:var(--ink)}}
.auth h1{margin:20px 0 6px;font:400 54px/.95 var(--display);color:var(--brand);text-transform:uppercase;display:inline-block;padding-bottom:6px;border-bottom:1.5px solid #8E1E1E}
@media (prefers-color-scheme:dark){.auth h1{color:var(--ink)}}
.auth h2{font:400 28px/1.1 var(--display);margin:30px 0 6px;color:var(--brand)}
@media (prefers-color-scheme:dark){.auth h2{color:var(--ink)}}
.auth>p,.auth p{color:var(--ink-2);line-height:1.55}
.auth form{display:grid;gap:15px;margin-top:20px}
label{font:400 13px var(--pill);color:var(--ink-2);display:grid;gap:6px}
input{width:100%;padding:11px 13px;border:1px solid var(--rule);border-radius:12px;background:var(--paper);color:var(--ink);font:inherit;font-family:var(--sans);outline:none}
input:focus{border-color:var(--brand);outline:2px solid var(--orange);outline-offset:1px}
button{padding:11px 18px;border:1px solid var(--brand);border-radius:999px;background:var(--brand);color:var(--on-brand);font:400 15px var(--pill);cursor:pointer}
button:hover{opacity:.92}
button.ghost{background:transparent;color:var(--brand);border-color:var(--brand)}
button.danger{background:transparent;color:var(--down);border-color:var(--down)}
@media (prefers-color-scheme:dark){button{background:var(--ink);color:var(--paper);border-color:var(--ink)}button.ghost{background:transparent;color:var(--ink);border-color:var(--rule)}}
.error,.success{padding:11px 14px;border-radius:14px;font-size:13.5px;margin-top:14px;border:1px solid}
.error{border-color:var(--down);color:var(--down)}
.success{border-color:var(--up);color:var(--up)}
hr{border:0;border-top:1px solid var(--rule);margin:30px 0 0}
code{font-size:12px;background:var(--paper);border:1px solid var(--rule);padding:8px 10px;border-radius:12px;display:block;overflow-wrap:anywhere;color:var(--ink)}
a{color:var(--brand)}
@media (prefers-color-scheme:dark){a{color:var(--ink)}}
.alt{margin-top:18px;color:var(--ink-3);font:300 13.5px var(--pill);text-align:center}
small{color:var(--ink-3);font-weight:400}
