:root { font-family: system-ui, sans-serif; color: #142238; background: #f1f5fa; }
body { margin: 0; }
main { max-width: 42rem; margin: auto; padding: 1.25rem; }
h1 { font-size: 1.8rem; }
section { background: white; border: 1px solid #69788b; border-radius: 1rem; padding: 1rem; }
p { line-height: 1.6; overflow-wrap: anywhere; }
label, input { display: block; }
input { box-sizing: border-box; width: 100%; min-height: 48px; font: inherit; margin: .5rem 0; padding: .6rem; }
button { min-height: 48px; max-width: 100%; font: inherit; padding: .6rem .9rem; margin: .3rem .3rem .3rem 0; border: 1px solid #334b70; border-radius: .5rem; color: #142238; background: #e2ecfa; cursor: pointer; }
button:disabled { cursor: default; }
a { color: #17477e; }
:focus-visible { outline: 3px solid #995000; outline-offset: 3px; }
[hidden] { display: none !important; }
#feedback { font-weight: 600; }
#hints { border-left: 4px solid #334b70; padding-left: .7rem; }