.fam { max-width: 820px; margin: 0 auto; padding: 36px 20px 80px; }
.fam .tools h1 { color: var(--ink); font-size: 34px; margin: 0 0 6px; }
.fam .tools .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; margin: 16px 0 8px; }
@media (max-width: 640px) { .fam .tools .grid { grid-template-columns: 1fr; } }
.fam .tools label { display: grid; gap: 6px; font-size: 14px; color: var(--body); }
.fam .tools input, .fam .tools select { font: inherit; padding: 9px 11px; border-radius: 9px; border: 1px solid var(--line); background: rgb(255 255 255 / .04); color: var(--ink); }
.fam .tools button { font: inherit; font-weight: 600; padding: 10px 16px; border-radius: 10px; border: 0; background: #0f766e; color: #fff; cursor: pointer; }
.letter { background: #fff; color: #111827; border-radius: 14px; padding: 44px 48px; margin-top: 24px; line-height: 1.6; font-size: 15.5px; }
.letter h2 { color: #0b1530; font-size: 18px; margin: 22px 0 6px; }
.letter ul { padding-left: 22px; margin: 0; display: grid; gap: 6px; }
.letter .sign { margin-top: 26px; }
@media print {
  @page { margin: 16mm; }
  body { background: #fff !important; }
  .noprint { display: none !important; }
  .fam { padding: 0; max-width: none; }
  .letter { border-radius: 0; padding: 0; margin: 0; font-size: 10.5pt; line-height: 1.42; }
  .letter h2 { font-size: 12.5pt; margin: 12px 0 4px; }
  .letter ul { gap: 2px; }
  .letter p { margin: 0 0 8px; }
  .letter .sign { margin-top: 14px; }
  .letter + .letter:not([hidden]) { break-before: page; }
}
