html, body {
  margin: 0;
  padding: 0;
  background: #F7F7F7;
  min-height: 100dvh;
}
body {
  display: grid;
  place-items: center;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: #F03506; text-decoration: none; }
a:hover { color: #C22B05; }
button { font-family: inherit; }
input { outline: none; box-sizing: border-box; }
*::-webkit-scrollbar { display: none; }

@keyframes shimmer { 0% { background-position: -360px 0; } 100% { background-position: 360px 0; } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes fadeUp { 0% { opacity: 0; transform: translateY(10px); } 100% { opacity: 1; transform: none; } }
@keyframes autoFill { 0% { width: 0; } 100% { width: 100%; } }

/* Background decoration */
.bg-decor { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.bg-ring { position: absolute; right: -90px; top: -90px; width: 340px; height: 340px; border-radius: 50%; box-shadow: inset 0 0 0 44px #FFE5DA; }
.bg-blob { position: absolute; left: -70px; bottom: -70px; width: 260px; height: 260px; border-radius: 50%; background: #FFE5DA; }
.bg-square { position: absolute; left: 120px; bottom: 180px; width: 26px; height: 26px; border-radius: 6px; background: #C78922; transform: rotate(18deg); }
.bg-dot { position: absolute; right: 200px; bottom: 120px; width: 16px; height: 16px; border-radius: 50%; background: #0EC5FF; }

/* Phone frame */
.phone {
  position: relative;
  z-index: 1;
  width: min(390px, 100vw);
  height: min(844px, 100dvh);
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: clamp(0px, (100vw - 820px) * 99, 28px);
  box-shadow: 0 24px 60px rgba(28, 28, 30, .14), 0 4px 18px rgba(255, 56, 60, .08);
}

.screen { flex-grow: 1; display: flex; flex-direction: column; animation: fadeUp .3s ease; }
.screen-scroll { overflow-y: auto; }
.screen-fixed { overflow: hidden; }
.screen-inner-scroll { flex-grow: 1; overflow-y: auto; min-height: 0; }

/* Header */
.header { display: flex; align-items: center; gap: 12px; padding: 14px 16px 12px 16px; background: #FFFFFF; flex-shrink: 0; }
.back-btn { width: 44px; height: 44px; border: none; background: #F8F8F8; border-radius: 12px; display: flex; align-items: center; justify-content: center; cursor: pointer; flex-shrink: 0; transition: background .15s ease; }
.back-btn:hover { background: #EFEFEF; }
.back-btn:active { transform: scale(.94); }
.progress-track { flex-grow: 1; height: 12px; border-radius: 24px; background: #FFE5DA; overflow: hidden; }
.progress-fill { height: 12px; border-radius: 24px; background: linear-gradient(90deg, #F03506 0%, #FF8769 100%); transition: width .35s ease; }
.step-label { width: 34px; text-align: right; font-size: 10px; font-weight: 600; letter-spacing: -.01em; color: #F03506; flex-shrink: 0; }

/* Shared text */
.page-head { padding: 14px 24px 0 24px; }
.page-title { margin: 0; font-size: 24px; font-weight: 500; line-height: 1.1; letter-spacing: -.02em; color: #000000; text-wrap: pretty; }
.page-sub { margin: 8px 0 0 0; font-size: 14px; font-weight: 500; line-height: 1.4; letter-spacing: -.01em; color: #72777B; text-wrap: pretty; }

/* Buttons */
.btn-primary { width: 100%; height: 52px; border: none; border-radius: 8px; background: #F03506; box-shadow: inset 0 0 0 1px #FFA67E; color: #FFFFFF; font-size: 16px; font-weight: 500; letter-spacing: -.01em; cursor: pointer; transition: background .15s ease, opacity .15s ease; }
.btn-primary:hover { background: #D93005; }
.btn-primary:active { transform: scale(.98); }
.btn-primary.small { height: 48px; font-size: 15px; }
.btn-primary.is-disabled { opacity: .4; pointer-events: none; }

.btn-secondary { width: 100%; height: 48px; border: none; border-radius: 8px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #E6E6E6; color: #72777B; font-size: 14px; font-weight: 500; cursor: pointer; }
.btn-secondary:hover { background: #F8F8F8; }

/* Landing */
.landing-top { display: flex; align-items: center; gap: 8px; padding: 22px 24px 0 24px; flex-shrink: 0; }
.landing-logo-text { font-size: 18px; font-weight: 600; letter-spacing: -.01em; color: #1C1C1E; }
.landing-mid { flex-grow: 1; display: flex; flex-direction: column; justify-content: center; padding: 0 24px; min-height: 0; }
.landing-hero-svg { width: 100%; max-height: 236px; display: block; }
.landing-title { margin: 22px 0 0 0; font-size: 32px; font-weight: 600; line-height: 1.1; letter-spacing: -.02em; color: #1C1C1E; text-wrap: pretty; }
.landing-sub { margin: 12px 0 0 0; font-size: 16px; font-weight: 500; line-height: 1.4; letter-spacing: -.01em; color: #72777B; text-wrap: pretty; }
.live-chip-row { display: flex; margin-top: 18px; }
.live-chip { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border-radius: 46px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #EBEBEB, 0 4px 18px rgba(255, 56, 60, .1); }
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: #34C759; animation: pulse 1.6s ease infinite; }
.live-text { font-size: 12px; font-weight: 600; letter-spacing: -.01em; color: #1C1C1E; }
.landing-footer { padding: 12px 24px calc(16px + env(safe-area-inset-bottom)) 24px; flex-shrink: 0; }

/* Purpose */
.purpose-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 22px 24px 24px 24px; }
.option-card { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 16px; min-height: 150px; border: none; border-radius: 12px; text-align: left; cursor: pointer; background: #FFFFFF; box-shadow: inset 0 0 0 1px #EBEBEB; transition: box-shadow .15s ease, background .15s ease; }
.option-card:hover { background: #FFF5F1; }
.option-card:active { transform: scale(.97); }
.option-card.is-selected { background: #FFEEEE; box-shadow: inset 0 0 0 1.5px #F03506; }
.option-title { font-size: 15px; font-weight: 600; letter-spacing: -.01em; color: #1C1C1E; }
.option-desc { font-size: 12px; font-weight: 500; line-height: 1.35; letter-spacing: -.01em; color: #72777B; }

/* Radio rows (budget + intent) */
.radio-list { display: flex; flex-direction: column; gap: 10px; padding: 22px 24px 24px 24px; }
.radio-row { display: flex; align-items: center; gap: 12px; height: 64px; width: 100%; padding: 0 20px; border: none; border-radius: 12px; cursor: pointer; text-align: left; background: #FFFFFF; box-shadow: inset 0 0 0 1px #EBEBEB; transition: box-shadow .15s ease, background .15s ease; }
.radio-row:hover { background: #FFF5F1; }
.radio-row:active { transform: scale(.98); }
.radio-row.is-selected { background: #FFEEEE; box-shadow: inset 0 0 0 1.5px #F03506; }
.radio-row.tall { height: auto; min-height: 72px; padding: 14px 20px; }
.radio-dot { position: relative; width: 16px; height: 16px; border-radius: 50%; background: #FFFFFF; flex-shrink: 0; box-shadow: inset 0 0 0 1.5px #C7C7CC; }
.radio-row.is-selected .radio-dot { box-shadow: inset 0 0 0 1.5px #F03506; }
.radio-dot-fill { position: absolute; left: 4px; top: 4px; width: 8px; height: 8px; border-radius: 50%; background: #F03506; opacity: 0; }
.radio-row.is-selected .radio-dot-fill { opacity: 1; }
.radio-label { flex-grow: 1; font-size: 15px; font-weight: 600; letter-spacing: -.01em; color: #1C1C1E; }
.radio-hint { font-size: 12px; font-weight: 500; letter-spacing: -.01em; color: #F03506; }
.radio-text-col { display: flex; flex-direction: column; gap: 3px; }
.radio-title-lg { font-size: 15px; font-weight: 600; line-height: 1.3; letter-spacing: -.01em; color: #1C1C1E; text-wrap: pretty; }
.radio-desc { font-size: 12px; font-weight: 500; letter-spacing: -.01em; color: #72777B; }

/* Picks */
.picks-hint { margin: 8px 0 0 0; font-size: 15px; font-weight: 500; letter-spacing: -.01em; color: #72777B; }
.price-note { margin: 6px 0 0 0; font-size: 11px; font-weight: 500; letter-spacing: -.01em; color: #A3A3A3; }
.shimmer-list { display: flex; flex-direction: column; gap: 12px; padding: 20px 24px; }
.shimmer-card { height: 128px; border-radius: 12px; background: linear-gradient(90deg, #F5F5F5 25%, #EFEFEF 40%, #F5F5F5 55%); background-size: 720px 100%; animation: shimmer 1.1s linear infinite; }

.empty-state { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 44px 32px 24px 32px; }
.empty-title { margin: 18px 0 0 0; font-size: 20px; font-weight: 600; line-height: 1.2; letter-spacing: -.02em; color: #1C1C1E; text-wrap: pretty; }
.empty-sub { margin: 10px 0 0 0; font-size: 15px; font-weight: 500; line-height: 1.4; letter-spacing: -.01em; color: #72777B; text-wrap: pretty; }
.empty-state .btn-primary { margin-top: 20px; }
.empty-state .btn-secondary { margin-top: 10px; }

.picks-list { display: flex; flex-direction: column; gap: 12px; padding: 20px 24px 8px 24px; }
.laptop-card { border-radius: 12px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #EBEBEB; padding: 12px; display: flex; gap: 12px; transition: box-shadow .15s ease, background .15s ease; }
.laptop-card.is-added { background: #FFFDFC; box-shadow: inset 0 0 0 1.5px #F03506, 0 4px 18px rgba(255, 56, 60, .08); }
.laptop-thumb { position: relative; width: 92px; height: 92px; border-radius: 8px; background: #F5F5F5; display: flex; align-items: center; justify-content: center; flex-shrink: 0; overflow: hidden; }
.laptop-photo { position: absolute; inset: 0; width: 100%; height: 100%; padding: 8px; box-sizing: border-box; object-fit: contain; background: #F5F5F5; }
.laptop-body { flex-grow: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.laptop-brand { font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #72777B; }
.laptop-model { font-size: 15px; font-weight: 600; letter-spacing: -.01em; color: #1C1C1E; margin-top: 2px; }
.laptop-specs { display: flex; flex-wrap: wrap; gap: 6px; }
.spec-pill { height: 22px; display: inline-flex; align-items: center; padding: 0 9px; border-radius: 46px; background: #F8F8F8; box-shadow: inset 0 0 0 1px #EBEBEB; font-size: 11px; font-weight: 500; color: #6F6F6F; white-space: nowrap; }
.laptop-why { font-size: 12px; font-weight: 500; line-height: 1.35; letter-spacing: -.01em; color: #72777B; }
/* No prices on the card, so the interest button takes the whole footer width
   and doubles as a bigger tap target. */
.laptop-foot { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.btn-add { flex-grow: 1; height: 38px; padding: 0 14px; border: none; border-radius: 8px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #E6E6E6; color: #F03506; font-size: 13px; font-weight: 600; cursor: pointer; }
.btn-add:hover { box-shadow: inset 0 0 0 1px #F03506; }
.btn-add:active { transform: scale(.96); }
.btn-added { flex-grow: 1; height: 38px; padding: 0 14px; border: none; border-radius: 8px; background: #F03506; box-shadow: inset 0 0 0 1px #FFA67E; color: #FFFFFF; font-size: 13px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.btn-added:active { transform: scale(.96); }

/* Own model or brand */
.custom-ask { display: flex; flex-direction: column; gap: 6px; padding: 14px; border-radius: 12px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #EBEBEB; transition: box-shadow .15s ease, background .15s ease; }
.custom-ask.is-filled { background: #FFFDFC; box-shadow: inset 0 0 0 1.5px #F03506, 0 4px 18px rgba(255, 56, 60, .08); }
.custom-ask-title { font-size: 14px; font-weight: 600; letter-spacing: -.01em; color: #1C1C1E; }
.custom-ask-sub { font-size: 12px; font-weight: 500; line-height: 1.35; letter-spacing: -.01em; color: #72777B; text-wrap: pretty; }
.custom-ask .text-input { height: 46px; margin-top: 4px; font-size: 14px; }
.custom-ask .field-ok { padding-left: 0; }
.custom-ask-wrap { padding: 0 24px 24px 24px; }

.custom-summary { margin: 12px 24px 0 24px; padding: 14px 16px; border-radius: 12px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #EBEBEB; }
.custom-summary-head { display: flex; align-items: center; justify-content: space-between; }
.custom-summary-label { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #72777B; }
.custom-summary-value { margin-top: 6px; font-size: 15px; font-weight: 600; line-height: 1.3; letter-spacing: -.01em; color: #1C1C1E; overflow-wrap: anywhere; }
.custom-summary-note { margin-top: 6px; font-size: 12px; font-weight: 500; line-height: 1.35; letter-spacing: -.01em; color: #72777B; text-wrap: pretty; }

.not-sure-row { margin-top: 4px; width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px; height: 52px; border: none; border-radius: 12px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #E6E6E6; cursor: pointer; font-size: 14px; font-weight: 500; letter-spacing: -.01em; color: #72777B; }
.not-sure-row:hover { background: #F8F8F8; }
.not-sure-row:active { transform: scale(.98); }

.cart-bar { flex-shrink: 0; display: flex; align-items: center; gap: 12px; padding: 12px 24px calc(14px + env(safe-area-inset-bottom)) 24px; background: #FFFFFF; box-shadow: 0 -1px 0 0 #EBEBEB; }
.cart-count { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; letter-spacing: -.01em; color: #1C1C1E; flex-shrink: 0; }
.cart-badge { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: #C7C7CC; color: #FFFFFF; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; }
.cart-badge.has-items { background: #F03506; }
.cart-bar .btn-primary { flex-grow: 1; height: 48px; width: auto; }

/* Timeline */
.week-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 22px 24px 0 24px; }
.week-card { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 14px 16px; border: none; border-radius: 12px; cursor: pointer; text-align: left; background: #FFFFFF; box-shadow: inset 0 0 0 1px #EBEBEB; transition: box-shadow .15s ease, background .15s ease; }
.week-card:hover { background: #FFF5F1; }
.week-card:active { transform: scale(.97); }
.week-card.is-selected { background: #FFEEEE; box-shadow: inset 0 0 0 1.5px #F03506; }
.week-range { font-size: 15px; font-weight: 600; letter-spacing: -.01em; color: #1C1C1E; white-space: nowrap; }
.week-rel { font-size: 12px; font-weight: 500; letter-spacing: -.01em; color: #72777B; }
.week-card.is-selected .week-rel { color: #F03506; }

.week-unsure { display: block; width: calc(100% - 48px); margin: 10px 24px 0 24px; height: 48px; border: none; border-radius: 12px; cursor: pointer; font-size: 14px; font-weight: 500; letter-spacing: -.01em; background: #F8F8F8; box-shadow: inset 0 0 0 1px #EBEBEB; color: #72777B; transition: box-shadow .15s ease, background .15s ease, color .15s ease; }
.week-unsure:hover { background: #FFF5F1; }
.week-unsure:active { transform: scale(.98); }
.week-unsure.is-selected { background: #FFEEEE; box-shadow: inset 0 0 0 1.5px #F03506; color: #F03506; font-weight: 600; }

.date-note { margin: 14px 24px 20px 24px; font-size: 12px; font-weight: 500; line-height: 1.4; letter-spacing: -.01em; color: #72777B; text-wrap: pretty; }

.footer-bar { flex-shrink: 0; padding: 12px 24px calc(14px + env(safe-area-inset-bottom)) 24px; background: #FFFFFF; box-shadow: 0 -1px 0 0 #EBEBEB; }

/* Contact */
.field-list { display: flex; flex-direction: column; gap: 18px; padding: 22px 24px 24px 24px; }
.field-label { display: flex; flex-direction: column; gap: 8px; }
.field-label-text { font-size: 15px; font-weight: 500; letter-spacing: -.01em; color: #000000; padding-left: 2px; }
.text-input { height: 52px; padding: 0 18px; border: none; border-radius: 12px; background: #F8F8F8; font-size: 15px; font-weight: 500; letter-spacing: -.01em; color: #1C1C1E; box-shadow: inset 0 0 0 1px transparent; width: 100%; }
.text-input:focus { box-shadow: inset 0 0 0 1.5px #F03506; background: #FFFFFF; }
.text-input.has-error { box-shadow: inset 0 0 0 1.5px #F03506; }
.field-error { font-size: 12px; font-weight: 500; color: #F03506; padding-left: 2px; }
.field-ok { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; color: #34C759; padding-left: 2px; }

.phone-field { display: flex; flex-direction: column; gap: 8px; }
.phone-row { display: flex; gap: 8px; }
.phone-prefix { height: 52px; padding: 0 14px; border-radius: 12px; background: #F5F5F5; box-shadow: inset 0 0 0 1px #EBEBEB; display: inline-flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 600; letter-spacing: -.01em; color: #72777B; flex-shrink: 0; }
.phone-input { flex-grow: 1; min-width: 0; height: 52px; padding: 0 18px; border: none; border-radius: 12px; background: #F8F8F8; font-size: 15px; font-weight: 500; letter-spacing: .04em; color: #1C1C1E; box-shadow: inset 0 0 0 1px transparent; }
.phone-input:focus { box-shadow: inset 0 0 0 1.5px #F03506; background: #FFFFFF; }
.phone-input.has-error { box-shadow: inset 0 0 0 1.5px #F03506; }

.auto-box { display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 12px; background: #F8F8F8; box-shadow: inset 0 0 0 1px #EBEBEB; animation: fadeUp .25s ease; }
.auto-title { display: inline-flex; align-items: center; gap: 2px; font-size: 14px; font-weight: 600; letter-spacing: -.01em; color: #1C1C1E; }
.auto-note { font-size: 12px; font-weight: 500; letter-spacing: -.01em; color: #72777B; }
.auto-dots { display: inline-flex; align-items: flex-end; gap: 3px; margin-left: 3px; padding-bottom: 3px; }
.auto-dots i { width: 3px; height: 3px; border-radius: 50%; background: #F03506; animation: pulse 1.2s ease infinite; }
.auto-dots i:nth-child(2) { animation-delay: .2s; }
.auto-dots i:nth-child(3) { animation-delay: .4s; }
.auto-track { height: 4px; border-radius: 4px; background: #FFE5DA; overflow: hidden; margin-top: 2px; }
.auto-fill { height: 4px; border-radius: 4px; background: linear-gradient(90deg, #F03506 0%, #FF8769 100%); animation: autoFill 2s linear forwards; }

.contact-footer { flex-shrink: 0; padding: 12px 24px calc(14px + env(safe-area-inset-bottom)) 24px; background: #FFFFFF; box-shadow: 0 -1px 0 0 #EBEBEB; }
.contact-footnote { margin: 10px 4px 0 4px; font-size: 12px; font-weight: 500; line-height: 1.4; letter-spacing: -.01em; color: #72777B; text-align: center; text-wrap: pretty; }

/* Done */
.done-hero { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 26px 24px 0 24px; }
.done-title { margin: 16px 0 0 0; font-size: 24px; font-weight: 600; line-height: 1.1; letter-spacing: -.02em; color: #000000; }
.done-sub { margin: 8px 0 0 0; font-size: 15px; font-weight: 500; letter-spacing: -.01em; color: #72777B; }

.cart-summary { margin: 20px 24px 0 24px; border-radius: 12px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #EBEBEB; overflow: hidden; }
.cart-summary-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px 10px 16px; }
.cart-summary-title { font-size: 14px; font-weight: 600; letter-spacing: -.01em; color: #1C1C1E; }
.edit-link { border: none; background: none; padding: 6px 8px; margin: -6px -8px; cursor: pointer; font-size: 13px; font-weight: 600; color: #F03506; }
.cart-summary-row { display: flex; align-items: center; gap: 12px; padding: 10px 16px; box-shadow: 0 -1px 0 0 #F5F5F5; }
.cart-summary-thumb { position: relative; width: 44px; height: 44px; border-radius: 8px; background: #F5F5F5; display: flex; align-items: center; justify-content: center; flex-shrink: 0; overflow: hidden; }
.cart-summary-thumb .laptop-photo { padding: 4px; }
.cart-summary-body { flex-grow: 1; min-width: 0; }
.cart-summary-name { font-size: 13px; font-weight: 600; letter-spacing: -.01em; color: #1C1C1E; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cart-summary-spec { font-size: 11px; font-weight: 500; color: #72777B; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.quote-row { padding: 12px 16px; background: #FFEEEE; font-size: 12px; font-weight: 500; line-height: 1.4; letter-spacing: -.01em; color: #1C1C1E; text-wrap: pretty; }

.no-cart-card { margin: 20px 24px 0 24px; border-radius: 12px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #EBEBEB; padding: 16px; display: flex; flex-direction: column; gap: 6px; }
.no-cart-title { font-size: 14px; font-weight: 600; letter-spacing: -.01em; color: #1C1C1E; }
.no-cart-sub { font-size: 13px; font-weight: 500; line-height: 1.4; letter-spacing: -.01em; color: #72777B; text-wrap: pretty; }
.browse-link { margin-top: 8px; align-self: flex-start; border: none; background: none; padding: 0; cursor: pointer; font-size: 13px; font-weight: 600; color: #F03506; }

.add-more-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: calc(100% - 48px); margin: 12px 24px 0 24px; height: 48px; border: none; border-radius: 12px; background: #FFFFFF; box-shadow: inset 0 0 0 1px #E6E6E6; cursor: pointer; font-size: 14px; font-weight: 600; letter-spacing: -.01em; color: #F03506; transition: background .15s ease, box-shadow .15s ease; }
.add-more-btn:hover { background: #FFF5F1; box-shadow: inset 0 0 0 1px #FFB199; }
.add-more-btn:active { transform: scale(.98); }

.done-footnote { margin: 18px 24px 4px 24px; font-size: 13px; font-weight: 500; text-align: center; letter-spacing: -.01em; color: #72777B; }

.done-footer { flex-shrink: 0; padding: 12px 24px calc(14px + env(safe-area-inset-bottom)) 24px; background: #FFFFFF; box-shadow: 0 -1px 0 0 #EBEBEB; display: flex; flex-direction: column; gap: 10px; }
.btn-whatsapp { display: flex; align-items: center; justify-content: center; gap: 8px; height: 52px; border-radius: 8px; background: #25D366; color: #FFFFFF; font-size: 16px; font-weight: 500; letter-spacing: -.01em; }
.btn-whatsapp:hover { background: #1FBF5B; color: #FFFFFF; }
.btn-whatsapp:active { transform: scale(.98); }
.btn-start-over { width: 100%; height: 44px; border: none; border-radius: 8px; background: none; color: #72777B; font-size: 14px; font-weight: 500; letter-spacing: -.01em; cursor: pointer; }
.btn-start-over:hover { color: #1C1C1E; }