body { font-family: sans-serif; max-width: 40rem; margin: 2rem auto; padding: 0 1rem; line-height: 1.6; }
label { display: block; margin: 1rem 0; }
input:not([type="checkbox"]), select { display: block; box-sizing: border-box; width: 100%; padding: .7rem; }
textarea { display: block; box-sizing: border-box; width: 100%; padding: .7rem; overflow-wrap: anywhere; resize: vertical; }
button { padding: .7rem 1.2rem; }
.notice { padding: 1rem; border: 2px solid #b56800; background: #fff4dc; color: #3b2700; }
.trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 360px) { body { margin: 1rem auto; padding: 0 .5rem; } }
@media (prefers-color-scheme: dark) { body { color: #eee; background: #181818; } input, select, textarea { color: #eee; background: #242424; border: 1px solid #888; } }