/* GLP-1 quiz, ported from the design canvas (Chat.dc.html). */
html,body{margin:0;height:100%;background:#E8EEF2}
#quiz{height:100vh;height:100dvh;max-width:520px;margin:0 auto;background:#FFFFFF;box-shadow:0 0 0 1px #D9E1E7}
@media (max-width:520px){#quiz{box-shadow:none}}
.q-app{--q-forest:#0F2A2E;--q-ink:#0F2A2E;--q-muted:#5B6E73;--q-line:#D9E1E7;--q-crema:#F3F6F8;--q-sand:#E8EEF2;--q-coral:#3F7FE0;--q-ok:#16804A;--q-ease:cubic-bezier(.22,.8,.24,1);position:relative;width:100%;height:100%;display:flex;flex-direction:column;background:#FFFFFF;color:var(--q-ink);font-family:"Inter",system-ui,sans-serif;overflow:hidden;-webkit-tap-highlight-color:transparent}
.q-app *{box-sizing:border-box}
.q-app button,.q-app input{font-family:inherit}
.q-hd{flex:none;padding:10px 16px 8px;background:#FFFFFF;position:relative;z-index:3;box-shadow:0 1px 0 var(--q-line)}
.q-hdrow{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:44px}
.q-back{justify-self:start;width:44px;height:44px;margin-left:-10px;border:0;background:transparent;color:var(--q-ink);display:flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer}
.q-logo{justify-self:center;display:flex;align-items:center;text-decoration:none;border-radius:8px}
.q-logo:focus-visible{outline:3px solid var(--q-coral);outline-offset:3px}
.q-sec{justify-self:end;font-size:12.5px;font-weight:600;color:var(--q-forest);letter-spacing:.02em;min-width:44px;text-align:right}
.q-prog{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-top:6px}
.q-prog span{height:4px;border-radius:99px;background:#E6ECF0;overflow:hidden}
.q-prog i{display:block;height:100%;width:0;border-radius:99px;background:var(--q-forest);transition:width .55s var(--q-ease)}
.q-stage{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 14px);mask-image:linear-gradient(to bottom,transparent 0,#000 14px);position:relative;flex:1 1 0;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:4px 0 28px}
.q-turn{padding:16px 22px 4px;display:flex;flex-direction:column;gap:12px}
.q-stage::after{content:"";display:block;height:100%}
.leaving .q-opt:not(.on),.leaving .q-foot,.leaving .q-field,.leaving .q-hw,.leaving .q-live,.leaving .q-trust,.leaving .q-more,.leaving .q-stack,.leaving .q-pays,.leaving .q-consent,.leaving .q-pre,.leaving .q-lab,.leaving .q-tl,.leaving .q-sub,.leaving .q-plan:not(.on){opacity:0;transform:translateY(4px);transition:opacity .14s ease,transform .14s ease;pointer-events:none}
.q-body{display:flex;flex-direction:column;gap:12px}
.q-foot{display:flex;flex-direction:column;gap:8px;align-items:stretch;padding-top:4px}
.k-inter .q-body,.k-proj .q-body,.k-loader .q-body,.k-end .q-body{background:#FFFFFF;border:1px solid var(--q-line);box-shadow:0 1px 2px rgba(15,42,46,.04),0 8px 24px -12px rgba(15,42,46,.12);border-radius:24px;padding:20px 18px}
.k-inter .q-art,.k-inter .q-bmi,.k-proj .q-chart{background:var(--q-crema)}
.answered{pointer-events:none}
.answered .q-opts,.answered .q-foot,.answered .q-field,.answered .q-hw,.answered .q-live,.answered .q-trust,.answered .q-more,.answered .q-stack,.answered .q-pays,.answered .q-consent,.answered .q-pre,.answered .q-lab,.answered .q-tl,.answered .q-sub,.answered .q-plan:not(.on){display:none}
.answered .q-q{font-size:13px;margin-bottom:-4px;line-height:1.35;font-weight:600;letter-spacing:0;color:#5B6E73}
.answered .q-big{font-size:15px}
.q-me{align-self:flex-end;max-width:78%;background:var(--q-forest);color:#FFFFFF;border-radius:20px 20px 4px 20px;padding:10px 16px;font-size:15.5px;font-weight:600;line-height:1.35;transform-origin:100% 100%;animation:q-me .26s cubic-bezier(.34,1.56,.64,1) both;margin-top:2px}
@keyframes q-me{from{transform:scale(.9) translateY(8px)}to{transform:none}}
.q-typing{display:flex;align-items:center;gap:10px;padding:14px 22px;animation:q-rise .25s var(--q-ease) both}
.q-dots{display:inline-flex;gap:4px;background:var(--q-sand);border-radius:4px 16px 16px 16px;padding:12px 14px}
.q-dots i{width:7px;height:7px;border-radius:50%;background:#A9B5BD;animation:q-blink 1s infinite}
.q-dots i:nth-child(2){animation-delay:.16s}.q-dots i:nth-child(3){animation-delay:.32s}
@keyframes q-blink{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-3px)}}
.q-in{animation:q-rise .42s var(--q-ease) both;animation-delay:var(--d,0ms)}
@keyframes q-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.q-lead{display:flex;gap:10px;align-items:flex-start;background:var(--q-sand);border-radius:4px 18px 18px 18px;padding:11px 14px 11px 11px;margin-bottom:4px;align-self:flex-start;max-width:88%}
.q-lead p{margin:0;font-size:15px;line-height:1.42;color:#2E2C28;font-weight:500}
.q-av{width:28px;height:28px;border-radius:50%;flex:none;background:var(--q-forest);display:flex;align-items:center;justify-content:center;overflow:hidden}
.q-av img{width:100%;height:100%;display:block}
.q-av-t{color:#FFF;font-weight:600;font-size:14px}
.q-eyebrow{margin:0;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--q-ok)}
.q-q{margin:0;font-size:27px;line-height:1.14;font-weight:600;letter-spacing:-0.028em;text-wrap:balance}
.q-big{font-size:32px}
.q-q em{font-family:"Inter Tight",system-ui,sans-serif;font-style:normal;font-weight:500;color:var(--q-forest)}
.q-hl{color:var(--q-forest);font-variant-numeric:tabular-nums}
.q-sub{margin:-2px 0 2px;font-size:15px;line-height:1.45;color:var(--q-muted)}
.q-text{margin:0;font-size:16px;line-height:1.5;color:#34494D}
.q-fine{margin:0;font-size:12.5px;line-height:1.45;color:var(--q-muted)}
.q-opts{display:flex;flex-direction:column;gap:9px;margin-top:6px}
.q-opt{position:relative;width:100%;min-height:56px;padding:12px 16px;border-radius:16px;border:1.5px solid var(--q-line);background:#FFFFFF;color:var(--q-ink);display:flex;align-items:center;gap:12px;text-align:left;cursor:pointer;transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .12s ease}
.q-opt.on{background:var(--q-sand);border-color:var(--q-forest);box-shadow:0 0 0 1px var(--q-forest) inset}
.q-optx{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.q-optx b{font-size:16px;font-weight:500;line-height:1.3}
.q-optx small{font-size:13px;color:var(--q-muted)}
.q-tick{width:24px;height:24px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;color:#FFF;background:var(--q-forest);transform:scale(0);transition:transform .22s cubic-bezier(.34,1.56,.64,1)}
.q-opt.on .q-tick{transform:scale(1)}
.q-box{width:22px;height:22px;border-radius:7px;flex:none;border:2px solid #BCC7CE;display:flex;align-items:center;justify-content:center;color:transparent;transition:background .15s ease,border-color .15s ease}
.q-box svg{transform:scale(.4);transition:transform .22s cubic-bezier(.34,1.56,.64,1)}
.q-opt.on .q-box{background:var(--q-forest);border-color:var(--q-forest);color:#FFF}
.q-opt.on .q-box svg{transform:scale(1)}
.q-pop{animation:q-pop .26s cubic-bezier(.34,1.56,.64,1)}
@keyframes q-pop{40%{transform:scale(.97)}100%{transform:scale(1)}}
.q-press{transition:transform .09s ease}
.q-press:active{transform:scale(.97)}
.q-cta{height:56px;border:0;border-radius:999px;background:var(--q-forest);color:#FFFFFF;font-size:17px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background .2s ease,transform .12s ease,opacity .2s ease;box-shadow:0 8px 20px -10px rgba(15,42,46,.55)}
.q-cta:disabled{background:var(--q-sand);color:#8A8478;box-shadow:none;cursor:not-allowed}
.q-ghost{height:50px;border-radius:999px;border:1.5px solid #CAD3DA;color:var(--q-ink);text-decoration:none;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:15px}
.q-note{display:flex;align-items:center;justify-content:center;gap:6px;font-size:12.5px;color:var(--q-muted);text-align:center}
.q-note svg{width:15px;height:15px;color:var(--q-ok);flex:none}
.q-field{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.q-field span{font-size:13px;font-weight:600;color:var(--q-muted)}
.q-field input{height:58px;border-radius:16px;border:1.5px solid var(--q-line);padding:0 16px;font-size:19px;font-weight:500;color:var(--q-ink);outline:none;background:#FFF;transition:border-color .15s ease,box-shadow .15s ease}
.q-field input:focus{border-color:var(--q-forest);box-shadow:0 0 0 3px rgba(15,42,46,.12)}
.q-trust{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.q-trust span{display:flex;align-items:center;gap:8px;font-size:14px;color:#34494D}
.q-trust span:before{content:"";width:18px;height:18px;border-radius:50%;flex:none;background:#E1F0EA url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F7A57' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/11px no-repeat}
.q-hw{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.q-num{display:flex;flex-direction:column;gap:6px;border:1.5px solid var(--q-line);border-radius:18px;padding:12px 14px;transition:border-color .15s ease,box-shadow .15s ease}
.q-num:focus-within{border-color:var(--q-forest);box-shadow:0 0 0 3px rgba(15,42,46,.12)}
.q-numlab{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--q-muted)}
.q-numrow{display:flex;align-items:baseline;gap:6px}
.q-numrow input{width:100%;min-width:0;border:0;outline:none;font-size:36px;font-weight:600;letter-spacing:-0.03em;padding:0;color:var(--q-ink);background:transparent;font-variant-numeric:tabular-nums}
.q-numrow input::placeholder{color:#D6CFC2}
.q-numrow em{font-style:normal;font-size:16px;color:var(--q-muted);font-weight:600}
.q-app input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.q-app input[type=number]{-moz-appearance:textfield}
.q-live{margin:2px 0 0;font-size:15px;color:var(--q-forest);min-height:20px}
.q-bmi{background:var(--q-crema);border-radius:22px;padding:18px;display:flex;flex-direction:column;gap:10px}
.q-bmirow{display:flex;align-items:baseline;gap:10px}
.q-bmirow strong{font-size:56px;line-height:1;font-weight:600;letter-spacing:-0.04em;font-variant-numeric:tabular-nums}
.q-bmirow span{font-size:15px;font-weight:600;color:var(--q-forest)}
.q-gauge{position:relative;height:10px;border-radius:99px;background:linear-gradient(90deg,#CBEBDC 0%,#CBEBDC 33%,#F6DDB0 33%,#F6DDB0 50%,#F4B9A6 50%,#F4B9A6 100%)}
.q-gauge i{position:absolute;top:-6px;width:22px;height:22px;border-radius:50%;background:var(--q-ink);border:3px solid #FFF;transform:translateX(-50%);box-shadow:0 2px 6px rgba(0,0,0,.2);transition:left .9s var(--q-ease)}
.q-gaugel{display:flex;justify-content:space-between;font-size:12px;color:var(--q-muted)}
.q-art{background:var(--q-crema);border-radius:22px;padding:16px;display:flex;flex-direction:column;gap:6px}
.q-art small{font-size:12px;color:var(--q-muted)}
.q-svgl{font-size:12px;font-weight:600;fill:var(--q-muted);font-family:"Inter",system-ui,sans-serif}
.q-svgb{font-size:15px;fill:var(--q-ink)}
.q-svgs{font-size:12px;fill:#A39D90;font-family:"Inter",system-ui,sans-serif}
.q-draw{stroke-dasharray:1;stroke-dashoffset:1;animation:q-draw 1.1s var(--q-ease) .35s forwards}
.q-draw2{animation-delay:.6s}
.q-drawslow{animation-duration:1.5s;animation-delay:.3s}
@keyframes q-draw{to{stroke-dashoffset:0}}
.q-area{opacity:0;animation:q-fade .8s ease 1.2s forwards}
.q-dot{transform-box:fill-box;transform-origin:center;transform:scale(0);animation:q-dotpop .4s cubic-bezier(.34,1.56,.64,1) 1.7s forwards}
@keyframes q-fade{to{opacity:1}}
@keyframes q-dotpop{to{transform:scale(1)}}
.q-shield{flex-direction:row;align-items:center;gap:12px;font-size:14px;font-weight:600;color:var(--q-forest)}
.q-shield svg{width:34px;height:34px;flex:none}
.q-load{align-items:center;gap:16px}
.q-ring{position:relative;width:120px;height:120px}
.q-ring b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:600;font-variant-numeric:tabular-nums}
.q-checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;width:100%;max-width:310px}
.q-checks li{display:flex;align-items:center;gap:10px;font-size:15px;color:#A9B5BD;transition:color .3s ease}
.q-checks li.on{color:var(--q-ink)}
.q-ck{width:22px;height:22px;border-radius:50%;flex:none;border:2px solid #E3DCCF;display:flex;align-items:center;justify-content:center;color:transparent;transition:all .25s cubic-bezier(.34,1.56,.64,1)}
.q-ck svg{width:12px;height:12px}
li.on .q-ck,.q-ck.on{background:var(--q-ok);border-color:var(--q-ok);color:#FFF}
.q-chart{background:var(--q-crema);border-radius:22px;padding:16px 14px 10px}
.q-miles{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.q-miles div{background:#FFF;border:1.5px solid var(--q-line);border-radius:14px;padding:10px;display:flex;flex-direction:column;gap:3px}
.q-miles b{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--q-forest)}
.q-miles strong{font-size:22px;font-weight:600;letter-spacing:-0.02em;font-variant-numeric:tabular-nums}
.q-miles span{font-size:13px;line-height:1.3;color:#34494D}
.q-bul{list-style:none;margin:2px 0 4px;padding:0;display:flex;flex-direction:column;gap:10px}
.q-bul li{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.42}
.q-bul .q-ck{margin-top:1px}
.q-plans{display:flex;flex-direction:column;gap:10px}
.q-plan{width:100%;display:flex;gap:12px;align-items:flex-start;padding:16px;border-radius:20px;border:1.5px solid var(--q-line);background:#FFF;text-align:left;cursor:pointer;color:var(--q-ink);transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .12s ease}
.q-plan.on{background:var(--q-sand);border-color:var(--q-forest);box-shadow:0 0 0 1px var(--q-forest) inset}
.q-radio{width:22px;height:22px;border-radius:50%;border:2px solid #BCC7CE;flex:none;display:flex;align-items:center;justify-content:center;margin-top:1px;transition:border-color .15s ease}
.q-radio i{width:10px;height:10px;border-radius:50%;background:var(--q-forest);transform:scale(0);transition:transform .2s cubic-bezier(.34,1.56,.64,1)}
.on .q-radio{border-color:var(--q-forest)}
.on .q-radio i{transform:scale(1)}
.q-planx{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.q-planh{display:flex;justify-content:space-between;align-items:center;gap:8px}
.q-planh b{font-size:17px;font-weight:600}
.q-planh em{font-style:normal;font-size:12px;font-weight:600;padding:4px 9px;border-radius:99px;background:var(--q-coral);color:#FFF;white-space:nowrap}
.q-planx small{font-size:13px;line-height:1.4;color:var(--q-muted)}
.q-planx .q-gift{color:var(--q-ok);font-weight:600}
.q-price{font-size:13px;color:var(--q-muted);margin-top:2px}
.q-price strong{font-size:24px;color:var(--q-ink);font-weight:600;letter-spacing:-0.02em}
.q-price s{margin-left:6px}
.q-more{align-self:flex-start;border:0;background:transparent;padding:4px 0;font-size:14px;font-weight:600;color:var(--q-forest);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.q-stack{list-style:none;margin:0;padding:12px 14px;border-radius:16px;background:var(--q-crema);display:flex;flex-direction:column;gap:7px;animation:q-rise .3s var(--q-ease) both}
.q-stack li{display:flex;justify-content:space-between;gap:10px;font-size:13px}
.q-stack li span:last-child{color:var(--q-muted)}
.q-tl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.q-tl li{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:600;color:var(--q-muted);border-top:3px solid #E6ECF0;padding-top:8px}
.q-tl li b{width:22px;height:22px;border-radius:50%;background:#E6ECF0;color:var(--q-muted);display:flex;align-items:center;justify-content:center;font-size:12px}
.q-tl li.on{color:var(--q-ink);border-color:var(--q-forest)}
.q-tl li.on b{background:var(--q-forest);color:#FFF}
.q-sum{border-radius:18px;background:var(--q-crema);padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.q-sum div{display:flex;justify-content:space-between;gap:10px;font-size:15px}
.q-sum b{font-size:17px}
.q-bs{font-size:13px!important;color:var(--q-muted)}
.q-pre{display:flex;gap:16px;align-items:center;border:1.5px solid var(--q-line);border-radius:16px;padding:10px 14px}
.q-pre div{display:flex;flex-direction:column;min-width:0}
.q-pre small{font-size:12px;color:var(--q-muted)}
.q-pre b{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.q-link{margin-left:auto;border:0;background:transparent;color:var(--q-forest);font-weight:600;font-size:14px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.q-lab{margin:4px 0 -4px;font-size:13px;font-weight:600;color:var(--q-muted)}
.q-pays{display:grid;grid-template-columns:1fr;gap:8px}
.q-pay{min-height:56px;padding:10px 12px;gap:10px;align-items:flex-start}
.q-pay .q-optx b{font-size:15px}
.q-pay .q-optx small{font-size:12px}
.q-consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.45;color:#3E4A44;cursor:pointer}
.q-consent input{width:22px;height:22px;margin:0;flex:none;accent-color:var(--q-forest)}
.q-consent a{color:var(--q-ink)}
.q-guar{display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;color:#1F3B30;background:#E1F0EA;border-radius:12px;padding:8px 10px}
.q-guar svg{color:var(--q-ok);flex:none}
.q-busy{pointer-events:none}
.q-spin{width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,255,255,.35);border-top-color:#FFF;animation:q-spin .7s linear infinite}
@keyframes q-spin{to{transform:rotate(360deg)}}
.q-done{align-items:center}
.q-burst{width:72px;height:72px;border-radius:50%;background:var(--q-ok);color:#FFF;display:flex;align-items:center;justify-content:center;animation:q-burst .55s cubic-bezier(.34,1.56,.64,1) both;box-shadow:0 0 0 0 rgba(60,211,107,.35)}
.q-burst svg{width:34px;height:34px}
@keyframes q-burst{0%{transform:scale(.3);opacity:0;box-shadow:0 0 0 0 rgba(60,211,107,.4)}60%{transform:scale(1.08);opacity:1}100%{transform:scale(1);box-shadow:0 0 0 18px rgba(60,211,107,0)}}
.q-steps{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:11px;width:100%}
.q-steps li{display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--q-muted)}
.q-steps li b{width:24px;height:24px;border-radius:50%;flex:none;border:1.5px solid #BCC7CE;display:flex;align-items:center;justify-content:center;font-size:12px}
.q-steps li b svg{width:12px;height:12px}
.q-steps li.ok{color:var(--q-ink)}
.q-steps li.ok b{background:var(--q-ink);border-color:var(--q-ink);color:#FFF}
.q-steps li.now{color:var(--q-ink);font-weight:600}
.q-steps li.now b{background:var(--q-forest);border-color:var(--q-forest);color:#FFF}
@media (prefers-reduced-motion: reduce){
  .q-app *,.q-app *:before{animation-duration:1ms!important;animation-delay:0ms!important;transition-duration:1ms!important}
  .q-draw{stroke-dashoffset:0}
}

.q-proof{background:var(--q-forest);color:#FFFFFF;border-radius:18px;padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.q-proof b{font-size:15px;line-height:1.42;font-weight:600}
.q-proof small{font-size:12px;line-height:1.4;color:#A9BEC2}
.answered .q-proof{display:none}
.q-val{font-size:12px;color:var(--q-ok);font-weight:600}
.q-ced{display:flex;gap:8px}
.q-ced select{height:58px;border-radius:16px;border:1.5px solid var(--q-line);padding:0 10px;font:inherit;font-size:17px;font-weight:600;background:#FFF;color:var(--q-ink)}
.q-ced input{flex:1;min-width:0;height:58px;border-radius:16px;border:1.5px solid var(--q-line);padding:0 16px;font-size:19px;font-weight:500;outline:none}
.q-ced input:focus{border-color:var(--q-forest);box-shadow:0 0 0 3px rgba(15,42,46,.12)}
.q-rail{background:var(--q-crema);border-radius:16px;padding:12px 14px;display:flex;flex-direction:column;gap:8px;font-size:14px;line-height:1.45}
.q-rail p{margin:0}
.q-rail small{font-size:12px;color:var(--q-muted)}
.q-rail dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:14px}
.q-rail dt{color:var(--q-muted)}
.q-rail dd{margin:0;font-weight:600}
.q-railin{animation:q-rise .3s var(--q-ease) both}
.answered .q-rail{display:none}

.q-band{animation:q-rise .4s var(--q-ease) both;animation-delay:1.05s}
.q-gauge i{transition-timing-function:cubic-bezier(.33,1,.68,1)!important}
@media (prefers-reduced-motion:reduce){.q-band{animation:none}.leaving *{transition:none!important}}
.q-doc{display:flex;gap:12px;align-items:center;background:var(--q-crema);border:1px solid var(--q-line);border-radius:16px;padding:12px 14px}
.q-doc b{display:block;font-size:14.5px;font-weight:600}
.q-doc small{display:block;font-size:12.5px;color:var(--q-muted);margin-top:2px}
.q-docav .q-av{width:40px;height:40px}
.q-copy{align-self:flex-start;border:1.5px solid var(--q-forest);background:#FFFFFF;color:var(--q-forest);border-radius:99px;padding:8px 14px;font-size:14px;font-weight:600;cursor:pointer;margin-top:4px}
.answered .q-doc,.answered .q-proof{display:none}
.q-docav .q-av-t{font-size:12.5px;letter-spacing:.02em}
@keyframes q-card{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.k-inter .q-body,.k-proj .q-body,.k-loader .q-body{animation:q-card .32s var(--q-ease) both}
.answered.k-loader{display:none}
.q-out{opacity:0;transform:translateY(16px);transition:opacity .12s ease,transform .12s ease;z-index:0;pointer-events:none}
.q-front{position:relative;z-index:1;background:#FFFFFF}
.q-static .q-in,.q-static .q-body{animation:none!important}
@media (prefers-reduced-motion:reduce){.k-inter .q-body,.k-proj .q-body,.k-loader .q-body{animation:none}}
.q-me.q-morph{animation:none;transform-origin:100% 50%}
.q-stage{overflow-x:hidden}
.k-inter .q-body .q-in,.k-proj .q-body .q-in,.k-loader .q-body .q-in{animation:none}
@keyframes q-slide{from{transform:translateY(16px)}to{transform:none}}
.q-foot.q-in{animation-name:q-slide}

/* beUI patterns: text reveal, rolling numbers, Action Swap, OTP */
.q-w{display:inline-block;animation:q-word .62s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--w,0ms)}
@keyframes q-word{from{opacity:0;filter:blur(8px);transform:translateY(.32em)}to{opacity:1;filter:none;transform:none}}
.q-odo{display:inline-flex;vertical-align:bottom;font-variant-numeric:tabular-nums}
.q-odo>span[aria-hidden]{display:inline-flex;height:1.15em;line-height:1.15em;overflow:hidden}
.q-col{display:inline-flex;flex-direction:column;transition:transform .9s cubic-bezier(.34,1.32,.5,1)}
.q-col b{display:block;height:1.15em;font:inherit}
.q-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.q-cta{position:relative;overflow:hidden}
.q-cta.q-ok{background:var(--q-ok)}
.q-lab{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 14px;transition:transform .45s cubic-bezier(.34,1.3,.5,1),opacity .25s var(--q-ease),filter .3s var(--q-ease)}
.q-lab.q-dn{transform:translateY(105%);opacity:0;filter:blur(3px)}
.q-lab.q-up{transform:translateY(-105%);opacity:0;filter:blur(3px);transition:transform .16s var(--q-ease),opacity .16s,filter .16s}
.q-okck path{stroke-dasharray:24;stroke-dashoffset:24;animation:q-okck .4s .12s var(--q-ease) forwards}
@keyframes q-okck{to{stroke-dashoffset:0}}
.q-field select{height:58px;border-radius:16px;border:1.5px solid var(--q-line);padding:0 14px;font:inherit;font-size:17px;font-weight:500;background:#FFF;color:var(--q-ink)}
.q-otpbox{display:flex;flex-direction:column;gap:8px;padding-top:10px;border-top:1px solid var(--q-line);margin-top:2px}
.q-otp{position:relative;display:flex;gap:7px}
.q-otp input{position:absolute;inset:0;width:100%;height:100%;opacity:0;border:0;font-size:16px;z-index:1}
.q-slot{position:relative;flex:1;height:54px;border:1.5px solid var(--q-line);border-radius:14px;background:#FFF;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:600;overflow:hidden;transition:border-color .15s}
.q-slot.act{border-color:var(--q-forest);box-shadow:0 0 0 3px rgba(15,42,46,.12)}
.q-slot.act:empty::after{content:"";width:2px;height:24px;background:var(--q-forest);animation:q-car 1s steps(1) infinite}
@keyframes q-car{50%{opacity:0}}
.q-dg{display:block;animation:q-dg .32s cubic-bezier(.34,1.3,.5,1) both}
@keyframes q-dg{from{opacity:0;transform:translateY(14px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
.q-otp.err{animation:q-shake .42s ease}
.q-otp.err .q-slot{border-color:var(--q-coral)}
.q-otp.ok .q-slot{border-color:var(--q-ok)}
@keyframes q-shake{0%,100%{transform:none}15%{transform:translateX(-5px)}30%{transform:translateX(5px)}45%{transform:translateX(-3px)}60%{transform:translateX(3px)}75%{transform:translateX(-1px)}}
.q-otpmsg{margin:0;min-height:0;font-size:13px;font-weight:600;color:var(--q-coral)}
.q-otpmsg:empty{display:none}
.q-otpbox .q-link{align-self:flex-start;margin-left:0}
.q-static .q-w{animation:none}
@media (prefers-reduced-motion:reduce){.q-w,.q-dg,.q-otp.err,.q-okck path{animation:none;stroke-dashoffset:0}.q-col,.q-lab{transition:none}}
.q-cta .q-lab{color:inherit!important;font-size:inherit;font-weight:inherit}
.q-terms{margin:2px 0 0;font-size:13px;line-height:1.45;color:var(--q-muted)}
.answered .q-terms{display:none}


.q-foot a.q-cta{color:#FFFFFF}
.q-cta:focus-visible,.q-opt:focus-visible,.q-plan:focus-visible,.q-ghost:focus-visible{outline:3px solid var(--q-coral);outline-offset:2px}
/* Referral / affiliate code at checkout */
.q-ref{margin:4px 0 12px;font-size:14px;color:var(--q-muted,#5B6E73);display:flex;align-items:center;gap:6px}
.q-ref .q-link{margin-left:0;font-size:14px}
.q-ref b{color:var(--q-ink);letter-spacing:.04em}
[data-ref] .q-ced input{text-transform:uppercase}
[data-ref] .q-ced .q-link{margin-left:0;padding:0 8px}
.q-ref-note{display:block;margin:-4px 0 10px;font-size:13px;color:var(--q-coral,#3F7FE0)}

/* ---------- Desktop: a real page, not a phone column ----------
   Full-width header, the conversation in a wide center column and, beside it, where you are and who reads
   your answers (from 960px, so a ~1000px browser window or the Lovable preview gets it). Tablets and narrow
   windows (700-959px) get the full-width page with one centred column. Phones keep the column above, untouched. */
.q-side{display:none}
@media (min-width:960px){
  html,body{background:#FFFFFF}
  #quiz{max-width:none;box-shadow:none}
  .q-app{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,620px) 340px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);column-gap:64px;background:linear-gradient(180deg,#FFFFFF 0,#FFFFFF 60%,var(--q-crema) 100%)}
  .q-hd{grid-column:1/-1;padding:14px max(32px,calc(50% - 512px)) 12px}
  .q-hdrow{height:48px}
  .q-logo img{height:26px!important}
  .q-sec{font-size:13.5px}
  .q-prog{margin-top:10px;gap:8px}
  .q-prog span{height:5px}
  .q-stage{grid-column:2;padding:20px 0 64px;scrollbar-width:thin}
  .q-turn{padding:22px 4px 6px;gap:14px}
  .q-typing{padding:14px 4px}
  .q-q{font-size:34px}
  .q-big{font-size:42px}
  .q-sub{font-size:16.5px}
  .q-lead p{font-size:16px}
  .q-opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .q-opt{min-height:64px}
  .q-opt:hover:not(.on){border-color:var(--q-muted);background:var(--q-crema)}
  .q-plan:hover:not(.on){border-color:var(--q-muted)}
  .q-pays{grid-template-columns:repeat(2,minmax(0,1fr))}
  .q-foot{flex-direction:row;flex-wrap:wrap;align-items:center}
  .q-foot .q-cta,.q-foot .q-ghost{flex:1 1 280px;max-width:380px}
  .q-foot .q-note{flex-basis:100%;justify-content:flex-start}
  .q-trust{flex-direction:row;flex-wrap:wrap;gap:8px 20px}
  .answered .q-q{font-size:13.5px}
  .q-me{font-size:16px}
  /* the side panel */
  .q-side{grid-column:3;display:flex;flex-direction:column;gap:16px;align-self:start;margin-top:40px;max-height:calc(100dvh - 140px);overflow:auto;scrollbar-width:none}
  .q-sidesteps{list-style:none;margin:0;padding:18px 18px 16px;border:1px solid var(--q-line);border-radius:22px;background:#FFFFFF;display:flex;flex-direction:column;gap:12px}
  .q-sidesteps li{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:500;color:var(--q-muted);transition:color .3s ease}
  .q-sidesteps li b{width:28px;height:28px;border-radius:50%;flex:none;border:1.5px solid var(--q-line);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;transition:all .3s ease}
  .q-sidesteps li.now{color:var(--q-ink);font-weight:600}
  .q-sidesteps li.now b{background:var(--q-forest);border-color:var(--q-forest);color:#FFFFFF}
  .q-sidesteps li.ok{color:var(--q-ink)}
  .q-sidesteps li.ok b{background:#E3F6EA;border-color:#E3F6EA;color:var(--q-ok)}
  .q-sidedoc{position:relative;margin:0;border-radius:22px;overflow:hidden;background:var(--q-forest);color:#FFFFFF}
  .q-sidedoc img{display:block;width:100%;height:230px;object-fit:cover;object-position:50% 16%}
  .q-sidetag{position:absolute;top:12px;left:12px;font-size:11.5px;font-weight:600;background:var(--q-forest);color:#FFFFFF;border-radius:99px;padding:4px 10px}
  .q-sidedoc figcaption{padding:14px 18px 18px;display:flex;flex-direction:column;gap:4px}
  .q-sidedoc b{font-size:16px;font-weight:600;letter-spacing:-.01em}
  .q-sidedoc figcaption span{font-size:13.5px;line-height:1.45;color:var(--q-line)}
  .q-sidelist{list-style:none;margin:0;padding:0 4px;display:flex;flex-direction:column;gap:10px}
  .q-sidelist li{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:1.45;color:var(--q-muted)}
  .q-sidelist svg{flex:none;width:16px;height:16px;margin-top:2px;color:var(--q-ok)}
}
@media (min-width:700px) and (max-width:959px){
  html,body{background:#FFFFFF}
  #quiz{max-width:none;box-shadow:none}
  .q-hd{padding:12px max(24px,calc(50% - 320px)) 10px}
  .q-stage{padding:12px max(24px,calc(50% - 320px)) 48px}
  .q-turn{padding:18px 0 4px}
  .q-typing{padding:14px 0}
  .q-q{font-size:31px}
  .q-opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .q-pays{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:960px) and (max-height:760px){.q-sidedoc img{height:150px}}
@media (min-width:960px) and (max-width:1180px){.q-app{column-gap:40px;grid-template-columns:minmax(0,1fr) minmax(0,580px) 300px minmax(0,1fr)}}
