/* Cortex assets and palette from Web's src/public/less/themes/cortex. */
@font-face { font-family: 'PP Mori'; src: url('PPMori-Regular.woff2') format('woff2'); font-display: swap; }
@font-face { font-family: 'Geist Mono'; src: url('GeistMono-latin.woff2') format('woff2'); font-display: swap; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; min-height: 100svh; display: grid; place-items: center; padding: 32px 20px; background: #f2ede4 url('Layering-Docs.png') -100px center / 150% repeat; color: #f8f6f1; font: 16px/1.5 'PP Mori', sans-serif; }
main { width: 100%; max-width: 540px; background: #251c1c; border-radius: 4px; padding: 32px 28px; }
.wordmark { display: block; width: 100%; height: auto; margin: 0 0 28px; }
h1 { font-size: 22px; font-weight: 400; line-height: 1.3; margin: 0 0 16px; }
p { margin: 0 0 24px; }
main > :last-child { margin-bottom: 0; }
label { display: block; margin-bottom: 8px; }
.site-address { display: flex; align-items: stretch; margin-bottom: 28px; border: 1px solid #d4ccc2; background: #f8f6f1; }
.site-address input { min-width: 0; flex: 1; border: 0; }
.site-address span { display: flex; align-items: center; flex-shrink: 0; padding: 0 10px; border-left: 1px solid #d4ccc2; background: #e6ddd2; color: #251c1c; font-size: 14px; }
.site-address:focus-within { outline: 3px solid #fffd90; outline-offset: 4px; }
.site-address input:focus-visible { outline: none; }
input { display: block; width: 100%; min-height: 48px; padding: 12px; border: 1px solid #d4ccc2; border-radius: 0; background: #f8f6f1; color: #251c1c; font: inherit; }
.field-error { margin: -16px 0 28px; color: #ffb4ab; font-size: 14px; }
button, .continue { display: block; width: 100%; border: 0; border-radius: 0; padding: 14px 12px; background: #fffd90; color: #251c1c; font: 16px/1.4 'Geist Mono', monospace; text-align: center; text-transform: uppercase; text-decoration: none; cursor: pointer; }
button:hover:not(:disabled), .continue:hover { background: #e3e063; }
button:disabled { background: #e6ddd2; color: #6c625b; cursor: not-allowed; }
input:focus-visible, button:focus-visible, a:focus-visible { outline: 3px solid #fffd90; outline-offset: 4px; }
@media (max-width: 480px) {
  body { padding: 24px 16px; background-size: auto 100%; }
  main { padding: 24px; }
  h1 { font-size: 20px; }
  .site-address { flex-direction: column; }
  .site-address span { justify-content: flex-end; border-left: 0; border-top: 1px solid #d4ccc2; padding: 8px 12px; }
}