:root { color-scheme: light; font: 16px/1.5 system-ui, -apple-system, sans-serif; color: #1d3030; background: #eef3f1; }
* { box-sizing: border-box; }
body { margin: 0; padding: 2rem 1rem; }
main { max-width: 46rem; margin: 0 auto; padding: clamp(1rem, 3vw, 2rem); background: #fff; border: 1px solid #d6e2dd; border-radius: 1.2rem; }
header { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; color: #205454; }
header span { font-size: .85rem; color: #607672; }
h1 { margin-block: 1.3rem .5rem; }
section { margin-top: 1.5rem; }
form { padding: 1rem 0; border-top: 1px solid #dce6e2; }
label { display: block; margin: .75rem 0; font-weight: 600; }
input { display: block; width: 100%; margin-top: .3rem; padding: .65rem .8rem; border: 1px solid #a9bdb7; border-radius: .55rem; font: inherit; }
button { margin: .5rem .5rem .5rem 0; padding: .7rem 1rem; border: 0; border-radius: .55rem; background: #245e5b; color: white; font: inherit; cursor: pointer; }
button:focus-visible, input:focus-visible { outline: 3px solid #8ccac0; outline-offset: 2px; }
[hidden] { display: none !important; }
@media (max-width: 40rem) { body { padding: .6rem; } main { border-radius: .8rem; } header { flex-direction: column; gap: .1rem; } }