:root { color-scheme: light; font: 17px/1.65 system-ui, sans-serif; color: #302c28; background: #fff9f3; }
* { box-sizing: border-box; }
body { max-width: 820px; margin: 0 auto; padding: 16px 24px 48px; }
header, footer { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; padding: 20px 0; }
header { border-bottom: 1px solid #ddd5cb; font-size: 14px; }
header a:first-child { font: 600 34px Georgia, serif; margin-right: auto; text-decoration: none; }
a { color: #1f627b; text-underline-offset: 4px; }
h1, h2 { font-family: Georgia, serif; font-weight: 500; line-height: 1.16; letter-spacing: -.025em; }
h1 { font-size: clamp(36px, 7vw, 58px); margin: 14px 0 24px; }
h2 { font-size: 28px; margin-top: 40px; scroll-margin-top: 24px; }
p { margin: 16px 0; }
.eyebrow { color: #8c430c; font-size: 12px; font-weight: 650; text-transform: uppercase; letter-spacing: .14em; margin-top: 36px; }
.hero-art { width: 100%; height: clamp(190px, 38vw, 330px); object-fit: cover; border-radius: 18px; margin-top: 32px; }
.landing .eyebrow { margin-top: 24px; }
.landing > p:not(.eyebrow) { max-width: 640px; color: #665f5a; }
.contents { background: #f2ebe2; padding: 22px 26px; border-radius: 14px; margin: 28px 0; }
.contents ul { padding-left: 20px; margin-bottom: 0; }
.contents a { display: inline-block; padding: 5px 0; }
label { display: block; margin-top: 22px; margin-bottom: 6px; font-size: 15px; font-weight: 600; }
input, textarea, select, button { width: 100%; font: inherit; border-radius: 10px; padding: 13px; min-height: 52px; }
input, textarea, select { border: 1px solid #c6bfb6; background: #fff; color: #302c28; }
button, .button { display: inline-block; padding: 14px 26px; margin-top: 24px; color: white; background: #1f627b; border: 0; border-radius: 10px; text-align: center; text-decoration: none; font-weight: 600; }
button { cursor: pointer; }
button:disabled { opacity: .65; cursor: wait; }
:focus-visible { outline: 3px solid #8c430c; outline-offset: 4px; }
small { display: block; font-size: 13px; color: #665f5a; margin-top: 10px; }
.deletion-details { margin-top: 24px; padding: 18px; border-radius: 12px; background: #f2ebe2; }
summary { cursor: pointer; min-height: 28px; font-weight: 600; }
footer { margin-top: 48px; border-top: 1px solid #ddd5cb; font-size: 14px; color: #665f5a; }
@media (max-width: 400px) { body { padding: 12px 20px 36px; } header { gap: 14px; } }
