.checkout-page [hidden] { display: none !important; }
.checkout-page { background: radial-gradient(ellipse at 12% 7%, #f0d2b955, transparent 45%), var(--paper); }
.checkout-page .checkout-shell { width: min(100% - 64px, 1120px); margin: 0 auto; padding: 36px 0 70px; }
.checkout-page .checkout-back { color: var(--muted); font-size: 13px; text-decoration: none; }
.checkout-page .checkout-back:hover { color: var(--ink); }
.checkout-page .brand span { display: inline; }
.checkout-page .checkout-nav .app-store-link { padding: 0; border-radius: 0; background: none; color: var(--muted); font-weight: 500; }
.checkout-page .checkout-nav .app-store-link:hover { background: none; color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }
.checkout-page .checkout-intro { padding: 33px 0 38px; }
.checkout-page .checkout-intro h1 { max-width: 720px; font-size: clamp(46px, 5.5vw, 70px); line-height: 1.02; letter-spacing: -.055em; }
.checkout-page .checkout-intro > p:last-child { margin: 18px 0 0; color: var(--muted); font-size: 18px; }
.checkout-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 52px; align-items: start; }
.order-summary { overflow: hidden; border: 1px solid var(--line); border-radius: 25px; background: #fffaee8c; }
.companion-preview { position: relative; height: 230px; overflow: hidden; background: radial-gradient(ellipse at 75% 10%, #ffe8c1, transparent 70%), linear-gradient(140deg, #dcb7a6, #efcfad); }
.preview-menu { display: flex; align-items: center; justify-content: space-between; padding: 10px 16px; border-bottom: 1px solid #836c4c14; color: #645341; background: #ffefda50; font-size: 9px; font-weight: 750; }
.preview-menu > span:first-child { letter-spacing: 3px; color: #9c8163; font-size: 6px; }
.preview-window { position: absolute; width: 66%; height: 124px; top: 62px; left: 12%; padding: 21px; border: 1px solid #fff5e499; border-radius: 11px; background: #fff8ea6b; box-shadow: 0 10px 22px #624b3210; }
.preview-window > span { color: #6c5842; font-size: 12px; font-weight: 650; }
.preview-window > div { height: 5px; width: 68%; margin-top: 10px; background: #a78b6440; border-radius: 3px; }
.preview-window > div:nth-child(3) { width: 82%; }
.preview-window > div:nth-child(4) { width: 49%; }
.preview-cat, .preview-yarn { position: absolute; object-fit: contain; image-rendering: pixelated; z-index: 1; }
.preview-cat { width: 142px; height: 142px; right: 48px; bottom: 5px; }
.preview-yarn { width: 58px; height: 58px; right: 22px; bottom: 4px; z-index: 2; }
.preview-floor { height: 5px; position: absolute; inset: auto 0 0; background: #4e40302e; }
.summary-body { padding: 26px 28px; }
.summary-label { margin: 0 0 9px; color: var(--coral-dark); font-size: 12px; font-weight: 800; letter-spacing: .04em; }
.summary-body h2 { margin: 0; font-size: 28px; letter-spacing: -.04em; line-height: 1.14; }
.summary-price { display: flex; margin: 23px 0 14px; gap: 8px; flex-direction: column; line-height: 1.2; }
.summary-price > strong { font-size: 42px; font-weight: 800; letter-spacing: -.05em; }
.summary-price > strong span { color: var(--muted); font-size: 13px; letter-spacing: 0; font-weight: 650; }
.summary-price > span { color: var(--muted); font-size: 13px; }
.summary-included { margin: 0; font-size: 12px; font-weight: 700; line-height: 1.5; }
.purchase-scope { margin: 7px 0 20px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.summary-features { margin: 0; padding: 20px 0 0; list-style: none; border-top: 1px solid var(--line); font-size: 13px; line-height: 1.55; }
.summary-features li { display: flex; gap: 10px; margin-bottom: 11px; }
.summary-features li > span { color: #55735b; font-weight: 700; }
.summary-requirements { margin: 20px 0 0; font-size: 11px; font-weight: 650; }
.summary-caption { color: var(--muted); font-size: 11px; line-height: 1.5; margin: 8px 0 0; }
.checkout-progress { display: flex; align-items: center; gap: 12px; margin: 0 0 23px; padding: 0 4px; list-style: none; }
.checkout-workspace { scroll-margin-top: 100px; }
.pet-form-fields { min-width: 0; margin: 0; padding: 0; border: 0; }
.checkout-progress li { display: flex; align-items: center; gap: 9px; font-size: 12px; font-weight: 650; color: var(--muted); white-space: nowrap; }
.checkout-progress li > span { display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid var(--line); border-radius: 50%; font-size: 11px; }
.checkout-progress li[aria-current="step"] { color: var(--ink); }
.checkout-progress li[aria-current="step"] > span { background: var(--ink); color: var(--paper-soft); border-color: var(--ink); }
.checkout-progress li.is-complete > span { color: #42634a; background: #e1e8d8; border-color: #c2cfb4; }
.checkout-progress .progress-line { height: 1px; background: var(--line); flex: 1; }
.checkout-card, .checkout-noscript { border: 1px solid var(--line); padding: 30px; border-radius: 24px; background: #fffbf1; box-shadow: 0 12px 40px #69452406; }
.card-heading { margin-bottom: 27px; }
.card-heading h2, .checkout-noscript h2 { margin: 0; font-size: 27px; letter-spacing: -.04em; line-height: 1.2; }
.card-heading p { color: var(--muted); margin: 8px 0 0; font-size: 13px; }
.card-heading .review-product { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; margin: 0 0 15px; color: var(--ink); font-size: 12px; font-weight: 750; }
.mac-only-tag { border: 1px solid #d9cbb7; border-radius: 6px; background: #f2eadb; padding: 2px 7px; color: #736047; font-size: 10px; font-weight: 650; }
.pet-details-row { display: grid; grid-template-columns: 1.15fr 1fr; gap: 18px; }
.checkout-field label, .pet-species legend { display: block; padding: 0; margin: 0 0 8px; font-size: 13px; font-weight: 750; }
.checkout-field input { width: 100%; min-width: 0; height: 46px; border: 1px solid #d6cbb7; border-radius: 10px; padding: 0 13px; background: #fffdf7; color: var(--ink); font: inherit; font-size: 14px; }
.checkout-field input::placeholder { color: #8c8071; }
.checkout-field input:focus-visible, .checkout-page button:focus-visible, .checkout-page input:focus-visible + span { outline: 3px solid #a66a3970; outline-offset: 3px; }
.checkout-field input[aria-invalid="true"] { border-color: #a23d33; }
.pet-species { border: 0; margin: 0; padding: 0; min-width: 0; }
.species-options { display: flex; gap: 7px; }
.species-options label { position: relative; flex: 1; }
.species-options input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.species-options span { display: grid; place-items: center; height: 46px; border: 1px solid #d6cbb7; border-radius: 10px; background: #fffdf7; font-size: 13px; font-weight: 650; cursor: pointer; }
.species-options input:checked + span { border-color: #9a5744; background: #f7e3d5; color: #743b2c; box-shadow: inset 0 0 0 1px #9a5744; }
.pet-personality { border: 0; padding: 0; margin: 26px 0 0; min-width: 0; }
.pet-personality legend { padding: 0; font-size: 13px; font-weight: 750; }
.pet-personality > .field-help { margin: 6px 0 12px; }
.personality-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.personality-options label { position: relative; min-width: 0; }
.personality-options input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.personality-card { position: relative; display: flex; flex-direction: column; align-items: flex-start; height: 100%; padding: 14px 12px; border: 1px solid #d6cbb7; border-radius: 12px; background: #fffdf7; cursor: pointer; transition: background-color 140ms, border-color 140ms; }
.personality-options label:hover .personality-card { background: #faf1e5; }
.personality-icon { width: 24px; height: 24px; color: #94775c; margin: 0 0 11px; }
.personality-card strong { font-size: 13px; font-weight: 750; }
.personality-card small { display: block; margin-top: 5px; font-size: 11px; line-height: 1.45; color: var(--muted); }
.personality-selection { position: absolute; top: 11px; right: 10px; display: grid; place-items: center; width: 17px; height: 17px; border: 1px solid #d6cbb7; border-radius: 50%; color: transparent; font-size: 10px; font-weight: 750; }
.personality-options input:checked + .personality-card { border-color: #9a5744; background: #f7e3d5; box-shadow: inset 0 0 0 1px #9a5744; }
.personality-options input:checked + .personality-card strong, .personality-options input:checked + .personality-card .personality-icon { color: #743b2c; }
.personality-options input:checked + .personality-card .personality-selection { border-color: #9a5744; background: #9a5744; color: #fffdf7; }
.photo-section { margin-top: 26px; }
.field-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.field-heading h3 { margin: 0; font-size: 13px; font-weight: 750; }
.field-heading > span { font-size: 11px; color: var(--muted); }
.photo-guidance { margin: 7px 0 13px; font-size: 12px; color: var(--muted); line-height: 1.6; }
.photo-dropzone { display: flex; width: 100%; align-items: center; flex-direction: column; padding: 19px 16px 16px; border: 1.5px dashed #c5b494; border-radius: 13px; color: var(--ink); background: #f7efdf80; font: inherit; cursor: pointer; transition: border-color 140ms, background-color 140ms; }
.photo-dropzone:hover, .photo-dropzone.is-dragging { background: #f9e9d6; border-color: #a56748; }
.photo-dropzone:disabled { cursor: default; opacity: .65; }
.photo-dropzone .upload-symbol { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 10px; margin-bottom: 6px; background: #eadac0; color: #6c5035; font-size: 23px; line-height: 1; }
.photo-dropzone strong { font-size: 13px; }
.photo-dropzone > span:not(.upload-symbol) { font-size: 11px; color: var(--muted); }
.photo-dropzone small { color: var(--muted); font-size: 10px; margin-top: 7px; }
.photo-dropzone.has-photos { flex-direction: row; justify-content: center; gap: 8px; padding: 10px; }
.photo-dropzone.has-photos .upload-symbol { width: 23px; height: 23px; margin-bottom: 0; border-radius: 7px; font-size: 18px; }
.photo-dropzone.has-photos > span:not(.upload-symbol), .photo-dropzone.has-photos small { display: none; }
.photo-previews { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; padding: 0; margin: 13px 0 0; list-style: none; }
.photo-previews:empty { display: none; }
.photo-preview { min-width: 0; position: relative; }
.photo-preview > img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; border-radius: 10px; border: 1px solid #d9ceb9; }
.photo-preview.is-main > img { outline: 2px solid #a35e47; outline-offset: -2px; }
.photo-remove { display: grid; position: absolute; right: 4px; top: 4px; padding: 0; width: 25px; height: 25px; place-items: center; border: 1px solid #ffffff7a; border-radius: 50%; color: #fff; background: #2c231dc9; font: inherit; font-size: 18px; line-height: 1; cursor: pointer; }
.photo-main { width: 100%; min-height: 30px; margin-top: 4px; padding: 2px 0; border: 0; background: none; color: var(--muted); font: inherit; font-size: 10px; cursor: pointer; }
.photo-main[aria-pressed="true"] { color: #874c38; font-weight: 750; }
.photo-main:disabled, .photo-remove:disabled { cursor: default; }
.photo-notices { margin-top: 10px; padding: 10px 12px; border: 1px solid #dec1a1; border-radius: 9px; background: #fff0dc; color: #76462e; font-size: 12px; line-height: 1.5; }
.photo-notices p { margin: 0; }
.photo-notices p + p { margin-top: 7px; }
.local-privacy { display: flex; gap: 7px; align-items: center; color: var(--muted); font-size: 10px; margin: 11px 0 0; }
.local-privacy span { color: #7c8b67; }
.email-field { margin-top: 25px; }
.field-help { color: var(--muted); font-size: 11px; line-height: 1.5; margin: 7px 0 0; }
.field-error { color: #9c332a; font-size: 12px; line-height: 1.5; margin: 7px 0 0; }
.form-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 28px; padding-top: 21px; border-top: 1px solid var(--line); }
.form-price { display: grid; gap: 1px; line-height: 1.45; }
.form-price strong { font-size: 17px; white-space: nowrap; }
.form-price span { color: var(--muted); font-size: 11px; }
.checkout-primary { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 10px 20px; gap: 18px; border: 1px solid var(--ink); border-radius: 12px; background: var(--ink); color: #fff7e8; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.checkout-primary:not(:disabled):hover { background: #514134; border-color: #514134; }
.checkout-primary:disabled { background: #ded6c8; border-color: #ded6c8; color: #72685c; cursor: not-allowed; }
.preview-notice { text-align: center; font-size: 10px; color: var(--muted); line-height: 1.5; margin: 13px 0 0; }
.draft-note { margin: 14px 6px 0; text-align: center; color: var(--muted); font-size: 11px; }
.checkout-text-button { border: 0; background: none; padding: 7px; color: var(--coral-dark); font: inherit; font-size: 12px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.pet-review { display: flex; align-items: center; gap: 16px; padding: 18px; border: 1px solid var(--line); border-radius: 15px; background: #f6eddc; }
.pet-review > img { width: 80px; height: 80px; object-fit: cover; border-radius: 11px; flex-shrink: 0; }
.pet-review > div { min-width: 0; flex: 1; }
.review-overline { display: block; font-size: 9px; color: var(--muted); line-height: 1.5; }
.pet-review h3 { margin: 5px 0 1px; font-size: 23px; letter-spacing: -.035em; line-height: 1.2; }
.pet-review p { font-size: 12px; margin: 0; color: var(--muted); }
.review-details { margin: 23px 0; }
.review-details > div { display: grid; grid-template-columns: .8fr 1.2fr; gap: 18px; padding: 13px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.review-details dt { color: var(--muted); }
.review-details dd { text-align: right; margin: 0; overflow-wrap: anywhere; }
.review-details dd span { color: var(--muted); font-size: 11px; }
.review-total { display: flex; align-items: start; justify-content: space-between; gap: 18px; margin: 25px 0; }
.review-total > div strong { display: block; font-size: 14px; }
.review-total > div span { display: block; margin-top: 3px; font-size: 10px; color: var(--muted); }
.review-total > strong { font-size: 28px; letter-spacing: -.035em; white-space: nowrap; line-height: 1.4; }
.review-total > strong span { font-size: 11px; font-weight: 600; color: var(--muted); letter-spacing: 0; }
.review-scope { margin-top: -9px; margin-bottom: 22px; }
.checkout-unavailable { padding: 14px 17px; border: 1px solid #d9cbb2; border-radius: 12px; background: #f4ecdc; }
.checkout-unavailable strong { font-size: 13px; }
.checkout-unavailable p { margin: 5px 0 0; font-size: 12px; line-height: 1.6; color: var(--muted); }
.checkout-payment { width: 100%; margin-top: 18px; }
.review-back { display: block; margin: 15px auto 0; }
.checkout-footer { display: flex; align-items: center; justify-content: space-between; width: min(100% - 64px, 1120px); margin: 0 auto; padding: 25px 0 35px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; gap: 24px; }
.checkout-footer > div { display: flex; gap: 22px; }
.checkout-footer a { color: var(--muted); text-decoration: none; }
.checkout-page .visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
@media (min-width: 901px) { .order-summary { position: sticky; top: 105px; } }
@media (max-width: 1000px) { .checkout-layout { gap: 28px; } .checkout-card { padding: 24px; } .pet-details-row { gap: 12px; } .summary-body { padding: 24px; } }
@media (max-width: 760px) {
  .checkout-page .checkout-shell { width: min(100% - 36px, 560px); padding-top: 22px; }
  .checkout-page .checkout-intro { padding: 25px 0 28px; }
  .checkout-page .checkout-intro h1 { font-size: 48px; }
  .checkout-page .checkout-intro > p:last-child { font-size: 15px; max-width: 320px; }
  .checkout-layout { grid-template-columns: 1fr; gap: 26px; }
  .order-summary { display: grid; grid-template-columns: 118px minmax(0, 1fr); border-radius: 17px; }
  .companion-preview { height: 100%; min-height: 139px; }
  .preview-menu, .preview-window, .preview-yarn { display: none; }
  .preview-cat { width: 108px; height: 108px; bottom: 15px; right: 3px; }
  .preview-floor { bottom: 14px; }
  .summary-body { padding: 16px 18px; }
  .summary-label { font-size: 11px; margin-bottom: 4px; }
  .summary-body h2 { font-size: 20px; }
  .summary-body h2 br { display: none; }
  .summary-price { flex-direction: row; align-items: baseline; flex-wrap: wrap; gap: 5px 10px; margin: 10px 0 0; }
  .summary-price > strong { font-size: 24px; }
  .summary-price > strong span { font-size: 10px; }
  .summary-price > span { font-size: 10px; }
  .summary-included { margin-top: 10px; font-size: 12px; }
  .purchase-scope { font-size: 12px; }
  .summary-body .purchase-scope { margin-bottom: 10px; }
  .summary-features, .summary-caption { display: none; }
  .summary-requirements { margin-top: 8px; font-size: 11px; line-height: 1.5; }
  .checkout-progress { margin-bottom: 18px; }
  .checkout-workspace { scroll-margin-top: 84px; }
  .checkout-card { padding: 23px; border-radius: 19px; }
  .checkout-field input { font-size: 16px; }
  .checkout-footer { width: calc(100% - 36px); font-size: 11px; gap: 16px; }
  .checkout-footer > div { gap: 14px; }
}
@media (max-width: 420px) {
  .checkout-page .nav { width: calc(100% - 32px); gap: 12px; }
  .checkout-page .brand { font-size: 18px; gap: 8px; }
  .checkout-page .brand img { width: 32px; height: 32px; }
  .checkout-page .checkout-nav { display: flex; gap: 12px; font-size: 11px; }
  .checkout-page .checkout-nav .app-store-link { display: inline-flex; padding: 0; font-size: 11px; }
  .order-summary { grid-template-columns: 84px minmax(0, 1fr); }
  .preview-cat { width: 82px; height: 82px; right: 0; }
  .checkout-card { padding: 20px 17px; }
  .checkout-page .checkout-intro h1 { font-size: 44px; }
  .checkout-page .checkout-intro .eyebrow { font-size: 9px; letter-spacing: .12em; }
  .pet-details-row { grid-template-columns: 1fr 1fr; }
  .pet-review { padding: 13px; gap: 10px; }
  .pet-review > img { width: 62px; height: 62px; }
  .pet-review h3 { font-size: 21px; }
  .form-footer { gap: 10px; }
  .checkout-primary { padding: 10px 13px; gap: 10px; font-size: 12px; }
  .form-price strong { font-size: 15px; }
  .photo-main { font-size: 9px; }
  .checkout-footer { flex-direction: column; align-items: start; }
}
@media (max-width: 360px) {
  .form-footer { flex-wrap: wrap; }
  .form-footer .checkout-primary { width: 100%; }
  .form-price { display: flex; align-items: baseline; gap: 10px; }
}
@media (prefers-reduced-motion: reduce) { .checkout-page { scroll-behavior: auto; } .checkout-page *, .checkout-page *::before, .checkout-page *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }

/* Sandbox checkout and the private receipt keep the same quiet, warm visual language. */
.sandbox-banner { display: flex; align-items: center; gap: 11px; margin-bottom: 24px; padding: 12px 16px; border: 1px solid #d7bf91; border-radius: 12px; background: #fbefd4; color: #74552b; font-size: 12px; line-height: 1.5; }
.sandbox-banner > div { display: flex; flex-wrap: wrap; gap: 3px 12px; }
.sandbox-banner strong { font-weight: 750; }
.sandbox-dot { flex-shrink: 0; width: 7px; height: 7px; border-radius: 50%; background: #a47738; }
.checkout-submit-error { padding: 12px 14px; background: #f9e7df; border: 1px solid #e9c4b5; border-radius: 10px; margin-top: 18px; }
.checkout-text-button:disabled { cursor: wait; opacity: .5; }
.resume-card h2 { font-size: 29px; letter-spacing: -.04em; margin: 17px 0 10px; }
.resume-card > p { color: var(--muted); font-size: 13px; line-height: 1.65; }
.resume-card .review-product { display: flex; gap: 9px; align-items: center; color: var(--ink); font-size: 12px; font-weight: 750; margin: 0; }
.resume-card .resume-pet { color: var(--ink); font-size: 19px; font-weight: 750; padding: 15px 0; border-block: 1px solid var(--line); }
.receipt-status-link { display: block; text-align: center; margin-top: 17px; color: var(--coral-dark); font-size: 12px; text-underline-offset: 3px; }
.confirmation-page .confirmation-shell { max-width: 940px; padding-bottom: 42px; }
.confirmation-intro { text-align: center; max-width: 640px; margin: 8px auto 31px; }
.confirmation-brand { display: grid; place-items: center; width: 100px; height: 100px; margin: 0 auto 17px; border-radius: 29px; border: 1px solid #e7dac4; background: #fff9ed; box-shadow: 0 8px 24px #9b744312; }
.confirmation-brand img { width: 76px; height: 76px; border-radius: 22px; }
.confirmation-intro .eyebrow { margin-bottom: 10px; font-size: 10px; }
.confirmation-intro h1 { font-size: clamp(34px, 4.4vw, 49px); line-height: 1.08; letter-spacing: -.05em; margin: 0; overflow-wrap: anywhere; }
.confirmation-intro > p:not(.eyebrow) { max-width: 530px; margin: 16px auto; color: var(--muted); font-size: 14px; line-height: 1.7; }
.order-state { display: inline-flex; align-items: center; padding: 6px 11px; border: 1px solid #d8cbb5; border-radius: 100px; background: #f4eada; color: #745f45; font-size: 11px; font-weight: 650; }
.order-state[data-state="ready"] { background: #e6eddc; border-color: #c9d7bb; color: #4c6847; }
.order-state[data-state="attention"] { background: #f5e1d6; border-color: #e2beaa; color: #8b5039; }
.confirmation-layout { display: grid; grid-template-columns: 1.08fr 1fr; gap: 22px; align-items: stretch; }
.confirmation-layout .checkout-card { min-width: 0; padding: 30px; }
.confirmation-layout .card-heading h2 { font-size: 27px; }
.confirmation-layout .card-heading p { line-height: 1.6; }
.confirmation-layout .card-heading { margin-bottom: 23px; }
.license-key-area label { display: block; font-size: 11px; color: var(--muted); font-weight: 650; margin-bottom: 8px; }
.license-key-controls { display: flex; gap: 8px; align-items: stretch; border: 1px solid #ccbda3; border-radius: 11px; background: #f3ead8; padding: 7px; }
.license-key-controls input { min-width: 0; width: 100%; border: 0; background: transparent; padding: 7px; color: var(--ink); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.license-copy { flex-shrink: 0; border: 1px solid #d1c4af; border-radius: 7px; background: #fffbf1; color: var(--ink); padding: 7px 11px; font: inherit; font-size: 11px; font-weight: 700; cursor: pointer; }
.license-copy:hover { background: #fff; }
.copy-result { min-height: 16px; font-size: 11px; margin: 8px 0 0; color: #4c6847; }
.license-wait { display: flex; align-items: center; gap: 12px; border: 1px dashed #d6c7ae; border-radius: 11px; padding: 14px; background: #f6eedf; }
.license-wait p { font-size: 12px; color: var(--muted); line-height: 1.6; margin: 0; }
.status-pulse { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; background: #b38b56; box-shadow: 0 0 0 5px #b38b5615; }
.confirmation-details { margin: 22px 0 18px; font-size: 12px; }
.confirmation-details > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); padding: 10px 0; }
.confirmation-details dt { color: var(--muted); }
.confirmation-details dd { text-align: right; margin: 0; overflow-wrap: anywhere; min-width: 0; }
.license-card .purchase-scope { margin-bottom: 0; font-size: 11px; }
.confirmation-page a.checkout-primary { text-decoration: none; }
.receipt-notice { max-width: 700px; margin: 24px auto 0; border: 1px solid #d9cbb2; background: #f8efdd; padding: 14px 18px; border-radius: 12px; font-size: 13px; color: #776047; line-height: 1.65; text-align: center; }
.confirmation-recovery { display: flex; justify-content: center; align-items: center; gap: 14px; margin: 24px auto 0; }
.confirmation-support { text-align: center; color: var(--muted); font-size: 12px; margin: 26px 0 0; }
.confirmation-support a { color: var(--coral-dark); text-underline-offset: 3px; }
.confirmation-order-id { text-align: center; color: var(--muted); font-size: 10px; margin: 13px 0 0; overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .confirmation-layout { grid-template-columns: 1fr; gap: 18px; }
  .confirmation-page .confirmation-shell { max-width: 540px; }
  .confirmation-intro { margin-bottom: 25px; }
  .confirmation-layout .checkout-card { padding: 24px; }
  .confirmation-brand { width: 84px; height: 84px; margin-bottom: 14px; border-radius: 25px; }
  .confirmation-brand img { width: 64px; height: 64px; border-radius: 19px; }
  .sandbox-banner { margin-bottom: 20px; padding: 10px 12px; font-size: 11px; }
}
@media (max-width: 420px) {
  .confirmation-layout .checkout-card { padding: 21px 18px; }
  .confirmation-intro h1 { font-size: 34px; }
  .confirmation-intro > p:not(.eyebrow) { font-size: 13px; }
  .confirmation-recovery { flex-direction: column; }
  .license-key-controls { gap: 3px; padding: 5px; }
  .license-key-controls input { font-size: 11px; padding: 6px; }
  .license-copy { padding: 7px 9px; }
}

/* After purchase, the Mac app is the destination. Keep download and key together. */
.confirmation-intro { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 5px 20px; max-width: none; text-align: left; margin: 26px 0 30px; }
.confirmation-brand { grid-column: 1; grid-row: 1 / 5; width: 72px; height: 72px; margin: 0; border-radius: 22px; }
.confirmation-brand img { width: 56px; height: 56px; border-radius: 17px; }
.confirmation-intro > :not(.confirmation-brand) { grid-column: 2; }
.confirmation-intro .eyebrow { margin: 0 0 3px; }
.confirmation-intro h1 { font-size: clamp(30px, 3.5vw, 40px); }
.confirmation-intro > p:not(.eyebrow) { max-width: 620px; margin: 8px 0 10px; }
.confirmation-intro .order-state { justify-self: start; }
.handoff-card { scroll-margin-top: 110px; background: linear-gradient(150deg, #fffcf4, #f5e8d3); border-color: #d9c8a9; }
.handoff-app { display: flex; align-items: center; gap: 12px; margin-bottom: 25px; }
.handoff-app > img { flex-shrink: 0; width: 54px; height: 54px; border-radius: 16px; box-shadow: 0 4px 11px #ad8b5320; }
.handoff-app > div { min-width: 0; }
.handoff-app strong { display: block; font-size: 15px; letter-spacing: -.02em; }
.handoff-app > div > span { display: block; margin-top: 4px; font-size: 11px; color: var(--muted); }
.handoff-app > .mac-only-tag { margin-left: auto; flex-shrink: 0; }
.handoff-card .card-heading { margin-bottom: 22px; }
.handoff-card .checkout-primary { width: 100%; min-height: 50px; justify-content: center; gap: 10px; font-size: 14px; box-shadow: 0 4px 10px #ab70551a; }
.handoff-card .checkout-primary:focus-visible, .license-copy:focus-visible { outline: 3px solid var(--coral-dark); outline-offset: 4px; }
.handoff-card .preview-notice { font-size: 11px; margin: 10px 0 24px; }
.install-steps { margin: 0; padding: 22px 0 0; list-style: none; border-top: 1px solid #daceb9; display: grid; gap: 20px; }
.install-steps li { display: flex; gap: 12px; }
.install-steps li > span { display: grid; place-items: center; flex: 0 0 26px; height: 26px; border: 1px solid #d2c3a8; border-radius: 50%; font-size: 11px; color: #7b6548; background: #fcf5e7; }
.install-steps strong { display: block; padding-top: 4px; font-size: 12px; }
.install-steps p { color: var(--muted); font-size: 12px; line-height: 1.55; margin: 5px 0 0; }
.license-card .review-product { font-size: 10px; color: var(--coral-dark); text-transform: uppercase; letter-spacing: .12em; font-weight: 750; margin-bottom: 16px; }
.license-card .license-key-controls { margin-top: 9px; }
.license-email-note { display: flex; align-items: flex-start; gap: 11px; padding: 15px 0 2px; color: var(--muted); }
.license-email-note svg { flex: 0 0 19px; margin-top: 2px; color: #9b7953; }
.license-email-note p { margin: 0; font-size: 12px; line-height: 1.6; }
.license-email-note strong { display: block; color: var(--ink); font-weight: 650; }
.handoff-complete { display: flex; justify-content: center; align-items: center; gap: 9px; margin: 22px auto 0; color: #59704d; text-align: center; font-size: 12px; line-height: 1.6; }
.handoff-complete svg { flex: 0 0 18px; }
.confirmation-page .confirmation-support { margin-top: 19px; }
.photo-finalization { max-width: 660px; margin: 0 auto; padding: 34px 36px 0; border: 1px solid #dfcfb4; border-radius: 24px; background: linear-gradient(145deg, #fffcf4, #fbf2e3); box-shadow: 0 8px 30px #9b744309; }
.photo-finalization-top { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.photo-finalization-top .eyebrow { margin: 0; color: var(--coral-dark); font-size: 10px; letter-spacing: .13em; }
.photo-upload-spinner { display: block; width: 22px; height: 22px; flex: 0 0 22px; border: 2px solid #e6d6bf; border-top-color: #a6694e; border-radius: 50%; animation: photo-upload-spin .85s linear infinite; }
@keyframes photo-upload-spin { to { transform: rotate(360deg); } }
.photo-finalization h2 { margin: 0; font-size: clamp(24px, 3vw, 30px); line-height: 1.2; letter-spacing: -.04em; overflow-wrap: anywhere; }
.photo-upload-status { margin: 12px 0 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.photo-finalization-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 13px 18px; }
.photo-finalization-actions:has(button:not([hidden])) { margin-top: 22px; }
.photo-finalization-actions .checkout-primary { min-height: 43px; padding: 11px 22px; font-size: 13px; }
.photo-finalization-actions .checkout-text-button { color: var(--coral-dark); font-size: 13px; text-underline-offset: 3px; }
.photo-finalization .field-help { font-size: 11px; line-height: 1.65; margin: 16px 0 0; }
.photo-finalization-footer { display: flex; align-items: flex-start; gap: 9px; margin-top: 27px; padding: 19px 0; border-top: 1px solid #e5d8c2; color: #7b6a53; }
.photo-finalization-footer svg { flex: 0 0 17px; margin-top: 1px; }
.photo-finalization-footer p { margin: 0; font-size: 12px; line-height: 1.6; }
@media (prefers-reduced-motion: reduce) { .photo-upload-spinner { animation: none; } }
@media (max-width: 760px) {
  .confirmation-intro { grid-template-columns: 1fr; gap: 5px; margin-top: 24px; }
  .confirmation-brand { display: none; }
  .confirmation-intro > :not(.confirmation-brand) { grid-column: 1; }
  .handoff-card { scroll-margin-top: 90px; }
  .handoff-app { margin-bottom: 22px; }
  .handoff-complete { align-items: flex-start; text-align: left; padding-inline: 6px; }
  .handoff-complete svg { margin-top: 1px; }
  .photo-finalization { padding: 27px 24px 0; border-radius: 21px; }
}
@media (max-width: 420px) {
  .handoff-app { gap: 10px; }
  .handoff-app > .mac-only-tag { font-size: 9px; }
  .handoff-app strong { font-size: 14px; }
  .handoff-card .checkout-primary { font-size: 14px; }
}