
:root{--paper:#f5f6f2;--ink:#0d1210;--graphite:#67716b;--line:#dee2da;--line-2:#c7cec6;--signal:#12c23a;--signal-ink:#0a7d27;--mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:48px 24px;color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;background-color:var(--paper);background-image:radial-gradient(760px 520px at 88% -6%,rgba(18,194,58,.07),transparent 70%),linear-gradient(180deg,#fafbf8 0%,var(--paper) 46%,#f2f4ef 100%)}
::selection{background:rgba(18,194,58,.24)}
.auth-shell{width:100%;max-width:440px;min-width:0}
.meta{font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--graphite)}
.console-cap{display:flex;justify-content:space-between;gap:16px;margin-bottom:10px;padding:0 2px}
/* Match the website Fig. 01 panel, including ticks on the outside border. */
.console{position:relative;background:#fff;border:1px solid var(--line-2);border-radius:0;box-shadow:0 1px 0 rgba(13,18,16,.02),0 30px 60px -40px rgba(13,18,16,.45)}
.ct{position:absolute;width:9px;height:9px;pointer-events:none}
.ct-tl{top:-1px;left:-1px;border-top:1.5px solid var(--ink);border-left:1.5px solid var(--ink)}
.ct-tr{top:-1px;right:-1px;border-top:1.5px solid var(--ink);border-right:1.5px solid var(--ink)}
.ct-bl{bottom:-1px;left:-1px;border-bottom:1.5px solid var(--ink);border-left:1.5px solid var(--ink)}
.ct-br{bottom:-1px;right:-1px;border-bottom:1.5px solid var(--signal);border-right:1.5px solid var(--signal)}
.console-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:48px;padding:12px 18px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#fbfcfa,#f6f8f4)}
.brand-logo{display:block;width:116px;height:auto;flex:none}
form{margin:0;padding:30px 32px 32px}
h1{font-family:"Archivo",var(--sans);font-size:30px;line-height:1.1;letter-spacing:-.032em;margin:0 0 10px}
.intro{color:var(--graphite);font-size:14px;margin:0 0 24px}
label{display:block;font-size:13px;font-weight:500;margin:18px 0 7px}
input:not([type=hidden]){display:block;width:100%;min-width:0;min-height:46px;padding:10px 12px;border:1px solid var(--line-2);border-radius:0;background:#fbfcfa;color:var(--ink);font-family:var(--sans);font-size:16px}
input:focus-visible{outline:2px solid var(--signal-ink);outline-offset:2px;background:#fff}
button{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:26px;width:100%;min-height:48px;padding:12px 18px;background:#343b37;border:1px solid #343b37;border-radius:0;color:#fbfdfa;font-family:var(--sans);font-size:14px;font-weight:500;cursor:pointer;transition:background-color .18s ease}
button:hover{background:#282f2b;border-color:#282f2b}
button:focus-visible{outline:2px solid var(--signal-ink);outline-offset:4px}
.tip{width:7px;height:7px;background:var(--signal);flex:none;transition:transform .22s cubic-bezier(.2,.7,.3,1),background-color .18s ease}
button:hover .tip{transform:translateX(3px) rotate(45deg)}
.flash{background:#fef2f2;border:1px solid #fecaca;color:#991b1b;font-size:14px;padding:10px 12px;margin-bottom:20px;overflow-wrap:anywhere}
.footer{margin:18px 0 0;text-align:center;font-size:10px;letter-spacing:.12em}
@media(max-width:380px){body{padding:28px 18px}form{padding:26px 22px}.console-bar{padding:12px 14px}.console-bar .meta{font-size:9px;letter-spacing:.1em}}
@media(prefers-reduced-motion:reduce){button,.tip{transition:none}button:hover .tip{transform:none}}

.status{margin:0 0 20px;padding:12px;border:1px solid var(--line-2);font-size:14px;overflow-wrap:anywhere}.status[data-error=true]{border-color:#c93838;color:#991b1b}button:disabled{opacity:.65;cursor:wait}a{color:var(--signal-ink)}.home{display:block;text-align:center;margin:18px 0;font-size:13px}

.status:focus{outline:2px solid var(--signal-ink);outline-offset:2px}
