.demo-entry { margin:5px 0 0; font-weight:600; }
.result-demo-badge { display:inline-flex; padding:5px 10px; border-radius:20px; background:#e5ece6; color:#425c4a; font-size:11px; font-weight:600; letter-spacing:.2px; }
.result-toolbar { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.result-toolbar .motion-toggle { font-size:11px; }
.result-hero { text-align:center; padding:5px 0 15px; }
.result-motion { width:190px; height:150px; position:relative; margin:0 auto 7px; display:grid; place-items:center; }
.result-motion::before { content:""; position:absolute; inset:12px 18px 0; border-radius:50%; background:radial-gradient(ellipse,#cdeecf90,transparent 70%); }
.result-bear { position:relative; width:142px; height:142px; object-fit:contain; transform-origin:50% 90%; }
.result-motion[data-mood="savings"] .result-bear { animation:result-celebrate 1.5s cubic-bezier(.22,.8,.25,1) both; }
.result-motion[data-mood="no-lower"] .result-bear { animation:result-reassure 2.5s ease-in-out both; }
.result-motion[data-mood="no-match"] .result-bear { animation:result-curious 1.8s ease-in-out both; }
.result-token { position:absolute; right:0; top:35px; width:36px; height:36px; display:grid; place-items:center; border-radius:50%; background:#fff9e4; border:1px solid #e2d8b1; color:#356749; font-size:23px; font-weight:600; box-shadow:0 5px 16px #315a3710; }
.result-token--second { top:82px; left:2px; width:25px; height:25px; font-size:17px; }
.result-motion[data-mood="savings"] .result-token { animation:result-coin 1.7s ease-out both; }
.result-motion[data-mood="savings"] .result-token--second { animation-delay:.15s; }
.result-motion:not([data-mood="savings"]) .result-token--second { display:none; }
.result-motion:not([data-mood="savings"]) .result-token { top:auto; bottom:8px; right:15px; background:#e9f5eb; border-color:#c9e0cf; font-size:20px; }
.result-title { font-size:30px; line-height:1.12; letter-spacing:-1px; margin:8px 0 9px; }
.result-amount { color:var(--green); font-size:44px; line-height:1.1; font-weight:700; letter-spacing:-1.8px; margin:10px 0; }
.result-lead { font-size:14px; line-height:1.6; color:var(--muted); margin:8px auto; max-width:320px; }
.result-context, .result-note { font-size:12px; line-height:1.6; color:var(--muted); margin:10px 0 15px; overflow-wrap:anywhere; }
.offer-preview { display:block; overflow:hidden; border:1px solid #dce5dd; border-radius:23px; margin:12px 0; background:white; color:var(--ink); text-decoration:none; }
.offer-preview:hover { border-color:#95bca0; }
.offer-browser { display:flex; align-items:center; gap:8px; padding:12px 15px; border-bottom:1px solid var(--line); font-size:12px; color:var(--muted); background:#fafcf9; }
.offer-browser img { width:22px; height:22px; object-fit:contain; }
.offer-browser .offer-host { flex:1; overflow-wrap:anywhere; }
.offer-content { padding:17px; }
.offer-content strong { display:block; font-size:17px; line-height:1.35; }
.offer-meta { display:block; color:var(--muted); font-size:12px; line-height:1.5; margin-top:5px; }
.offer-price { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:16px; font-size:22px; font-weight:650; }
.offer-price small { font-size:12px; font-weight:550; color:var(--green); }
.result-facts { background:white; border-radius:18px; padding:5px 15px; }
.result-fact { display:flex; gap:14px; justify-content:space-between; padding:12px 0; font-size:13px; line-height:1.45; }
.result-fact+.result-fact { border-top:1px solid var(--line); }
.result-fact a { color:var(--green); text-underline-offset:3px; }
.result-fact strong { white-space:nowrap; }
.result-actions { display:grid; gap:10px; margin:17px 0 12px; }
.result-watch { border-radius:21px; background:#e7f1e9; padding:18px; margin-top:16px; }
.result-watch h3 { margin:8px 0; font-size:19px; line-height:1.25; letter-spacing:-.4px; }
.result-watch p { margin:8px 0 14px; color:#45614d; font-size:13px; line-height:1.6; }
.demo-outcomes { border:0; padding:18px 0 0; margin:20px 0 0; border-top:1px solid #dde3de; }
.demo-outcomes legend { float:left; width:100%; font-size:12px; color:var(--muted); margin-bottom:10px; }
.outcome-options { display:flex; gap:6px; clear:both; }
.outcome-options button { flex:1; padding:10px 5px; min-height:44px; border:1px solid #e0e5e0; border-radius:13px; background:white; font-size:12px; line-height:1.3; }
.outcome-options button[aria-pressed="true"] { color:#155936; border-color:#9abea4; background:#e6f3e8; font-weight:600; }
.cashier-notice { padding:12px 14px; margin:16px 0; background:#fff5dc; border:1px solid #e9dbb7; color:#68532a; font-size:13px; line-height:1.5; border-radius:16px; }
.cashier-brand { display:flex; align-items:center; gap:9px; margin-top:8px; font-weight:650; }
.cashier-brand img { width:38px; height:38px; object-fit:contain; }
.cashier-title { font-size:26px; line-height:1.2; letter-spacing:-.8px; margin:20px 0 8px; }
.cashier-price { font-size:40px; font-weight:700; letter-spacing:-1.5px; margin:15px 0 3px; }
.cashier-source { display:flex; align-items:center; gap:8px; padding:14px 0; min-height:44px; color:var(--green); overflow-wrap:anywhere; font-size:14px; line-height:1.5; }
.motion-paused .result-motion * { animation:none!important; opacity:1; transform:none; }
.page-hidden .result-motion * { animation-play-state:paused!important; }
@keyframes result-celebrate { 0% { opacity:0; transform:translateY(14px) scale(.85); } 35% { opacity:1; transform:translateY(-9px) rotate(-5deg) scale(1.03); } 60% { transform:translateY(0) rotate(4deg); } 80% { transform:translateY(-4px) rotate(-2deg); } 100% { opacity:1; transform:none; } }
@keyframes result-coin { 0% { opacity:0; transform:translateY(18px) scale(.6); } 45% { opacity:1; transform:translateY(-9px) rotate(12deg); } 100% { opacity:1; transform:none; } }
@keyframes result-reassure { 0% { opacity:0; transform:translateY(6px) scale(.95); } 35% { opacity:1; transform:rotate(-3deg); } 70% { transform:rotate(3deg); } 100% { opacity:1; transform:none; } }
@keyframes result-curious { 0% { opacity:0; transform:rotate(-5deg) scale(.95); } 40% { opacity:1; transform:rotate(4deg); } 100% { opacity:1; transform:none; } }
@media(prefers-reduced-motion:reduce) { .result-motion * { animation:none!important; } }