:root { font-family: system-ui, sans-serif; color: #18362d; background: #f5f4ec; line-height: 1.55; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; }
main { width: min(720px, 100%); margin: auto; padding: 28px 20px 48px; }
header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.brand { color: #18362d; font-weight: 750; text-decoration: none; }
.badge { border: 1px solid #bdc9b4; border-radius: 30px; padding: 6px 12px; font-size: 13px; }
h1 { margin: 30px 0 10px; font-size: clamp(30px, 7vw, 44px); line-height: 1.15; }
h2 { font-size: 23px; line-height: 1.25; }
h3 { font-size: 18px; }
.intro { font-size: 18px; }
a { color: #205540; text-underline-offset: 3px; overflow-wrap: anywhere; }
button, .button-link { display: inline-block; min-height: 46px; padding: 12px 18px; border: 0; border-radius: 8px; background: #205540; color: #fff; font: inherit; font-weight: 650; text-decoration: none; text-align: center; cursor: pointer; }
button:disabled { opacity: .65; cursor: wait; }
button.secondary { background: #e2e9dc; color: #205540; }
.offer-card { background: #fffef8; border: 1px solid #d7decf; border-radius: 16px; padding: 22px; margin: 20px 0; overflow-wrap: anywhere; }
.offer-card h2 { margin-top: 0; }
.price { font-size: 30px; font-weight: 750; margin: 16px 0 0; }
.terms { white-space: pre-wrap; }
.hint, footer { color: #52655b; font-size: 14px; }
.consent { color: #52655b; font-size: 14px; margin: 12px 0 0; }
.offer-card .value { font-size: 17px; }
.facts { margin: 14px 0 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.facts li { position: relative; padding-left: 22px; }
.facts li::before { content: '✓'; position: absolute; left: 0; color: #237548; font-weight: 750; }
.full-terms summary { cursor: pointer; color: #205540; }
#level-choice { border: 1px solid #d7decf; border-radius: 12px; padding: 14px 16px 6px; margin: 0 0 18px; }
#level-choice legend { font-weight: 700; padding: 0 6px; }
.levels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.levels label { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; border: 1px solid #bdc9b4;
  border-radius: 10px; background: #fffef8; font-weight: 650; cursor: pointer; text-align: center; padding: 6px; }
.levels label:has(input:checked) { border-color: #205540; background: #e2e9dc; box-shadow: inset 0 0 0 1px #205540; }
.levels input { accent-color: #205540; width: 18px; height: 18px; margin: 0; }
.level-error { color: #982c25; font-weight: 600; margin: 10px 0 0; }
.level-owned { margin: 10px 0 0; font-weight: 600; color: #205540; }
.level-owned a { color: #205540; }
form button { width: 100%; }
#status { min-height: 24px; margin: 24px 0; overflow-wrap: anywhere; }
#status:empty { min-height: 0; margin: 0 0 16px; }
#status.error { color: #982c25; }
#order-summary { padding: 16px 20px; border-left: 4px solid #8b9b92; background: #eaf0e5; border-radius: 0 10px 10px 0; }
#order-summary h2 { margin-top: 0; }
#order-summary.success { border-left-color: #237548; }
#order-id { overflow-wrap: anywhere; }
section { margin: 28px 0; }
.recovery { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; margin: 24px 0; }
.recovery a { font-size: 14px; }
#support { border-top: 1px solid #d7decf; padding-top: 8px; }
#support-text { white-space: pre-wrap; overflow-wrap: anywhere; }
#support-order { overflow-wrap: anywhere; }
footer { border-top: 1px solid #d7decf; padding-top: 20px; margin-top: 32px; }
:focus-visible { outline: 3px solid #cb6d26; outline-offset: 3px; }
@media (max-width: 400px) { main { padding-inline: 16px; } .offer-card { padding: 18px; } .button-link { width: 100%; }
  .levels { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
