/* "Before your first post" (owner direction 2026-10-16, r05). Approved look: paper, olive
 * controls, thin muted green borders, serif title, sans controls; 44px targets on phones. */
.fp-card { --fp-ink:var(--fd-ink,#29372e); --fp-muted:var(--fd-muted,#586653); --fp-green:var(--fd-green,#526547);
  --fp-green-dark:var(--fd-green-dark,#344b2c); --fp-line:#cbd4bf;
  display:flex; flex-direction:column; gap:10px; margin:4px 0; padding:14px 16px; border:1px solid var(--fp-line);
  border-radius:8px; background:#f6f8f1; color:var(--fp-ink); font:400 14px/1.45 "DM Sans",system-ui,sans-serif; }
.fp-card[hidden] { display:none; }
.fp-card * { box-sizing:border-box; }
.fp-title { margin:0; font:600 17px/1.3 "Newsreader","Source Serif 4",Georgia,serif; color:var(--fp-ink); }
.fp-title:focus { outline:none; }
.fp-title:focus-visible { outline:2px solid var(--fp-green); outline-offset:3px; }
.fp-line { margin:0; font-size:13px; color:var(--fp-muted); }
.fp-done { padding:10px 14px; }
.fp-done .fp-line { color:var(--fp-ink); }
.fp-field { margin:0; padding:0; border:0; min-width:0; }
.fp-field legend { padding:0; margin:0 0 6px; font:600 13px/1.4 "DM Sans",system-ui,sans-serif; }
.fp-label { display:flex; flex-direction:column; gap:4px; font:600 13px/1.4 "DM Sans",system-ui,sans-serif; }
.fp-label-inline { margin-top:8px; }
.fp-card .fp-input { min-height:40px; width:100%; max-width:420px; padding:8px 10px; border:1px solid #b9c4ab; border-radius:5px;
  background:#fff; color:var(--fp-ink); font:400 14px/1.4 "DM Sans",system-ui,sans-serif; }
.fp-card .fp-input:focus { outline:2px solid var(--fp-green); outline-offset:1px; border-color:var(--fp-green); }
.fp-card .fp-code { max-width:140px; }
.fp-preview { margin:-4px 0 0; font-size:13px; color:var(--fp-green-dark); font-weight:600; }
.fp-seg { display:flex; flex-wrap:wrap; gap:6px; }
.fp-seg-btn { min-height:38px; padding:6px 14px; border:1px solid #b9c4ab; border-radius:999px; background:#fff; color:var(--fp-ink);
  font:500 13px/1.2 "DM Sans",system-ui,sans-serif; cursor:pointer; }
.fp-seg-btn.on { background:#e4ead8; border-color:var(--fp-green); color:var(--fp-green-dark); font-weight:600; }
.fp-seg-btn:disabled { cursor:not-allowed; color:#7d8778; background:#f1f2ee; border-style:dashed; }
.fp-seg-btn:focus-visible { outline:2px solid var(--fp-green); outline-offset:2px; }
.fp-note { margin:6px 0 0; font-size:12.5px; color:var(--fp-muted); }
.fp-codes { display:flex; flex-wrap:wrap; gap:6px; }
.fp-codes .fp-note { margin:0; }
.fp-chip { display:inline-flex; align-items:center; gap:6px; min-height:38px; padding:5px 12px; border:1px solid var(--fp-line);
  border-radius:999px; background:#fff; font-size:13px; }
.fp-chip input,.fp-check input { width:18px; height:18px; margin:0; flex:none; accent-color:var(--fp-green); }
.fp-check { display:flex; align-items:center; gap:8px; min-height:38px; font-size:13.5px; }
.fp-status { margin:0; padding:8px 10px; border:1px solid #d9d2b6; border-radius:6px; background:#fbf7ea; font-size:13px; }
.fp-status:empty { display:none; }
.fp-btn { align-self:flex-start; min-height:40px; padding:8px 16px; border:1px solid var(--fp-green); border-radius:5px; background:var(--fp-green);
  color:#fff; font:600 13.5px/1.2 "DM Sans",system-ui,sans-serif; cursor:pointer; }
.fp-btn:hover { background:var(--fp-green-dark); }
.fp-btn:disabled { opacity:.6; cursor:not-allowed; }
.fp-finish { margin:6px 0 0; font-size:13px; color:#586653; }
.fp-finish-link { color:#344b2c; font-weight:600; text-decoration:underline; text-underline-offset:2px; }
@media (max-width:760px) {
  .fp-card { padding:12px; }
  .fp-seg-btn,.fp-chip,.fp-check,.fp-card .fp-input,.fp-btn { min-height:44px; }
  .fp-card .fp-input { max-width:none; }
  .fp-card .fp-code { max-width:160px; }
  .fp-finish-link { display:inline-flex; align-items:center; min-height:44px; }
}