:root { color-scheme: dark; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: #101112; color: #f2f0e9; --accent: #bcf66c; --muted: #a4aaa4; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
header, footer { display: flex; align-items: center; justify-content: space-between; padding: 1.75rem clamp(1.5rem, 6vw, 5rem); }
header { border-bottom: 1px solid #30342f; }
.brand { display: inline-flex; align-items: center; gap: .8rem; font-size: .8rem; font-weight: 800; letter-spacing: .16em; color: inherit; text-decoration: none; }
.brand-dot { width: .45rem; height: .45rem; background: var(--accent); border-radius: 50%; }
main { flex: 1; display: grid; place-items: center; padding: 4rem 1.5rem; }
.sign-in { width: min(100%, 28rem); }
.mark { position: relative; display: grid; place-items: center; width: 4.5rem; height: 4.5rem; margin-bottom: 3rem; border: 1px solid #41473d; font-size: 1.5rem; font-weight: 800; letter-spacing: -.08em; }
.mark span { position: absolute; right: -.25rem; bottom: -.25rem; width: .7rem; height: .7rem; background: var(--accent); }
.eyebrow { margin: 0 0 1rem; color: var(--muted); font-size: .7rem; font-weight: 700; letter-spacing: .2em; }
h1 { margin: 0 0 2.75rem; font-size: clamp(3.75rem, 12vw, 6rem); font-weight: 550; letter-spacing: -.065em; line-height: 1; }
h1 span { color: var(--accent); }
form { margin: 0; }
button { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 1rem 1.25rem; border: 1px solid transparent; border-radius: 6px; background: var(--accent); color: #17200f; font: inherit; font-weight: 650; cursor: pointer; }
button span { font-size: 1.4rem; line-height: 1; }
button:hover { background: #d0ff90; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 5px; }
footer { border-top: 1px solid #30342f; color: var(--muted); font-size: .75rem; }
form { display: grid; gap: 1.25rem; }
label { display: grid; gap: .6rem; font-size: .875rem; color: #c6cbc3; }
input { width: 100%; min-width: 0; padding: .9rem 1rem; border: 1px solid #687562; border-radius: 6px; background: #1a1d1a; color: #f2f0e9; font: inherit; }
button { margin-top: .5rem; }
button:disabled { opacity: .65; cursor: wait; }
.status { min-height: 1.5em; margin: 1.25rem 0 0; font-size: .875rem; line-height: 1.6; color: #c6cbc3; }
.password-toggle { width: fit-content; min-height: 44px; margin-top: 0; padding: .65rem 1rem; background: transparent; border-color: #50574e; color: inherit; }
.password-toggle:hover { background: #1a1d1a; }
.status[data-error="true"] { color: #ffb7aa; }

/* TormentLabs visual foundation; system fonts and local assets only. */
.wordmark{font-size:1.35rem;font-weight:750;letter-spacing:-.055em;line-height:1.15;color:#f2f0e9;white-space:nowrap}
.wordmark b{color:var(--accent);font-weight:inherit}
.brand{letter-spacing:normal}
button,input,select,.button{min-height:44px}
p,li,dd{overflow-wrap:anywhere}
body{line-height:1.5}header,footer{gap:1rem;flex-wrap:wrap}a{text-underline-offset:.2em}.sign-in{min-width:0}button,input,select{border-radius:6px}button:focus-visible{outline-color:#f2f0e9}

@media(max-width:600px){main{padding:2.5rem 1.25rem}.mark{margin-bottom:2rem}header,footer{padding:1.5rem 1.25rem}}

/* Author layout rules must never reveal controls marked hidden. */
[hidden]{display:none!important}
.invitation h1{font-size:clamp(2.5rem,8vw,4rem);line-height:1.1}