.cancellation-reader { margin-block: 28px; padding: clamp(18px, 3vw, 30px); background: var(--surface); border: 1px solid var(--line); border-radius: 14px; min-width: 0; }
.cancellation-reader { scroll-margin-top: 110px; }
.cancellation-reader > :is(h3, h4) { margin: 0 0 14px; font-size: 1.3rem; line-height: 1.35; }
.cancellation-reader__figure { margin: 24px 0; }
.cancellation-reader__figure img { width: 100%; height: auto; display: block; }
.cancellation-reader__figure figcaption { margin-top: 10px; font-size: .9rem; color: var(--muted); }
.cancellation-reader__form { margin-block: 24px; }
.cancellation-reader__form[hidden] { display: none; }
.cancellation-reader__form label { display: block; margin-bottom: 9px; font-weight: 700; }
.cancellation-reader__controls { display: flex; flex-wrap: wrap; gap: 12px; }
.cancellation-reader__controls select { flex: 1 1 220px; min-width: 0; padding: 12px; border: 1px solid #647274; border-radius: 8px; background: #fff; color: var(--ink); font: inherit; }
.cancellation-reader__form pre { max-width: 100%; overflow-x: auto; padding: 18px; background: #121d22; color: #f7f4ec; border-radius: 10px; font-size: .88rem; line-height: 1.65; }
.cancellation-reader__result { padding: 18px; border-left: 4px solid var(--teal-ink); border-radius: 0 8px 8px 0; background: #edf4f1; color: #173f39; line-height: 1.7; }
.cancellation-reader :is(select, button):focus-visible { outline: 3px solid #a14d1c; outline-offset: 4px; }
.cancellation-reader .table-wrap { margin-bottom: 0; }
@media (max-width: 680px) { .cancellation-reader__controls > * { width: 100%; } .cancellation-reader__figure { margin-inline: -6px; } .cancellation-reader__figure img { aspect-ratio: 420 / 770; } }