:root{
  --paper:#E9E7D9;
  --paper-raised:#F4F2E7;
  --ink:#211E16;
  --ink-soft:#57543F;
  --green-900:#24402F;
  --green-700:#3C6349;
  --green-050:#DDE6DC;
  --ochre:#A9772A;
  --ochre-text:#7A5419;
  --ochre-soft:#EFE1C4;
  --rust:#9C3B2A;
  --rust-soft:#F3DCD4;
  --warn-bg:#F9E39A;
  --line:#C7C0A7;
  --line-strong:#A79F84;
  --focus:#3C6349;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#181B15;
    --paper-raised:#20241C;
    --ink:#ECE7D6;
    --ink-soft:#AFA98F;
    --green-900:#8FBB9E;
    --green-700:#6FA383;
    --green-050:#26332A;
    --ochre:#D9AC5C;
    --ochre-text:#D9AC5C;
    --ochre-soft:#3A311E;
    --rust:#E08066;
    --rust-soft:#3A2420;
    --warn-bg:#4A3B12;
    --line:#3A3E30;
    --line-strong:#4C5140;
    --focus:#8FBB9E;
  }
}
:root[data-theme="dark"]{
  --paper:#181B15;
  --paper-raised:#20241C;
  --ink:#ECE7D6;
  --ink-soft:#AFA98F;
  --green-900:#8FBB9E;
  --green-700:#6FA383;
  --green-050:#26332A;
  --ochre:#D9AC5C;
  --ochre-text:#D9AC5C;
  --ochre-soft:#3A311E;
  --rust:#E08066;
  --rust-soft:#3A2420;
  --warn-bg:#4A3B12;
  --line:#3A3E30;
  --line-strong:#4C5140;
  --focus:#8FBB9E;
}

*{ box-sizing:border-box; }
/* Scoped to our own wrapper, not the real <body> — same reasoning as the
   excise tax plugin's .cea-et-root (see its DEVELOPMENT-NOTES.md §4/§8). */
.cea-mel-root{
  display:block; background:var(--paper); color:var(--ink);
  font-family:"IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  font-size:15px; line-height:1.5;
}
.cea-mel-root h1,.cea-mel-root h2,.cea-mel-root h3{
  font-family:"Fraunces", Georgia, serif; font-weight:500; text-wrap:balance; margin:0; color:var(--ink);
}

.cea-mel-topbar{ background:none; color:var(--ink); padding:40px 28px 24px; text-align:center; }
.cea-mel-topbar-inner{ max-width:900px; margin:0 auto; }
.cea-mel-topbar .org{ font-family:"Fraunces",serif; font-weight:500; font-size:34px; }
.cea-mel-topbar .dept{
  font-size:14px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  color:var(--green-700); font-family:"IBM Plex Mono",monospace; margin-top:12px;
}

.cea-mel-shell{ max-width:900px; margin:0 auto; padding:32px 28px 80px; }

.cea-mel-note{
  background:var(--ochre-soft); border:1px solid var(--line); border-radius:6px;
  padding:16px 20px; font-size:14px; line-height:1.6; margin-bottom:28px;
}
.cea-mel-note a{ color:var(--ochre-text); font-weight:600; overflow-wrap:anywhere; }

.cea-mel-section{
  background:var(--paper-raised); border:1px solid var(--line); border-radius:6px;
  padding:24px 26px; margin-bottom:22px;
}
.cea-mel-section h2{ font-size:19px; margin-bottom:4px; }
.cea-mel-section .section-desc{ font-size:13.5px; color:var(--ink-soft); margin-bottom:18px; }

.req{ color:var(--rust); }

