@font-face { font-family: "EB Garamond"; src: url("/fonts/ebgaramond.ttf") format("truetype"); font-weight: 400 800; font-display: swap; }
@font-face { font-family: "Alegreya Sans"; src: url("/fonts/alegreya-sans-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
body { margin: 0; min-height: 100dvh; display: grid; place-items: center; padding: 16px; box-sizing: border-box; background: #0E1030; color: #F1F0EA; font: 17px/1.45 "Alegreya Sans", system-ui, sans-serif; }
main { width: 100%; max-width: 360px; }
h1 { font: 500 44px/1.1 "EB Garamond", Georgia, serif; margin: 0 0 8px; }
.note { color: #A9ACC6; margin: 0 0 22px; }
.bad { color: #FFC9A8; margin: 0 0 22px; }
label { display: block; margin-bottom: 6px; }
input, button { width: 100%; box-sizing: border-box; font: inherit; padding: 12px 14px; border-radius: 12px; min-height: 48px; }
input { background: #1A1D3B; color: inherit; border: 1px solid #4A4E78; margin-bottom: 12px; }
button { background: #E0B157; color: #241803; border: 0; font-weight: 700; cursor: pointer; margin-bottom: 10px; }
button.quiet { background: transparent; color: #D8D9EA; font-weight: 400; }
.code { font: 500 16px/1.6 ui-monospace, Menlo, monospace; background: #1A1D3B; padding: 12px 14px; border-radius: 12px; word-break: break-all; margin: 0 0 14px; user-select: all; }
:focus-visible { outline: 2px solid #E0B157; outline-offset: 2px; }