:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#101311;color:#eff5f0}*{box-sizing:border-box}body{margin:0}main{max-width:820px;margin:0 auto;padding:36px 24px}.login{max-width:420px;padding-top:18vh}.brand{font-size:18px;font-weight:750;letter-spacing:3px}.brand span{font-size:10px;letter-spacing:1px;color:#a9e4b6;border:1px solid #385340;border-radius:5px;padding:4px 6px;vertical-align:middle;margin-left:8px}h1{font-size:clamp(27px,5vw,36px);letter-spacing:-1px;margin:42px 0 12px}p{color:#99a69d;font-size:14px;line-height:1.6}form{margin-top:32px}label{display:block;font-size:13px;margin-bottom:10px}input{width:100%;border:1px solid #3d4940;background:#191f1b;border-radius:8px;padding:14px;color:inherit;font-size:16px}button{border:0;border-radius:8px;padding:13px 19px;background:#b9e8c3;color:#14271a;font-size:14px;font-weight:650;cursor:pointer}button:disabled{opacity:.6}form button{width:100%;margin-top:14px;text-align:left}form button span{float:right}header,footer{display:flex;align-items:center;justify-content:space-between;gap:16px}.quiet{background:transparent;color:#b7c2ba;border:1px solid #39453c}.heading{margin-bottom:24px}.screen{position:relative;aspect-ratio:1;background:#080b09;border:1px solid #2a342d;border-radius:12px;overflow:hidden;display:grid;place-items:center;color:#7d8e82}.screen img{width:100%;height:100%;object-fit:contain}.screen img[hidden]{display:none}footer{padding-top:22px}footer p{margin:5px 0}strong{font-size:14px}#error{color:#f2aaa2;min-height:22px}button:focus-visible,input:focus-visible{outline:2px solid #b9e8c3;outline-offset:3px}
