/* The correspondence desk: native fields and a plain, ruled paper form. */
.correspondence .intro { font-size: 18px; }
.correspondence fieldset { min-width: 0; padding: 0; margin: 24px 0; border: 0; }
.correspondence legend { padding: 0; color: #601322; font-size: 22px; }
.correspondence label { display: block; margin: 0 0 6px; font: 13px/1.6 Verdana, sans-serif; }
.correspondence .field { margin: 0 0 20px; }
.correspondence input, .correspondence textarea { width: 100%; min-width: 0; border: 1px solid #9e8156; border-top-color: #746044; background: #fff9e9; color: #392a20; padding: 9px 10px; font: 16px/1.5 Georgia, serif; }
.correspondence textarea { resize: vertical; min-height: 140px; }
.correspondence button { border: 2px outset #b79763; background: #681b28 url('images/maroon-bar.png') repeat-x; color: #f7e4b5; padding: 8px 12px; min-height: 44px; cursor: pointer; font: 13px/1.5 Verdana, sans-serif; }
.correspondence button:hover { color: white; border-color: #794a37; }
.correspondence button:disabled { cursor: wait; opacity: .65; }
.field-note { font-size: 14px; margin: 6px 0 12px; color: #715b40; }
.field-note.optional { font-weight: normal; }
.favorites-grid { overflow: hidden; }
.favorites-grid .field { width: 48%; float: left; margin: 0 4% 12px 0; }
.favorites-grid .field:nth-child(even) { margin-right: 0; }
.letterboxd-lookup { border-bottom: 1px solid #b8a17b; padding-bottom: 20px; margin-bottom: 20px; }
.lookup-row input { margin-bottom: 8px; }
.form-status { margin: 16px 0 0; }
.form-status:empty { display: none; }
.form-status[data-state="error"] { border-left: 3px solid #a00; padding-left: 12px; }
.submission-note { font-size: 14px; }
.email-address { overflow-wrap: anywhere; }
.correspondence .post-office { display: none; }
.back-home { font-size: 14px; padding-top: 18px; margin-top: 25px; border-top: 3px double #aa8e60; }
@media (max-width: 450px) { .favorites-grid .field { float: none; width: 100%; margin-right: 0; } }

/* The same correspondence desk, with room to type and tap on small screens. */
@media screen and (max-width: 899px) {
  .correspondence label { font-size: 14px; }
  .correspondence legend { max-width: 100%; line-height: 1.3; }
  .correspondence input, .correspondence textarea { min-height: 44px; font-size: 16px; }
  .correspondence button { max-width: 100%; min-height: 44px; font-size: 16px; }
  .field-note, .submission-note { font-size: 16px; }
  .favorites-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; overflow: visible; }
  .favorites-grid .field { float: none; width: auto; min-width: 0; margin: 0; }
  .lookup-row { display: flex; flex-wrap: wrap; gap: 8px; }
  .lookup-row input { flex: 1 1 15rem; width: auto; margin: 0; }
  .lookup-row button { flex: 0 1 auto; }
  .form-status { overflow-wrap: anywhere; }
  .back-home { font-size: 16px; }
  .back-home a { display: inline-block; min-height: 44px; padding-block: 10px; }
}

@media screen and (max-width: 600px) {
  .favorites-grid { grid-template-columns: minmax(0, 1fr); }
}

@media screen and (max-width: 450px) {
  .correspondence button { width: 100%; }
}