:root { color-scheme: dark; }
body { margin: 0; min-height: 100vh; background: #353679; color: #E8E8F4; font: 17px/1.5 "Times New Roman", Times, serif; display: grid; place-items: start center; }
main { width: min(420px, calc(100% - 32px)); margin: 64px 16px; padding: 24px; background: #1C1C46; border: 2px solid #A3A3CC; box-sizing: border-box; }
h1 { margin: 0 0 16px; font-size: 20px; text-transform: uppercase; letter-spacing: .06em; color: #FCC200; }
label { display: block; margin: 0 0 4px; }
input[type=email], input[type=password], input[type=text] { width: 100%; box-sizing: border-box; padding: 8px; font: inherit; font-size: 16px; color: inherit; background: #0F0F2E; border: 1px solid #A3A3CC; border-radius: 0; margin: 4px 0 12px; }
input[type=submit] { font: inherit; padding: 8px 16px; color: #FCC200; background: transparent; border: 2px solid #FCC200; border-radius: 0; cursor: pointer; }
input[type=submit]:hover { background: #FCC200; color: #1C1C46; }
:focus-visible { outline: 3px solid #BE7DFE; outline-offset: 2px; }
a { color: #FCC200; }
.alert { color: #FF9B9B; }
.notice { color: #9BE0B0; }