:root { font-family: system-ui, sans-serif; color: #17213a; background: #f5f2e8; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
.shell { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.card { width: min(100%, 560px); background: white; border: 4px solid #17213a; border-radius: 28px; padding: 32px; box-shadow: 10px 10px 0 #f2c400; }
.eyebrow { margin: 0; font-weight: 800; color: #d62828; }
h1 { margin: .25rem 0 1rem; font-size: clamp(2.2rem, 8vw, 4rem); }
h2 { margin-bottom: .25rem; }
button { border: 3px solid #17213a; border-radius: 999px; background: #1565c0; color: white; padding: .8rem 1.2rem; font: inherit; font-weight: 800; cursor: pointer; }
.profile { display: flex; gap: 12px; align-items: center; margin: 20px 0; }
.profile img { width: 52px; height: 52px; border-radius: 50%; }
.error { margin-top: 16px; padding: 12px; background: #ffe0e0; border-radius: 12px; color: #8b0000; }