[data-field-note] { margin-top: 30px; }
.field-note-form, .field-note-guest { background: #e8e1d0; padding: 30px; border-top: 3px solid #a4482d; }
.field-note-eyebrow { font-size: .55rem; font-weight: 600; letter-spacing: .12em; color: #795139; margin: 0 0 12px; }
.field-note-heading, .field-note-guest h3 { font-family: var(--font-heading); font-size: 1.65rem; margin: 0 0 22px; }
.field-note-guest > p:not(.field-note-eyebrow) { font-size: .85rem; max-width: 640px; color: var(--color-text-muted); margin-bottom: 20px; }
.field-note-label { display: block; font-size: .76rem; font-weight: 600; margin: 16px 0 8px; }
.field-note-select, .field-note-body { background: var(--color-bg-paper); border: 1px solid #aaa993; border-radius: 0; padding: 12px 14px; color: var(--color-text); font: inherit; font-size: .85rem; }
.field-note-select { max-width: 100%; min-width: 230px; }
.field-note-body { display: block; width: 100%; resize: vertical; min-height: 180px; line-height: 1.6; }
.field-note-body::placeholder { color: #6d7468; }
.field-note-hint { font-size: .66rem; color: var(--color-text-muted); margin: 8px 0 18px; }
.field-note-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 22px; }
.field-note-link { color: var(--color-accent); padding: 6px 0; background: none; border: 0; text-decoration: underline; font-size: .75rem; }
.field-note-status { font-size: .78rem; color: #714830; margin: 16px 0 0; }
.field-note-status:empty { display: none; }
.field-note-confirm { border-top: 1px solid var(--color-border); padding-top: 15px; margin-top: 20px; }
.field-note-confirm p { font-size: .78rem; margin-bottom: 8px; }
.field-note-confirm button + button { margin-left: 24px; }
.field-note-form :disabled { opacity: .65; cursor: wait; }
.field-note-form :focus-visible { outline: 3px solid #a4482d; outline-offset: 3px; }
@media(max-width:760px) { .field-note-form, .field-note-guest { padding: 23px 19px; } .field-note-actions { align-items: flex-start; } .field-note-actions .button { flex-basis: 100%; } .field-note-select { width: 100%; } }