/* Native text and SVG: no bitmap scaling, rotation or text blur in the HD option. */
.av1 { position:absolute; inset:0; color:#254936; font-family:inherit; container-type:size; overflow:hidden; }
.av1, .av1 * { box-sizing:border-box; }
.av1-heading { position:absolute; top:24px; left:18px; right:18px; text-align:center; }
.av1-heading>span { display:block; font-size:10px; line-height:1.4; font-weight:750; letter-spacing:.08em; margin-bottom:5px; }
.av1-heading h2 { margin:0; font-size:20px; line-height:1.4; font-weight:900; letter-spacing:-.04em; }
.av1-phone { position:absolute; left:36px; top:88px; width:246px; height:calc(100% - 145px); min-height:310px; max-height:376px; display:flex; flex-direction:column; background:#fff; border:4px solid #254936; border-radius:29px; overflow:hidden; box-shadow:5px 5px 0 #e8bb19; z-index:2; }
.av1-phone-status { height:21px; flex-shrink:0; display:flex; align-items:center; justify-content:space-between; padding:0 15px; font-size:8px; color:#254936; position:relative; }
.av1-phone-island { width:53px; height:6px; background:#254936; position:absolute; left:calc(50% - 26px); top:-1px; border-radius:0 0 6px 6px; }
.av1-phone-header { height:37px; background:#e9f4e6; display:flex; align-items:center; justify-content:space-between; padding:0 13px; border-bottom:1px solid #d4e6cc; flex-shrink:0; }
.av1-phone-header>b { font-size:13px; font-weight:900; }.av1-phone-header>span { font-size:24px; line-height:1; }
.av1-chat { flex:1; min-height:0; background:#e9f4e6; padding:10px 11px; display:flex; flex-direction:column; gap:8px; position:relative; }
.av1-today { font-size:8px; font-weight:700; display:block; align-self:center; line-height:1; color:#6c8262; }
.av1-message { display:flex; align-items:flex-start; gap:5px; }
.av1-mini-face { flex:0 0 19px; height:19px; background:#ffdb29; color:#254936; border:1px solid #254936; border-radius:7px; display:grid; place-items:center; font-size:13px; line-height:1; margin-top:2px; }
.av1-bubble { background:#fff; border-radius:3px 12px 12px; padding:9px 10px; flex:1; min-width:0; }
.av1-bubble>b { display:block; font-size:11px; font-weight:850; line-height:1.6; white-space:nowrap; }
.av1-bubble>span { display:block; font-size:10px; font-weight:600; line-height:1.7; }
.av1-message-reply { justify-content:flex-end; }.av1-reply { border-radius:13px 3px 13px 13px; background:#ade978; padding:8px 12px; display:flex; gap:20px; font-size:14px; font-weight:850; }.av1-reply>span { font-size:14px; }
.av1-confirm .av1-confirm-tag { font-size:8px; line-height:1.5; padding-top:6px; margin-top:5px; border-top:1px solid #dfebd9; white-space:nowrap; }
.av1-input { height:28px; flex-shrink:0; display:flex; align-items:center; gap:7px; padding:0 12px 2px; color:#698161; }.av1-input>b { font-size:19px; line-height:1; }.av1-input>span { border-radius:10px; font-size:8px; background:#f2f5ef; color:#899882; padding:4px 10px; flex:1; }.av1-input>i { font-style:normal; font-size:17px; }
.av1-side { position:absolute; left:calc(50% + 27px); right:29px; top:90px; bottom:57px; display:flex; flex-direction:column; justify-content:space-around; align-items:center; z-index:3; }
.av1-buddy { width:100%; display:flex; flex-direction:column; align-items:center; }.av1-mascot { width:132px; height:132px; display:block; overflow:visible; }.av1-buddy>span { display:inline-block; margin-top:2px; font-size:10px; line-height:1.6; font-weight:850; white-space:nowrap; }
.av1-result { background:#fffdf1; border:2px solid #254936; border-radius:17px; padding:15px 10px 13px; width:100%; max-width:212px; text-align:center; position:relative; box-shadow:4px 4px 0 #e8bb19; }
.av1-result-icon { display:flex; margin:0 auto 7px; border-radius:11px; width:39px; height:35px; justify-content:center; align-items:center; background:#e4f1d9; }.av1-result-icon svg { width:30px; height:30px; }.av1-result b { display:block; font-size:11px; font-weight:900; line-height:1.6; white-space:nowrap; }.av1-result>div>span { display:block; font-size:9px; line-height:1.7; font-weight:650; white-space:nowrap; }.av1-done { width:25px; height:25px; border-radius:50%; display:grid; place-items:center; background:#254936; color:#fff; position:absolute; top:-10px; right:-8px; border:2px solid #ffdb29; }.av1-done svg { width:20px; height:20px; }
.av1-conditional { border-style:dashed; background:#fff7cb; }.av1-conditional .av1-result-icon { background:#ffe896; }
.av1-steps { position:absolute; left:16px; right:16px; bottom:18px; display:flex; align-items:center; justify-content:center; gap:7px; font-size:9px; font-weight:800; z-index:3; }.av1-step { display:flex; align-items:center; gap:5px; line-height:1.4; white-space:nowrap; }.av1-step>b { background:#fff8cc; border:1px solid #254936; width:20px; height:20px; border-radius:50%; display:grid; place-items:center; font-size:9px; }.av1-steps>i { font-style:normal; font-size:16px; color:#a28b20; }
.av1-star { position:absolute; font-size:28px; line-height:1; z-index:1; }.av1-star-one { top:80px; right:23px; }.av1-star-two { bottom:68px; left:13px; font-size:19px; }
.av1-upload { justify-content:flex-end; margin-left:25px; }.av1-upload .av1-bubble { border-radius:12px 3px 12px 12px; background:#ade978; padding:7px 9px; }.av1-upload .av1-bubble>b { font-size:10px; margin-bottom:5px; }
.av1-document, .av1-businesscard { position:relative; overflow:hidden; background:#fffefa; border-radius:3px; padding:8px 10px; min-height:57px; color:#254936; }
.av1-document>b { display:block; font-size:10px; line-height:1.4; }.av1-document>span { display:block; font-size:7px; line-height:1.5; margin-top:1px; }.av1-document>i { display:block; width:90%; height:2px; background:#d6dece; margin-top:4px; }.av1-document>i:nth-of-type(2) { width:70%; }
.av1-businesscard { display:flex; gap:9px; align-items:center; }.av1-card-logo { border:1.5px solid #254936; border-radius:50%; background:#ffdb29; font-size:12px; font-weight:900; width:25px; height:25px; display:grid; place-items:center; flex-shrink:0; }.av1-businesscard>div>b { display:block; font-size:11px; line-height:1.5; }.av1-businesscard>div>span { display:block; font-size:8px; }.av1-businesscard>div>i { display:block; background:#d6dece; width:70px; height:2px; margin-top:3px; }
.av1-summary>b { font-size:10px; }.av1-summary dl { margin:5px 0 0; border-top:1px solid #e0e8da; padding-top:5px; }.av1-summary dl>div { display:flex; justify-content:space-between; gap:5px; margin-top:3px; line-height:1.5; }.av1-summary dt { margin:0; font-size:8px; color:#718767; white-space:nowrap; }.av1-summary dd { margin:0; font-size:9px; font-weight:750; white-space:nowrap; }
.av1-process { position:absolute; bottom:28px; left:40px; font-size:10px; display:flex; align-items:center; gap:5px; font-weight:750; opacity:0; }.av1-process>span { display:flex; gap:3px; }.av1-process i { width:3px; height:3px; background:#254936; border-radius:50%; }.av1-scanline { opacity:0; position:absolute; left:0; right:0; height:3px; top:0; background:#22a454; }
.d2-slide.is-active .av1-message-first { animation:av1-first 10s both; }.d2-slide.is-active .av1-message-reply { animation:av1-reply 10s both; }.d2-slide.is-active .av1-message-final { animation:av1-final 10s both; }.d2-slide.is-active .av1-result { animation:av1-result 10s both; }.d2-slide.is-active .av1-process { animation:av1-process 10s both; }.d2-slide.is-active .av1-scanline { animation:av1-scan 10s both; }.d2-slide.is-active .av1-mascot { animation:av1-bob 3s ease-in-out infinite; }.d2-slide.is-active .av1-wave { transform-origin:124px 78px; animation:av1-wave 2.2s ease-in-out infinite; }.d2-slide.is-active .av1-star { animation:av1-spark 3s ease-in-out infinite; }.d2-slide.is-active .av1-step-3>b { animation:av1-step 10s both; }
@keyframes av1-first { 0% { opacity:.3; transform:translateY(7px); } 10%,100% { opacity:1; transform:none; } }
@keyframes av1-reply { 0%,25% { opacity:0; transform:translateY(9px); } 33%,100% { opacity:1; transform:none; } }
@keyframes av1-final { 0%,48% { opacity:0; transform:translateY(9px); } 57%,100% { opacity:1; transform:none; } }
@keyframes av1-result { 0%,64% { opacity:0; transform:translateY(11px); } 74%,100% { opacity:1; transform:none; } }
@keyframes av1-process { 0%,18% { opacity:0; } 24%,43% { opacity:1; } 49%,100% { opacity:0; } }
@keyframes av1-scan { 0%,17% { opacity:0; top:0; } 20% { opacity:1; top:0; } 43% { opacity:1; top:100%; } 46%,100% { opacity:0; top:100%; } }
@keyframes av1-bob { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-4px); } }
@keyframes av1-wave { 0%,60%,100% { transform:rotate(0deg); } 20%,40% { transform:rotate(-11deg); } 30%,50% { transform:rotate(7deg); } }
@keyframes av1-spark { 0%,100% { opacity:.55; transform:scale(.85); } 50% { opacity:1; transform:scale(1.07); } }
@keyframes av1-step { 0%,60% { background:#fff8cc; color:#254936; } 68%,100% { background:#254936; color:#fff; } }
@container (max-width: 490px) {
 .av1-phone { left:24px; width:224px; }.av1-side { left:268px; right:20px; }.av1-mascot { width:113px; height:113px; }.av1-result { padding:12px 6px; }.av1-result b { font-size:9px; }.av1-result>div>span { font-size:8px; }.av1-buddy>span { font-size:8px; }
}
@container (max-width: 430px) {
 .av1-heading { top:22px; }.av1-heading>span { font-size:9px; }.av1-heading h2 { font-size:17px; }
 .av1-phone { width:232px; height:310px; min-height:0; left:calc(50% - 116px); top:76px; }
 .av1-side { left:0; right:0; top:0; bottom:0; display:block; pointer-events:none; }
 .av1-buddy { position:absolute; top:55px; right:3px; width:59px; z-index:4; }.av1-mascot { width:59px; height:59px; }.av1-buddy>span { display:none; }
 .av1-result { position:absolute; top:399px; left:22px; right:22px; max-width:none; width:auto; height:59px; padding:8px 10px; display:flex; align-items:center; gap:8px; text-align:left; border-radius:13px; }.av1-result-icon { width:32px; height:32px; margin:0; flex-shrink:0; }.av1-result-icon svg { width:25px; height:25px; }.av1-result b { font-size:11px; }.av1-result>div>span { font-size:9px; }.av1-done { right:8px; top:16px; width:23px; height:23px; }
 .av1-steps { bottom:19px; gap:5px; font-size:8px; }.av1-step { gap:4px; }.av1-step>b { width:18px; height:18px; font-size:8px; }.av1-steps>i { font-size:14px; }
 .av1-star-one { right:14px; top:365px; font-size:21px; }.av1-star-two { left:12px; bottom:169px; font-size:17px; }
}
@container (max-width: 300px) {
 .av1-heading h2 { font-size:15px; }.av1-phone { width:222px; left:calc(50% - 111px); }.av1-buddy { right:0; top:58px; width:51px; }.av1-mascot { width:51px; height:51px; }.av1-result { left:17px; right:17px; padding-left:8px; gap:6px; }.av1-result b { font-size:10px; }.av1-result>div>span { font-size:8px; }.av1-done { right:4px; }.av1-steps { gap:3px; font-size:7px; }.av1-step { gap:3px; }
}
@media (min-width:761px) and (max-height:800px) { .av1-heading { top:19px; }.av1-heading>span { margin-bottom:3px; }.av1-heading h2 { font-size:18px; }.av1-phone { top:75px; min-height:310px; }.av1-side { top:76px; bottom:56px; }.av1-mascot { width:118px; height:118px; }.av1-result { padding-top:11px; padding-bottom:10px; }.av1-steps { bottom:16px; } }
.d2-animation-paused .av1 * { animation-play-state:paused !important; }
.d2-static-story .av1 *, .d2-reduced-motion .av1 * { animation:none !important; }
.d2-static-story .av1-process, .d2-reduced-motion .av1-process, .d2-static-story .av1-scanline, .d2-reduced-motion .av1-scanline { opacity:0; }
.d2-static-story .av1-step-3>b, .d2-reduced-motion .av1-step-3>b { background:#254936; color:#fff; }
@media (prefers-reduced-motion:reduce) { .av1 * { animation:none !important; }.av1-process, .av1-scanline { opacity:0; }.av1-step-3>b { background:#254936; color:#fff; } }

/* Keep the compact tablet canvas readable without scaling the phone text. */
@container (max-width:430px) {
 .av1-side { top:0; bottom:0; }
 .av1-mascot { width:59px; height:59px; }
 .av1-result { padding:8px 10px; }
}
@container (max-width:430px) and (max-height:470px) {
 .av1-heading { top:15px; }.av1-heading>span { font-size:8px; margin-bottom:3px; }.av1-heading h2 { font-size:16px; }
 .av1-phone { top:70px; height:310px; min-height:0; }.av1-buddy { top:53px; }.av1-mascot { width:51px; height:51px; }
 .av1-result { top:390px; height:34px; padding:3px 8px; border-width:1.5px; border-radius:9px; box-shadow:none; gap:7px; }
 .av1-result-icon { width:24px; height:24px; border-radius:6px; }.av1-result-icon svg { width:20px; height:20px; }.av1-result b { font-size:8px; line-height:1.45; }.av1-result>div>span { font-size:8px; line-height:1.45; }.av1-done { width:19px; height:19px; top:6px; right:8px; }.av1-done svg { width:14px; height:14px; }
 .av1-steps { display:none; }.av1-star-one { top:361px; }.av1-star-two { bottom:100px; }
}