.cea-mel-field{ margin-bottom:16px; }
.cea-mel-field label{ display:block; font-size:13px; font-weight:600; color:var(--ink-soft); margin-bottom:6px; }
.cea-mel-field .hint{ font-size:12px; color:var(--ink-soft); font-weight:400; margin-top:4px; }
.cea-mel-group-label{ display:block; font-size:14px; font-weight:600; color:var(--ink); margin-bottom:8px; }
.cea-mel-sublabel{ display:block; font-size:11.5px; font-weight:600; color:var(--ink-soft); margin-bottom:6px; text-transform:uppercase; letter-spacing:.03em; }
.cea-mel-field input[type="text"],
.cea-mel-field input[type="email"],
.cea-mel-field input[type="tel"],
.cea-mel-field input[type="date"],
.cea-mel-field input[type="number"],
.cea-mel-field input[type="time"],
.cea-mel-field select,
.cea-mel-field textarea{
  width:100%; font:inherit; font-size:14.5px; padding:10px 12px; border-radius:4px;
  border:1px solid var(--line-strong); background:var(--paper); color:var(--ink);
}
.cea-mel-field input:focus, .cea-mel-field select:focus, .cea-mel-field textarea:focus{
  outline:2px solid var(--focus); outline-offset:1px;
}
.cea-mel-field.invalid input, .cea-mel-field.invalid select, .cea-mel-field.invalid textarea{
  border-color:var(--rust); background:var(--warn-bg);
}
.cea-mel-field .field-error{ display:none; font-size:12.5px; color:var(--rust); margin-top:5px; font-weight:600; }
.cea-mel-field.invalid .field-error{ display:block; }

.cea-mel-row2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.cea-mel-row3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; }
.cea-mel-row2[hidden], .cea-mel-row3[hidden]{ display:none; }
@media (max-width:640px){ .cea-mel-row2, .cea-mel-row3{ grid-template-columns:1fr; } }

.cea-mel-check{ display:flex; align-items:flex-start; gap:10px; font-size:14px; margin-bottom:14px; }
.cea-mel-check input{ margin-top:3px; }
.cea-mel-check-inline{ margin-bottom:8px; font-size:12.5px; color:var(--ink-soft); }
.cea-mel-check-inline input{ margin-top:1px; }
.cea-mel-check.invalid{ background:var(--warn-bg); border-radius:4px; padding:6px 8px; }
.cea-mel-address-block{ margin-top:10px; }
.cea-mel-address-block[hidden], .cea-mel-field input[hidden]{ display:none; }

/* Board members/officers and on-site managers: entry composer + removable
   chips, same pattern as the business license plugin's owners list. */
.cea-mel-entry{ display:flex; flex-direction:column; gap:10px; }
.cea-mel-entry input{
  width:100%; font:inherit; font-size:14.5px; padding:10px 12px; border-radius:4px;
  border:1px solid var(--line-strong); background:var(--paper); color:var(--ink);
}
.cea-mel-entry input:focus{ outline:2px solid var(--focus); outline-offset:1px; }
.cea-mel-entry .cea-mel-btn{ align-self:flex-start; }
.cea-mel-entry-error{ font-size:12.5px; color:var(--rust); font-weight:600; }
.cea-mel-entry-error[hidden]{ display:none; }
.cea-mel-chip-list{ list-style:none; margin:14px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; }
.cea-mel-chip-list:empty{ display:none; }
.cea-mel-chip{
  display:flex; align-items:flex-start; justify-content:space-between; gap:10px;
  background:var(--green-050); border:1px solid var(--line); border-radius:4px;
  padding:10px 12px; font-size:13.5px; overflow-wrap:anywhere;
}
.cea-mel-chip-sub{ display:block; font-size:12px; color:var(--ink-soft); margin-top:2px; font-weight:400; }
.cea-mel-chip button, .cea-mel-file-chip button{
  background:none; border:none; color:var(--rust); font-weight:700; cursor:pointer; font-size:14px; line-height:1;
  padding:2px 6px; flex-shrink:0;
}

/* Hours of operation: one row per day. */
.cea-mel-hours{ display:flex; flex-direction:column; gap:8px; }
.cea-mel-hours-row{
  display:grid; grid-template-columns:110px 1fr auto 1fr auto; align-items:center; gap:10px;
  padding:6px 8px; border-radius:4px;
}
.cea-mel-hours-row.invalid{ background:var(--warn-bg); }
.cea-mel-hours-row .day{ font-weight:600; font-size:14px; }
.cea-mel-hours-row .to{ font-size:13px; color:var(--ink-soft); }
.cea-mel-hours-row input[type="time"]{
  width:100%; font:inherit; font-size:14.5px; padding:8px 10px; border-radius:4px;
  border:1px solid var(--line-strong); background:var(--paper); color:var(--ink);
}
.cea-mel-hours-row input[type="time"]:disabled{ opacity:.45; }
.cea-mel-field .cea-mel-hours-row label.closed{
  display:flex; align-items:center; gap:6px; margin:0; font-size:13px; font-weight:500; color:var(--ink);
}
.cea-mel-hours .cea-mel-btn-small{ align-self:flex-start; margin-top:4px; font-size:13px; padding:7px 14px; }
@media (max-width:640px){
  .cea-mel-hours-row{ grid-template-columns:1fr 1fr; }
  .cea-mel-hours-row .day{ grid-column:1 / -1; }
  .cea-mel-hours-row .to{ display:none; }
}

