/* the m theory – Skin Advisor */
.mtsa,.mtsa-launch{--mt-navy:#1B2A41;--mt-navy2:#24364F;--mt-muted:rgba(27,42,65,.62);--mt-line:rgba(27,42,65,.12);--mt-sage:#ECEEE4;--mt-paper:#F7F7F2;
  --mt-ok:#2F6B4F;--mt-ease:cubic-bezier(.22,1,.36,1);
  font-family:'Barlow',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;font-size:15px;line-height:1.45;color:var(--mt-navy);-webkit-font-smoothing:antialiased;text-align:left}
.mtsa *,.mtsa *::before,.mtsa *::after,.mtsa-launch *{box-sizing:border-box}
.mtsa p,.mtsa h3,.mtsa h4,.mtsa ul,.mtsa li{margin:0;padding:0;font-family:inherit;color:inherit;letter-spacing:normal;text-transform:none;line-height:inherit;font-weight:inherit;list-style:none;background:none;border:0}
.mtsa a{color:inherit;text-decoration:none;box-shadow:none}
.mtsa img{display:block;max-width:100%;height:auto;border:0;border-radius:0;box-shadow:none;margin:0}
.mtsa button,.mtsa input,.mtsa textarea,.mtsa-launch{font-family:inherit;letter-spacing:normal;text-transform:none;box-shadow:none;margin:0;line-height:1.2;text-shadow:none}
.mtsa button{background:none;border:0;padding:0;color:inherit;cursor:pointer;border-radius:0;min-height:0;width:auto;font-size:inherit;font-weight:inherit}
.mtsa button:hover,.mtsa button:focus{background:none;color:inherit}
.mtsa [hidden]{display:none!important}
.mtsa :focus-visible,.mtsa-launch:focus-visible{outline:2px solid var(--mt-navy);outline-offset:2px}

/* ---------- Launcher ---------- */
.mtsa-launch{position:fixed;right:20px;bottom:20px;z-index:99990;display:inline-flex!important;align-items:center;gap:10px;height:54px;padding:0 22px 0 8px!important;
  border:0!important;border-radius:999px!important;background:var(--mt-navy)!important;color:#fff!important;font-size:15px!important;font-weight:500!important;cursor:pointer;
  box-shadow:0 14px 34px -10px rgba(27,42,65,.6)!important;transform:translateY(120px);opacity:0;
  transition:transform .6s var(--mt-ease),opacity .4s,background .3s,bottom .4s var(--mt-ease)}
