.letter-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr); gap: 18px; align-items: start; }
.letter-form-card { min-width: 0; }
.letter-text-field { margin-top: 18px; }
.letter-text-field textarea { width: 100%; min-height: 96px; padding: 12px; border: 1px solid #cfdde5; border-radius: 9px; background: #fff; color: var(--navy); font: inherit; font-size: 13px; line-height: 1.55; resize: vertical; }
.letter-text-field textarea:focus { border-color: var(--teal); outline: 3px solid rgba(36, 124, 131, 0.16); }
.letter-preview-wrap { min-width: 0; }
.letter-preview-label { display: flex; justify-content: space-between; gap: 12px; margin: 0 0 9px; color: var(--muted); font-size: 11px; font-weight: 750; }
.letter-preview-label span:last-child { color: var(--teal-dark); }
.letter-preview { min-height: 720px; padding: clamp(28px, 4vw, 48px); border: 1px solid var(--line); background: #fff; box-shadow: 0 12px 34px rgba(22, 42, 60, 0.07); color: #334b5e; font-family: Georgia, "Times New Roman", serif; font-size: 14px; line-height: 1.7; }
.letter-preview p { margin: 0 0 17px; white-space: pre-line; }
.letter-preview .letter-date { margin-bottom: 30px; color: #607486; font-family: Arial, sans-serif; font-size: 11px; }
.letter-sender, .letter-recipient { display: flex; flex-direction: column; margin-bottom: 24px; font-family: Arial, sans-serif; font-size: 11px; line-height: 1.45; }
.letter-sender strong { color: var(--navy); font-size: 15px; }
.letter-recipient { margin-bottom: 28px; }
.letter-preview h2 { margin: 0 0 22px; color: var(--navy); font-family: Arial, sans-serif; font-size: 18px; line-height: 1.25; }
.letter-preview h2 span { color: var(--teal-dark); }
.letter-signature { color: var(--teal-dark); font-weight: 700; }
@media (max-width: 850px) { .letter-layout { grid-template-columns: 1fr; } .letter-preview { min-height: 0; } }
@media print {
    body { background: #fff; }
    body * { visibility: hidden !important; }
    .letter-preview, .letter-preview * { visibility: visible !important; }
    .letter-preview { position: absolute; inset: 0; width: 100%; min-height: 0; border: 0; box-shadow: none; }
}