/* Application Checklist: one block per item, with Upload / In person /
   Pending choices and an upload box shown only for "Upload now". */
.cea-mel-doc{ border-top:1px solid var(--line); padding-top:16px; }
.cea-mel-doc-title{ font-size:14.5px; font-weight:600; color:var(--ink); }
.cea-mel-doc-hint{ font-size:12.5px; color:var(--ink-soft); margin-top:3px; line-height:1.5; }
.cea-mel-doc-choices{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.cea-mel-field .cea-mel-doc-choices label{
  display:flex; align-items:center; gap:7px; margin:0; padding:8px 12px; cursor:pointer;
  border:1px solid var(--line-strong); border-radius:4px; background:var(--paper);
  font-size:13.5px; font-weight:500; color:var(--ink);
}
.cea-mel-doc-choices label:has(input:checked){ border-color:var(--green-700); background:var(--green-050); }
.cea-mel-doc-choices input{ accent-color:var(--green-700); margin:0; }
.cea-mel-doc-upload{ margin-top:10px; }
.cea-mel-doc-upload[hidden]{ display:none; }
.cea-mel-field.cea-mel-doc.invalid .cea-mel-doc-choices label{ border-color:var(--rust); }
.cea-mel-upload{
  border:1.5px dashed var(--line-strong); border-radius:6px; padding:16px; text-align:center;
  background:var(--paper); cursor:pointer; margin-top:10px;
}
.cea-mel-doc-upload .cea-mel-upload{ margin-top:0; }
.cea-mel-upload:focus-visible{ outline:2px solid var(--focus); outline-offset:2px; }
.cea-mel-upload input[type="file"]{ display:none; }
.cea-mel-upload .upload-label{ font-size:13.5px; font-weight:600; color:var(--green-700); }
.cea-mel-upload .upload-hint{ font-size:12px; color:var(--ink-soft); margin-top:4px; }
.cea-mel-file-list{ list-style:none; margin:10px 0 0; padding:0; display:flex; flex-direction:column; gap:6px; }
.cea-mel-file-list:empty{ display:none; }
.cea-mel-file-chip{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  background:var(--green-050); border:1px solid var(--line); border-radius:4px;
  padding:6px 10px; font-size:13px; overflow-wrap:anywhere;
}
.cea-mel-file-chip-desc .cea-mel-file-chip-name{ flex-shrink:0; max-width:40%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cea-mel-file-chip-desc input[type="text"]{
  flex:1; min-width:0; font:inherit; font-size:13px; padding:6px 8px; border-radius:3px;
  border:1px solid var(--line-strong); background:var(--paper); color:var(--ink);
}
.cea-mel-upload-total{
  font-family:"IBM Plex Mono",monospace; font-size:12.5px; color:var(--ink-soft); margin-bottom:10px;
}
.cea-mel-upload-total.over{ color:var(--rust); font-weight:600; }
.cea-mel-upload-error{
  background:var(--rust-soft); border:1px solid var(--rust); border-radius:4px;
  padding:10px 14px; font-size:13px; margin-bottom:12px; overflow-wrap:anywhere;
}
.cea-mel-upload-error[hidden]{ display:none; }

/* Collapsible reference text (General Information, Security Checklist). */
.cea-mel-details{
  border:1px solid var(--line); border-radius:6px; background:var(--paper); margin-bottom:16px;
}
.cea-mel-details summary{ cursor:pointer; padding:12px 16px; font-weight:600; font-size:14px; color:var(--green-700); }
.cea-mel-details-body{ padding:0 18px 14px; font-size:13.5px; line-height:1.6; }
.cea-mel-details-body h3{ font-size:15px; margin:10px 0 6px; }
.cea-mel-details-body ul{ margin:0 0 8px; padding-left:20px; }
.cea-mel-details-small{ margin:10px 0 0; }
.cea-mel-details-small summary{ padding:8px 12px; font-size:13px; }

/* Renewal: license number + Look up button, and the lookup result. */
.cea-mel-renewal[hidden]{ display:none; }
.cea-mel-lookup-row{ display:flex; gap:10px; }
.cea-mel-lookup-row input{ flex:1; min-width:0; }
.cea-mel-lookup-row .cea-mel-btn{ flex-shrink:0; }
.cea-mel-lookup-status{
  margin-top:10px; padding:10px 14px; border-radius:4px; font-size:13.5px; line-height:1.5;
  border:1px solid var(--line); background:var(--green-050); overflow-wrap:anywhere;
}
.cea-mel-lookup-status[hidden]{ display:none; }
.cea-mel-lookup-status.warn{ background:var(--ochre-soft); border-color:var(--ochre); }
.cea-mel-lookup-status.err{ background:var(--rust-soft); border-color:var(--rust); }

/* Fixed fees: a plain list above the total box. */
.cea-mel-fee-lines{ display:flex; flex-direction:column; gap:6px; font-size:14px; margin-top:12px; }
.cea-mel-fee-lines > div{ display:flex; justify-content:space-between; gap:12px; }
.cea-mel-fee-lines .amount{ font-family:"IBM Plex Mono",monospace; font-size:13.5px; white-space:nowrap; }

.cea-mel-total-box{
  display:flex; justify-content:space-between; align-items:center;
  background:var(--green-050); border-radius:4px; padding:14px 18px; margin:18px 0; font-weight:600;
}
.cea-mel-total-box .amount{ font-family:"IBM Plex Mono",monospace; font-size:17px; }

.cea-mel-paymethod-group{ display:flex; flex-direction:column; gap:10px; }
/* Specificity note: each option is itself a <label>, so the generic
   ".cea-mel-field label{ display:block }" rule above (2 classes) beats a
   bare ".cea-mel-paymethod-option{ display:flex }" (1 class) regardless of
   source order — the qualified selector here matches that specificity and
   wins on tie, restoring the radio+text row layout. */
.cea-mel-field .cea-mel-paymethod-option{
  display:flex; align-items:flex-start; gap:12px; padding:13px 15px;
  border:1px solid var(--line-strong); border-radius:4px; background:var(--paper); cursor:pointer;
}
.cea-mel-paymethod-option:has(input:checked){ border-color:var(--green-700); background:var(--green-050); }
.cea-mel-paymethod-option input[type="radio"]{ margin-top:3px; accent-color:var(--green-700); width:15px; height:15px; flex-shrink:0; }
.cea-mel-paymethod-option .pm-body{ display:block; flex:1; }
.cea-mel-paymethod-option .pm-title{ display:block; font-size:14px; font-weight:500; }
.cea-mel-paymethod-option .pm-sub{ display:block; font-size:12.5px; color:var(--ink-soft); margin-top:2px; }
.cea-mel-paymethod-option .pm-detail{
  display:none; margin-top:10px; padding-top:10px; border-top:1px solid var(--line);
  font-size:12.5px; line-height:1.6; color:var(--ink-soft);
}
.cea-mel-paymethod-option .pm-detail strong{ color:var(--ink); font-weight:500; }
.cea-mel-paymethod-option:has(input:checked) .pm-detail{ display:block; }

.cea-mel-signature-preview{
  border:1px solid var(--line-strong); border-radius:4px; padding:16px; min-height:60px;
  display:flex; align-items:center; background:var(--paper); margin-bottom:10px;
}
.cea-mel-signature-preview .placeholder{ color:var(--ink-soft); font-size:13.5px; }
.cea-mel-signature-preview .signed{ font-family:"Sacramento", cursive; font-size:30px; color:var(--ink); }
.cea-mel-sig-date-note{ font-size:12.5px; color:var(--ink-soft); margin-top:6px; }
.cea-mel-sig-date-note strong{ color:var(--ink); font-weight:600; }
.cea-mel-btn{
  font-size:14px; font-weight:600; cursor:pointer; border-radius:4px; padding:10px 18px;
  border:1px solid var(--line-strong); background:var(--paper-raised); color:var(--ink);
}
.cea-mel-btn.primary{ background:var(--green-700); color:var(--paper-raised); border-color:var(--green-700); }

.cea-mel-certify{
  background:var(--green-050); border-radius:6px; padding:18px 20px; font-size:13.5px; line-height:1.6; margin-bottom:18px;
}

#cea-mel-validation-summary{
  display:none; background:var(--rust-soft); border:1px solid var(--rust); border-radius:6px;
  padding:14px 18px; margin-bottom:18px; font-size:14px;
}
#cea-mel-validation-summary.show{ display:block; }
#cea-mel-validation-summary ul{ margin:8px 0 0; padding-left:20px; }

.cea-mel-submit-row{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
#cea-mel-submit[aria-disabled="true"]{ opacity:.55; cursor:default; }
/* Submit errors stay in their own box until the next attempt (audit
   response A1) instead of a status line that gets overwritten. */
.cea-mel-submit-error{
  background:var(--rust-soft); border:1px solid var(--rust); border-radius:6px;
  padding:14px 18px; margin-top:14px; font-size:14px; font-weight:600; color:var(--ink); overflow-wrap:anywhere;
}
.cea-mel-submit-error[hidden]{ display:none; }

.cea-mel-success{
  display:none; background:var(--green-050); border:1px solid var(--green-700); border-radius:6px;
  padding:22px 26px; margin-top:24px;
}
.cea-mel-success[hidden]{ display:none; }
.cea-mel-success.show{ display:block; }
.cea-mel-success a{ color:var(--green-900); font-weight:600; }
.cea-mel-success-todo{
  background:var(--ochre-soft); border:1px solid var(--line); border-radius:6px; padding:14px 18px; font-size:14px; margin:12px 0;
}
.cea-mel-success-todo[hidden]{ display:none; }
.cea-mel-success-todo ul{ margin:8px 0 0; padding-left:20px; }

/* Modal (signature) */
.cea-mel-modal-backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.45); display:flex; align-items:center; justify-content:center;
  z-index:1000; padding:20px;
}
.cea-mel-modal-backdrop[hidden]{ display:none; }
.cea-mel-modal{
  background:var(--paper-raised); border-radius:8px; max-width:480px; width:100%; padding:24px; border:1px solid var(--line);
}
.cea-mel-modal h3{ font-size:18px; margin-bottom:14px; }
.cea-mel-modal-tabs{ display:flex; gap:8px; margin-bottom:16px; }
.cea-mel-modal-tab{
  flex:1; text-align:center; padding:8px; border-radius:4px; cursor:pointer; font-size:13.5px; font-weight:600;
  border:1px solid var(--line-strong); background:var(--paper);
}
.cea-mel-modal-tab.active{ background:var(--green-700); color:var(--paper-raised); border-color:var(--green-700); }
.cea-mel-modal-pane[hidden]{ display:none; }
#cea-mel-sig-canvas{ border:1px solid var(--line-strong); border-radius:4px; width:100%; height:140px; touch-action:none; background:var(--paper); }
.cea-mel-modal-actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:16px; }

/* Submitting overlay: stands out much more than the small inline status
   text, since the Airtable round trip can take a few seconds and
   applicants weren't sure the click had registered. */
.cea-mel-submitting-overlay{ z-index:1100; }
.cea-mel-submitting-modal{ text-align:center; max-width:360px; }
.cea-mel-submitting-modal h3{ margin:16px 0 8px; }
.cea-mel-submitting-modal p{ font-size:13.5px; color:var(--ink-soft); margin:0; }
.cea-mel-spinner{
  width:38px; height:38px; margin:0 auto; border-radius:50%;
  border:4px solid var(--line); border-top-color:var(--green-700);
  animation:cea-mel-spin 0.8s linear infinite;
}
@media (prefers-reduced-motion: reduce){ .cea-mel-spinner{ animation-duration:2.4s; } }
@keyframes cea-mel-spin{ to{ transform:rotate(360deg); } }

/* Spam honeypot: moved off-screen rather than display:none, so naive
   bots still see and fill it, while people (and screen readers, via
   aria-hidden) never do. */
#cea-mel-form .hp-field{
  position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden;
}