.mtsa-launch.is-in{transform:none;opacity:1}
.mtsa-launch:hover{background:var(--mt-navy2)!important;transform:translateY(-2px)}
.mtsa-launch.is-hidden{transform:translateY(120px);opacity:0;pointer-events:none}
.mtsa-launch__icon{position:relative;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;flex:none}
.mtsa-launch__icon svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mtsa-launch__icon::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 0 rgba(255,255,255,.45);animation:mtsa-ring 2.4s 1.2s 3}
@keyframes mtsa-ring{70%{box-shadow:0 0 0 14px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
.mtsa-launch__dot{position:absolute;top:2px;right:2px;width:10px;height:10px;border-radius:50%;background:#7FC8A0;box-shadow:0 0 0 2px var(--mt-navy)}
/* sit above the page's own floating cart / mobile buy bar */
body:has(#fcart.is-on) .mtsa-launch{bottom:88px}
@media (max-width:760px){
  .mtsa-launch{right:14px;bottom:14px;height:50px;font-size:14px!important}
  body:has(#mbar.is-visible) .mtsa-launch{bottom:86px}
  body:has(#mbar.is-visible):has(#fcart.is-on) .mtsa-launch{bottom:150px}
}

/* ---------- Panel ---------- */
.mtsa{position:fixed;right:20px;bottom:20px;z-index:99995;width:400px;height:min(660px,calc(100vh - 40px));background:var(--mt-paper);
  display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 80px -20px rgba(27,42,65,.45),0 0 0 1px var(--mt-line);
  transform-origin:bottom right;transform:translateY(16px) scale(.96);opacity:0;visibility:hidden;
  transition:transform .5s var(--mt-ease),opacity .35s,visibility 0s .5s}
.mtsa.is-open{transform:none;opacity:1;visibility:visible;transition:transform .5s var(--mt-ease),opacity .35s,visibility 0s}
.mtsa--inline{position:relative;right:auto;bottom:auto;z-index:1;width:100%;max-width:760px;height:680px;margin:0 auto;transform:none;opacity:1;visibility:visible;box-shadow:0 0 0 1px var(--mt-line)}
@media (max-width:520px){
  .mtsa:not(.mtsa--inline){right:0;bottom:0;width:100%;height:100%;height:100dvh;transform:translateY(40px);transform-origin:bottom}
  .mtsa.is-open:not(.mtsa--inline){transform:none}
  .mtsa--inline{height:620px}
}

.mtsa .mtsa__head{position:relative;display:flex;align-items:center;gap:12px;padding:14px 12px 14px 16px;background:var(--mt-navy);color:#fff;flex:none}
.mtsa .mtsa__avatar{position:relative;width:40px;height:40px;border-radius:50%;background:#fff;color:var(--mt-navy);display:grid;place-items:center;font-weight:600;font-size:15px;flex:none;letter-spacing:-.02em}
.mtsa .mtsa__avatar::after{content:"";position:absolute;right:0;bottom:1px;width:10px;height:10px;border-radius:50%;background:#7FC8A0;box-shadow:0 0 0 2px var(--mt-navy)}
.mtsa .mtsa__who{flex:1;min-width:0}
.mtsa .mtsa__name{font-size:15px;font-weight:500;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mtsa .mtsa__status{font-size:12px;color:rgba(255,255,255,.65)}
.mtsa .mtsa__hbtn{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff!important;transition:background .2s}
.mtsa .mtsa__hbtn:hover{background:rgba(255,255,255,.12)!important}
.mtsa .mtsa__hbtn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mtsa .mtsa__progress{height:3px;background:rgba(255,255,255,.14);position:absolute;left:0;right:0;bottom:0}
.mtsa .mtsa__progress i{display:block;height:100%;width:0;background:#fff;transition:width .6s var(--mt-ease)}

.mtsa .mtsa__log{flex:1;overflow-y:auto;padding:18px 14px 8px;scroll-behavior:smooth;overscroll-behavior:contain}
.mtsa .mtsa__log::-webkit-scrollbar{width:6px}.mtsa .mtsa__log::-webkit-scrollbar-thumb{background:rgba(27,42,65,.15)}
.mtsa .mtsa__row{display:flex;margin-bottom:10px;animation:mtsa-in .45s var(--mt-ease) both}
@keyframes mtsa-in{from{opacity:0;transform:translateY(10px)}}
.mtsa .mtsa__row--user{justify-content:flex-end}
.mtsa .mtsa__bubble{max-width:86%;padding:11px 14px;font-size:15px;line-height:1.45;white-space:pre-line;word-wrap:break-word}
.mtsa .mtsa__row--bot .mtsa__bubble{background:#fff;border:1px solid var(--mt-line)}
.mtsa .mtsa__row--user .mtsa__bubble{background:var(--mt-navy);color:#fff}
.mtsa .mtsa__bubble b{font-weight:600}
.mtsa .mtsa__typing{display:inline-flex;gap:4px;padding:14px 16px;background:#fff;border:1px solid var(--mt-line)}
.mtsa .mtsa__typing i{width:7px;height:7px;border-radius:50%;background:rgba(27,42,65,.4);animation:mtsa-dot 1.1s infinite}
.mtsa .mtsa__typing i:nth-child(2){animation-delay:.15s}.mtsa .mtsa__typing i:nth-child(3){animation-delay:.3s}
@keyframes mtsa-dot{30%{transform:translateY(-4px);background:var(--mt-navy)}}
.mtsa .mtsa__note{font-size:12px;color:var(--mt-muted);text-align:center;margin:4px 0 12px}

/* quick replies */
.mtsa .mtsa__chips{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 14px;animation:mtsa-in .45s .1s var(--mt-ease) both}
.mtsa .mtsa__chip{display:inline-flex;align-items:center;gap:6px;padding:9px 14px!important;border:1px solid var(--mt-navy)!important;background:#fff!important;color:var(--mt-navy)!important;
  font-size:14px!important;font-weight:500!important;transition:background .2s,color .2s,transform .2s var(--mt-ease)}
.mtsa .mtsa__chip:hover{background:var(--mt-navy)!important;color:#fff!important;transform:translateY(-1px)}
.mtsa .mtsa__chip.is-on{background:var(--mt-navy)!important;color:#fff!important}
.mtsa .mtsa__chip.is-on::before{content:"✓";font-size:12px}
.mtsa .mtsa__chip small{font-weight:400;opacity:.7;font-size:12px}
.mtsa .mtsa__chip--ghost{border-color:var(--mt-line)!important;color:var(--mt-muted)!important}
.mtsa .mtsa__chip--go{background:var(--mt-navy)!important;color:#fff!important}
.mtsa .mtsa__chip--go:disabled{opacity:.4;cursor:default;transform:none}
.mtsa .mtsa__chips--used{display:none}

/* result cards */
.mtsa .mtsa__card{background:#fff;border:1px solid var(--mt-line);margin:0 0 12px;animation:mtsa-in .5s var(--mt-ease) both}
.mtsa .mtsa__card-h{padding:12px 14px;border-bottom:1px solid var(--mt-line);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--mt-muted)}
.mtsa .mtsa__profile{display:flex;flex-wrap:wrap;gap:6px;padding:12px 14px}
.mtsa .mtsa__tag{font-size:12px;padding:4px 9px;background:var(--mt-sage)}
.mtsa .mtsa__routine{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--mt-line)}
.mtsa .mtsa__routine>div{padding:12px 14px}
.mtsa .mtsa__routine>div+div{border-left:1px solid var(--mt-line)}
.mtsa .mtsa__routine h4{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--mt-muted);margin-bottom:6px}
.mtsa .mtsa__routine li{font-size:14px;padding:2px 0}
.mtsa .mtsa__routine li span{color:var(--mt-muted);font-size:12px;margin-right:6px}
.mtsa .mtsa__tips{padding:12px 14px;border-top:1px solid var(--mt-line)}
.mtsa .mtsa__tips li{position:relative;padding:3px 0 3px 18px;font-size:14px}
.mtsa .mtsa__tips li::before{content:"";position:absolute;left:2px;top:11px;width:6px;height:6px;background:var(--mt-navy)}

.mtsa .mtsa__prod{display:flex;gap:12px;align-items:center;padding:12px 14px;border-top:1px solid var(--mt-line);transition:background .25s}
.mtsa .mtsa__prod:first-of-type{border-top:0}
.mtsa .mtsa__prod:hover{background:rgba(27,42,65,.025)}
.mtsa .mtsa__pimg{width:64px;height:64px;flex:none;background:var(--mt-sage);overflow:hidden}
.mtsa .mtsa__pimg img{width:100%;height:100%;object-fit:contain;transition:transform .5s var(--mt-ease)}
.mtsa .mtsa__prod:hover .mtsa__pimg img{transform:scale(1.08)}
.mtsa .mtsa__pcopy{flex:1;min-width:0}
.mtsa .mtsa__pstep{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mt-muted)}
.mtsa .mtsa__pname{display:block;font-size:16px;font-weight:500}
.mtsa .mtsa__pname:hover{text-decoration:underline;text-underline-offset:3px}
.mtsa .mtsa__pwhy{font-size:13px;color:var(--mt-muted);margin-top:2px}
.mtsa .mtsa__pprice{margin-top:4px;font-size:15px;font-weight:500}
.mtsa .mtsa__pprice s{font-weight:400;color:rgba(27,42,65,.45);font-size:13px;margin-left:6px}
.mtsa .mtsa__badge{display:inline-block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:3px 6px;background:var(--mt-navy);color:#fff;margin-left:6px;vertical-align:2px}

.mtsa .mtsa__btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:0 14px!important;border:1px solid var(--mt-navy)!important;
  background:var(--mt-navy)!important;color:#fff!important;font-size:13px!important;font-weight:500!important;letter-spacing:.03em!important;white-space:nowrap;flex:none;
  transition:background .25s,transform .25s var(--mt-ease)}
.mtsa .mtsa__btn:hover{background:var(--mt-navy2)!important;transform:translateY(-1px)}
.mtsa .mtsa__btn--outline{background:#fff!important;color:var(--mt-navy)!important}
.mtsa .mtsa__btn--outline:hover{background:var(--mt-navy)!important;color:#fff!important}
.mtsa .mtsa__btn--block{display:flex;width:100%;min-height:48px;font-size:14px!important}
.mtsa .mtsa__btn.is-loading{color:transparent!important;pointer-events:none}
.mtsa .mtsa__btn.is-loading::after{content:"";position:absolute;left:50%;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:mtsa-spin .7s linear infinite}
.mtsa .mtsa__btn--outline.is-loading::after{border-color:rgba(27,42,65,.2);border-top-color:var(--mt-navy)}
.mtsa .mtsa__btn.is-done{background:var(--mt-ok)!important;border-color:var(--mt-ok)!important;color:#fff!important}
@keyframes mtsa-spin{to{transform:rotate(360deg)}}
.mtsa .mtsa__cta{padding:12px 14px 14px;border-top:1px solid var(--mt-line);display:flex;flex-direction:column;gap:8px}
.mtsa .mtsa__cta small{display:block;text-align:center;font-size:12px;color:var(--mt-muted)}
.mtsa .mtsa__links{display:flex;gap:8px;margin:-2px 0 14px}
.mtsa .mtsa__links a{flex:1}

/* composer */
.mtsa .mtsa__foot{flex:none;border-top:1px solid var(--mt-line);background:#fff;padding:10px 10px 10px 14px}
.mtsa .mtsa__form{display:flex;gap:8px;align-items:flex-end}
.mtsa .mtsa__input{flex:1;min-height:42px;max-height:110px;resize:none;border:0!important;outline:none!important;background:transparent!important;padding:11px 0!important;
  font-size:15px!important;color:var(--mt-navy)!important;box-shadow:none!important;border-radius:0!important}
.mtsa .mtsa__input::placeholder{color:rgba(27,42,65,.45)}
.mtsa .mtsa__send{width:42px;height:42px;padding:0!important;border:0!important;flex:none;display:grid;place-items:center;background:var(--mt-navy)!important;color:#fff!important;border-radius:50%!important;transition:transform .25s var(--mt-ease),opacity .2s}
.mtsa .mtsa__send:hover{transform:scale(1.06)}
.mtsa .mtsa__send:disabled{opacity:.35;transform:none}
.mtsa .mtsa__send svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mtsa .mtsa__fine{font-size:11px;color:rgba(27,42,65,.45);padding:4px 0 0;text-align:center}

@media (prefers-reduced-motion:reduce){.mtsa *,.mtsa,.mtsa-launch,.mtsa-launch *{animation:none!important;transition:none!important}}
