:root { color-scheme: light; font: 18px/1.55 system-ui, sans-serif; color: #203126; background: #f5f7f2; }
* { box-sizing: border-box; }
body { margin: 0; }
header { display: flex; justify-content: space-between; align-items: center; padding: 1rem; background: #244d36; color: white; }
header a { color: inherit; text-decoration: none; font-weight: 700; }
main { width: min(100% - 2rem, 48rem); margin: 1.25rem auto 4rem; }
article, fieldset, .recipient-detail { margin: 1rem 0; padding: 1rem; border: 1px solid #cbd6ca; border-radius: .8rem; background: white; }
label { display: grid; gap: .35rem; margin: .8rem 0; font-weight: 650; }
input { width: 100%; min-height: 3rem; padding: .65rem; border: 1px solid #829187; border-radius: .4rem; font: inherit; }
button, .button { display: inline-block; min-height: 3rem; margin: .35rem 0; padding: .65rem 1rem; border: 0; border-radius: .5rem; background: #286640; color: white; font: inherit; font-weight: 700; text-align: center; text-decoration: none; cursor: pointer; }
.notice { padding: 1rem; border-left: .35rem solid #d98e22; background: #fff7e8; }
.error { padding: .8rem; border: 1px solid #a33232; border-radius: .4rem; background: #fff0f0; color: #8b1f1f; }
.product-photo { display: block; width: 100%; max-height: 22rem; object-fit: cover; border-radius: .5rem; }
.payment { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; }
.consent { display: flex; align-items: center; grid-template-columns: 2rem 1fr; }
.consent input { width: 2rem; }
@media (min-width: 42rem) { .product-photo { max-height: 26rem; } }