:root { color-scheme: light dark; font-family: Inter, system-ui, sans-serif; background: var(--tg-theme-bg-color, #f5f2eb); color: var(--tg-theme-text-color, #18211b); }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
main { width: min(100%, 480px); margin: auto; padding: max(32px, env(safe-area-inset-top)) 22px max(28px, env(safe-area-inset-bottom)); }
.mark { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: #246b45; color: white; font: 700 26px Georgia, serif; }
.eyebrow { margin: 34px 0 8px; color: #246b45; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; font-size: 12px; }
h1 { margin: 0; font: 700 clamp(35px, 10vw, 48px)/1.02 Georgia, serif; }
.lead { color: var(--tg-theme-hint-color, #68726b); line-height: 1.55; margin: 18px 0 28px; }
.section-heading { display: flex; justify-content: space-between; align-items: baseline; margin: 0 2px 12px; font-weight: 700; }
.section-heading small { color: var(--tg-theme-hint-color, #68726b); font-weight: 500; }
.amount-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.amount-option { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; padding: 17px; background: var(--tg-theme-secondary-bg-color, #fff); color: inherit; border: 1px solid color-mix(in srgb, currentColor 13%, transparent); }
.amount-option strong { font-size: 21px; }
.amount-option span { color: var(--tg-theme-hint-color, #68726b); font-size: 12px; font-weight: 500; }
.amount-option.selected { border: 2px solid var(--tg-theme-button-color, #246b45); padding: 16px; box-shadow: 0 6px 18px #246b4518; }
.amount-option:disabled { cursor: default; }
.card { padding: 6px 20px; border: 1px solid color-mix(in srgb, currentColor 13%, transparent); border-radius: 18px; background: var(--tg-theme-secondary-bg-color, #fff); box-shadow: 0 10px 30px #17251b0b; }
.card div { display: flex; justify-content: space-between; align-items: center; padding: 17px 0; }
.card div + div { border-top: 1px solid color-mix(in srgb, currentColor 10%, transparent); }
.card span { color: var(--tg-theme-hint-color, #68726b); }
.card strong { font-size: 18px; }
#status { min-height: 24px; margin: 22px 2px 12px; color: var(--tg-theme-hint-color, #68726b); }
button { width: 100%; border: 0; border-radius: 14px; padding: 16px 20px; background: var(--tg-theme-button-color, #246b45); color: var(--tg-theme-button-text-color, #fff); font: inherit; font-weight: 700; cursor: pointer; }
button.secondary { background: transparent; color: var(--tg-theme-destructive-text-color, #b42318); border: 1px solid color-mix(in srgb, currentColor 25%, transparent); }
button:disabled { opacity: .55; cursor: wait; }
.stats { margin-top: 30px; }
.payments { margin-top: 10px; }
.payment { display: flex; justify-content: space-between; gap: 12px; padding: 11px 4px; color: var(--tg-theme-hint-color, #68726b); font-size: 13px; border-bottom: 1px solid color-mix(in srgb, currentColor 8%, transparent); }
.payment strong { color: var(--tg-theme-text-color, #18211b); }
.note { text-align: center; font-size: 12px; line-height: 1.45; color: var(--tg-theme-hint-color, #7b837e); }
[hidden] { display: none !important; }