:root { color-scheme: dark; font-family: Georgia, serif; color: #e0f2f7; background: #1a3a4a; }
* { box-sizing: border-box; }
body { margin: 0; background: linear-gradient(135deg, #1a3a4a, #2d5263); min-height: 100vh; }
main { max-width: 640px; padding: 24px 20px 40px; margin: auto; }
nav a { display: inline-block; padding: 12px 0; color: #b0e0f0; text-underline-offset: 4px; }
header { margin: 24px 0; }
h1 { color: #87ceeb; margin: 0 0 10px; font-size: 2.3rem; }
p { line-height: 1.6; margin: 8px 0 16px; }
.intro, fieldset p { color: #c4dce5; }
fieldset { min-width: 0; border: 1px solid #648799; border-radius: 12px; padding: 16px; margin: 24px 0; background: #ffffff09; }
legend { padding: 0 8px; font-size: 1.25rem; font-weight: bold; color: #a5dff4; }
label { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 12px; border-radius: 8px; cursor: pointer; line-height: 1.4; }
label:hover { background: #ffffff0c; }
label:has(input:checked) { background: #87ceeb18; }
input { flex-shrink: 0; width: 20px; height: 20px; margin: 0; accent-color: #87ceeb; }
:focus-visible { outline: 3px solid #b0e0f0; outline-offset: 4px; }
#save-status { min-height: 26px; color: #b0e0f0; }