/* ============================================================
   Ali — AI travel guru widget · alisworldtours.com · v3
   Served from /assets/ali/ali.css · no dependencies
   Namespaced .ali- · FaceTime-style 9:16 glass panel + PiP rig
   ============================================================ */

/* ---------- closed pill (unchanged) ---------- */
.ali-pill{
  position:fixed;
  right:calc(18px + env(safe-area-inset-right,0px));
  bottom:calc(84px + env(safe-area-inset-bottom,0px)); /* clears WhatsApp fab */
  z-index:118; /* under cookie bar (120), over wa-fab (90) */
  display:flex;align-items:center;gap:12px;
  padding:8px 18px 8px 8px;border:1px solid rgba(255,255,255,.22);
  border-radius:999px;cursor:pointer;
  background:rgba(36,19,51,.86);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:0 14px 38px rgba(36,19,51,.35);
  font-family:"Inter",-apple-system,Segoe UI,Arial,sans-serif;
  color:#fff;text-align:left;
  transition:transform .18s ease,box-shadow .18s ease;
}
.ali-pill:hover{transform:translateY(-2px);box-shadow:0 18px 44px rgba(36,19,51,.42)}
.ali-pill:focus-visible{outline:3px solid rgba(245,119,43,.55);outline-offset:2px}
.ali-pill__avatar{
  width:64px;height:64px;border-radius:50%;overflow:hidden;flex:0 0 auto;
  background:#33194A; /* solid plum: transparent head PNG never shows through */
  border:2px solid rgba(198,161,91,.55);position:relative;
}
.ali-pill__avatar canvas{width:100%;height:100%;display:block}
.ali-pill__avatar img{
  position:absolute;left:-15%;top:-5%;width:130%;height:130%;
  object-fit:cover;display:block; /* tight crop: face fills the circle */
}
.ali-pill__label{display:flex;flex-direction:column;line-height:1.25}
.ali-pill__label b{font-family:"Poppins",Inter,sans-serif;font-weight:600;font-size:.95rem;letter-spacing:.01em}
.ali-pill__label span{font-size:.76rem;color:rgba(255,255,255,.72)}
.ali-hidden{display:none !important}

/* ---------- open panel: 9:16 iOS glass (desktop) ---------- */
.ali-panel{
  position:fixed;z-index:130; /* above cookie bar (120) */
  right:calc(24px + env(safe-area-inset-right,0px));
  bottom:calc(24px + env(safe-area-inset-bottom,0px));
  width:384px;max-width:calc(100vw - 32px);
  height:560px;height:min(78vh,700px);
  max-height:calc(100vh - 32px);
  display:flex;flex-direction:column;
  background:rgba(250,248,253,.86);
  -webkit-backdrop-filter:blur(28px) saturate(1.4);
  backdrop-filter:blur(28px) saturate(1.4);
  border:1px solid rgba(255,255,255,.6);
  border-radius:28px;
  box-shadow:0 32px 80px -20px rgba(20,8,30,.45);
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text',Inter,sans-serif;
  color:#241333;overflow:hidden;
  transform-origin:100% 100%;
  animation:ali-pop .22s cubic-bezier(.21,.9,.27,1);
}
.ali-panel.ali-closing{animation:ali-shut .22s ease forwards;pointer-events:none}
@keyframes ali-pop{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
@keyframes ali-shut{to{opacity:0;transform:scale(.96)}}
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  .ali-pill{background:#241333}
  .ali-panel{background:rgba(252,250,255,.98)}
}

/* ---------- slim transparent top bar ---------- */
.ali-head{display:flex;align-items:center;gap:10px;height:56px;
  padding:0 14px 0 16px;flex:0 0 auto;background:transparent}
.ali-head__avatar{width:34px;height:34px;border-radius:50%;overflow:hidden;flex:0 0 auto;
  background:#33194A;position:relative;box-shadow:0 1px 4px rgba(20,8,30,.18)}
.ali-head__avatar img{
  position:absolute;left:-15%;top:-5%;width:130%;height:130%;
  object-fit:cover;display:block;
}
.ali-head__title{flex:1 1 auto;min-width:0;line-height:1.15}
.ali-head__title b{display:block;font-weight:600;font-size:17px;letter-spacing:-.01em;
  color:#241333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ali-head__sub{display:flex;align-items:center;gap:5px;font-size:12px;
  color:rgba(36,19,51,.55);white-space:nowrap;overflow:hidden}
.ali-dot{width:7px;height:7px;border-radius:50%;background:#34C759;flex:0 0 auto;display:inline-block}

/* iOS-style circular glass control buttons (voice / close) */
.ali-iconbtn{appearance:none;-webkit-appearance:none;
  border:1px solid rgba(255,255,255,.7);
  background:rgba(255,255,255,.65);color:#5B2E91;
  width:34px;height:34px;min-height:34px;border-radius:50%;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;padding:0;flex:0 0 auto;
  box-shadow:0 1px 3px rgba(20,8,30,.1);
  transition:background .15s,transform .12s}
.ali-iconbtn:hover{background:rgba(255,255,255,.95)}
.ali-iconbtn:active{transform:scale(.94)}
.ali-iconbtn:focus-visible{outline:3px solid rgba(245,119,43,.55);outline-offset:1px}
.ali-iconbtn[aria-pressed="true"]{background:#5B2E91;border-color:#5B2E91;color:#fff}
.ali-iconbtn svg{width:17px;height:17px;display:block}

/* ---------- Ali PiP: FaceTime self-view card, floats over the log ---------- */
.ali-pip{position:absolute;top:68px;right:12px;width:112px;height:148px;z-index:5;
  border-radius:18px;overflow:hidden;
  background:linear-gradient(160deg,#6A3AA5 0%,#41216B 55%,#2A1440 100%);
  box-shadow:0 14px 30px -8px rgba(20,8,30,.45)}
.ali-pip:after{content:"";position:absolute;left:0;top:0;right:0;bottom:0;
  border:2px solid rgba(255,255,255,.85);border-radius:18px;pointer-events:none;z-index:2}
.ali-pip canvas{position:absolute;left:0;top:0;width:100%;height:100%;display:block}
.ali-pipfall{position:absolute;left:0;top:0;width:100%;height:100%;display:block}
.ali-pipfall img{position:absolute;left:0;top:0;width:100%;height:100%;
  object-fit:cover;object-position:50% 28%;display:block}

/* ---------- messages: the whole remaining height ---------- */
.ali-log{flex:1 1 auto;overflow-y:auto;padding:12px 16px 6px;min-height:120px;
  background:transparent;
  scrollbar-width:thin;scrollbar-color:rgba(36,19,51,.18) transparent;
  -webkit-overflow-scrolling:touch}
.ali-log::-webkit-scrollbar{width:5px}
.ali-log::-webkit-scrollbar-track{background:transparent}
.ali-log::-webkit-scrollbar-thumb{background:rgba(36,19,51,.16);border-radius:8px}

/* iMessage bubbles */
.ali-msg{max-width:72%;margin:0 0 14px;padding:10px 14px;border-radius:20px;
  font-size:15.5px;line-height:1.45;word-wrap:break-word}
.ali-msg--ali{background:#FFFFFF;color:#241333;border:1px solid rgba(36,19,51,.06);
  border-bottom-left-radius:4px;margin-right:auto;box-shadow:0 1px 2px rgba(20,8,30,.04)}
.ali-msg--user{background:linear-gradient(135deg,#6A3AA5,#5B2E91);color:#fff;border:0;
  border-bottom-right-radius:4px;margin-left:auto}
.ali-msg--link{display:block;color:#5B2E91;font-weight:600;text-decoration:none}
.ali-msg--link:hover{background:#f6f0fd}

/* inline replay ghost button on Ali's latest message */
.ali-replay{appearance:none;border:0;background:transparent;color:#b7a6cf;cursor:pointer;
  font:inherit;font-size:14px;line-height:1;padding:0 3px;margin-left:6px;
  border-radius:6px;vertical-align:baseline}
.ali-replay:hover{color:#5B2E91;background:#f4eefc}
.ali-replay:focus-visible{outline:2px solid rgba(245,119,43,.55);outline-offset:1px}

/* ---------- result cards rail ---------- */
.ali-rail{flex:0 0 auto;display:flex;gap:10px;overflow-x:auto;padding:8px 16px;
  -webkit-overflow-scrolling:touch;scrollbar-width:none}
.ali-rail::-webkit-scrollbar{display:none}
.ali-card{flex:0 0 168px;background:rgba(255,255,255,.92);border:1px solid rgba(36,19,51,.06);
  border-radius:16px;overflow:hidden;text-decoration:none;color:#241333;
  box-shadow:0 6px 16px rgba(20,8,30,.1);
  transition:transform .15s ease,box-shadow .15s ease;display:block}
.ali-card:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(20,8,30,.16)}
.ali-card__ph{height:64px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(120deg,#5B2E91 0%,#241333 90%);
  color:rgba(255,255,255,.9);font-weight:600;font-size:24px}
.ali-card__body{padding:9px 11px 11px}
.ali-card__tier{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#8A6D3B}
.ali-card__name{font-weight:600;font-size:14px;margin:2px 0 5px}
.ali-card__tag{display:inline-block;font-size:10.5px;font-weight:600;color:#5B2E91;
  background:#f4eefc;border-radius:999px;padding:3px 8px}

/* ---------- iOS suggestion chips: one scroll row above the input ---------- */
.ali-chiprow{flex:0 0 auto;display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;
  padding:8px 12px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.ali-chiprow::-webkit-scrollbar{display:none}
.ali-chip{appearance:none;-webkit-appearance:none;flex:0 0 auto;white-space:nowrap;
  border:1px solid rgba(36,19,51,.08);background:rgba(255,255,255,.8);color:#5B2E91;
  font:inherit;font-size:14px;font-weight:600;border-radius:999px;
  padding:0 15px;height:34px;min-height:34px;display:inline-flex;align-items:center;cursor:pointer;
  box-shadow:0 1px 2px rgba(20,8,30,.05);
  transition:background .15s,transform .12s}
.ali-chip:hover{background:#fff}
.ali-chip:active{transform:scale(.97)}
.ali-chip:focus-visible{outline:3px solid rgba(245,119,43,.55);outline-offset:1px}

/* ---------- roomy iMessage input bar ---------- */
.ali-inputrow{flex:0 0 auto;display:flex;gap:10px;align-items:center;
  padding:10px 12px;min-height:64px}
.ali-field{position:relative;flex:1 1 auto;min-width:0;display:block}
.ali-input{width:100%;box-sizing:border-box;font:inherit;font-size:16px;color:#241333;
  border:1px solid rgba(36,19,51,.1);border-radius:22px;height:44px;
  padding:0 46px 0 16px;background:rgba(255,255,255,.9)}
.ali-input::placeholder{color:rgba(36,19,51,.4)}
.ali-input:focus{outline:none;border-color:rgba(91,46,145,.55);
  box-shadow:0 0 0 3px rgba(91,46,145,.15)}
/* mic: round glass button inside the right end of the field */
.ali-mic{position:absolute;right:3px;top:3px;width:38px;height:38px;min-height:38px;
  border-radius:50%;box-shadow:none;background:rgba(255,255,255,.65)}
.ali-mic[aria-pressed="true"]{background:#EF6A5A;border-color:#EF6A5A;color:#fff;
  animation:ali-miclive 1.6s ease infinite}
@keyframes ali-miclive{0%,100%{box-shadow:0 0 0 0 rgba(239,106,90,.45)}55%{box-shadow:0 0 0 9px rgba(239,106,90,0)}}
/* send: solid plum circle with white up arrow */
.ali-send{appearance:none;-webkit-appearance:none;border:0;border-radius:50%;
  background:#5B2E91;color:#fff;
  width:44px;min-width:44px;height:44px;min-height:44px;padding:0;cursor:pointer;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 6px 14px -4px rgba(91,46,145,.5);
  transition:background .15s,transform .12s,opacity .15s}
.ali-send svg{width:20px;height:20px;display:block}
.ali-send:hover{background:#4a2478}
.ali-send:active{transform:scale(.94)}
.ali-send:focus-visible{outline:3px solid rgba(245,119,43,.55);outline-offset:1px}
.ali-send[disabled]{opacity:.35;cursor:default;box-shadow:none}

/* ---------- footer micro-row: nearly invisible until hover ---------- */
.ali-foot{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:0 14px 8px;font-size:12.5px;color:#8a7f95;opacity:.55;transition:opacity .2s}
.ali-foot:hover,.ali-foot:focus-within{opacity:1}
.ali-foot button,.ali-foot a{appearance:none;-webkit-appearance:none;border:0;background:transparent;
  color:#7c6a91;font:inherit;font-size:12.5px;font-weight:500;cursor:pointer;text-decoration:none;
  padding:8px 6px;border-radius:8px}
.ali-foot button:hover,.ali-foot a:hover{color:#5B2E91;background:rgba(91,46,145,.07)}
.ali-foot button:focus-visible,.ali-foot a:focus-visible{outline:3px solid rgba(245,119,43,.55);outline-offset:1px}

/* ---------- highlight pulse applied to site search fields ---------- */
.ali-flash{animation:ali-flash 1.2s ease 1;border-radius:11px}
@keyframes ali-flash{
  0%{box-shadow:0 0 0 0 rgba(245,119,43,0);outline:3px solid rgba(245,119,43,0)}
  25%{box-shadow:0 0 0 6px rgba(245,119,43,.28);outline:3px solid rgba(245,119,43,.65)}
  100%{box-shadow:0 0 0 0 rgba(245,119,43,0);outline:3px solid rgba(245,119,43,0)}
}

/* ---------- mobile bottom sheet ---------- */
@media (max-width:959px){
  .ali-panel{
    left:0;right:0;bottom:0;width:100%;max-width:100%;
    height:88vh;max-height:88vh;border-radius:24px 24px 0 0;
    padding-bottom:env(safe-area-inset-bottom,0px);
  }
  .ali-pip{top:76px;width:96px;height:128px}
  .ali-drag{width:36px;height:4px;border-radius:2px;background:rgba(36,19,51,.22);
    margin:8px auto -4px;flex:0 0 auto}
  .ali-pill__label span{display:none}
  .ali-pill{padding:6px 14px 6px 6px;bottom:calc(78px + env(safe-area-inset-bottom,0px))}
}
@media (min-width:960px){.ali-drag{display:none}}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .ali-panel,.ali-panel.ali-closing{animation:none}
  .ali-pill,.ali-card,.ali-send,.ali-iconbtn,.ali-chip{transition:none}
  .ali-pill:hover,.ali-card:hover{transform:none}
  .ali-chip:active,.ali-send:active,.ali-iconbtn:active{transform:none}
  .ali-flash{animation:none;outline:3px solid rgba(245,119,43,.6)}
  .ali-mic[aria-pressed="true"]{animation:none}
}

/* visually hidden (a11y) */
.ali-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* JS-injected avatar initial (pill/header only; the PiP never shows a letter) —
   removed by JS the moment the head image loads or the rig takes over */
.ali-init{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;
  align-items:center;justify-content:center;color:#fff;font-weight:600}

/* ===== dark plum glass skin — owner reference (FaceTime glass, dark) ===== */
.ali-panel{background:rgba(30,15,46,.82);border:1px solid rgba(255,255,255,.16);
  box-shadow:0 32px 80px -18px rgba(8,3,14,.7)}
.ali-head__title b{color:#fff}
.ali-head__sub{color:rgba(230,220,245,.72)}
.ali-iconbtn{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.22);color:#f2ecfa}
.ali-iconbtn:hover{background:rgba(255,255,255,.22)}
.ali-log{scrollbar-color:rgba(255,255,255,.25) transparent}
.ali-msg--ali{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);color:#f4effb}
.ali-msg--ali .ali-replay{color:rgba(235,225,250,.8)}
.ali-msg--user{background:linear-gradient(135deg,#7a45bd,#5B2E91);color:#fff}
.ali-msg--link{color:#e8ddf8}
.ali-chip{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#f2eafc}
.ali-chip:hover{background:rgba(255,255,255,.2)}
.ali-input{background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.2);color:#fff}
.ali-input::placeholder{color:rgba(235,226,248,.55)}
.ali-mic{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.2);color:#efe7fa}
.ali-foot button{color:rgba(228,217,244,.75)}
.ali-pip{box-shadow:0 14px 34px -10px rgba(5,2,10,.75)}
.ali-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14)}
.ali-card__name{color:#fff}.ali-card__tier{color:#F5A623}.ali-card__tag{color:rgba(230,220,245,.7)}

/* --- AWT: Ali as a figure, not a chat pill --- */
/* the purple pill read as a fake AI chat box - gone */
.ali-pill{display:none!important}
.ali-fig{position:fixed;right:clamp(10px,1.6vw,28px);bottom:24px;z-index:70;
  width:clamp(132px,11vw,186px);line-height:0;
  transition:opacity .3s ease,transform .3s ease;
  filter:drop-shadow(0 18px 30px rgba(20,8,34,.34)) drop-shadow(0 3px 6px rgba(20,8,34,.2))}
.ali-fig--gone{opacity:0;transform:translateY(16px) scale(.9);pointer-events:none}
.ali-fig.is-dragging{transition:none;cursor:grabbing}
.ali-fig__hit{display:block;width:100%;padding:0;margin:0;border:0;background:none;
  cursor:grab;line-height:0;-webkit-tap-highlight-color:transparent;
  transition:transform .22s cubic-bezier(.2,.7,.2,1)}
.ali-fig__hit:hover{transform:translateY(-4px) scale(1.03)}
.ali-fig__hit:active{cursor:grabbing}
.ali-fig__hit:focus-visible{outline:3px solid var(--gold);outline-offset:6px;border-radius:12px}
.ali-fig__cvs{width:100%;height:auto;display:block;background:none;pointer-events:none}
.ali-fig__x{position:absolute;top:2px;right:2px;width:24px;height:24px;border:0;
  border-radius:50%;background:rgba(36,19,51,.78);color:#fff;font-size:15px;line-height:1;
  cursor:pointer;opacity:0;transition:opacity .2s ease;backdrop-filter:blur(6px)}
.ali-fig:hover .ali-fig__x,.ali-fig__x:focus-visible{opacity:1}
.ali-fig__x:hover{background:var(--plum)}
/* he steps aside while the chat is open */
.ali-open .ali-fig{opacity:0;transform:translateY(10px) scale(.94);pointer-events:none}
@media (max-width:760px){.ali-fig{width:112px;right:6px;bottom:16px}}
@media (prefers-reduced-motion:reduce){.ali-fig,.ali-fig__hit{transition:none}}
/* --- AWT: plate fade --- */
/* the plate is cut square at the base (93.6% opaque on the last row), so it
   sat on the page like a genie. Fade him into the page instead. */
.ali-fig__cvs{-webkit-mask-image:linear-gradient(to bottom,#000 74%,rgba(0,0,0,.55) 88%,transparent 99%);
  mask-image:linear-gradient(to bottom,#000 74%,rgba(0,0,0,.55) 88%,transparent 99%)}
.ali-fig{filter:drop-shadow(0 14px 26px rgba(20,8,34,.28))}
.ali-fig{bottom:0!important}
/* --- AWT: figure art --- */
.ali-fig__cvs{display:none!important}
.ali-fig__art{width:100%;height:auto;display:block;pointer-events:none;
  /* faded base - the plate is cut square (93.6% opaque on the last row) */
  -webkit-mask-image:linear-gradient(to bottom,#000 72%,rgba(0,0,0,.5) 88%,transparent 99%);
  mask-image:linear-gradient(to bottom,#000 72%,rgba(0,0,0,.5) 88%,transparent 99%);
  animation:aliFloat 5.4s ease-in-out infinite}
@keyframes aliFloat{0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-7px) rotate(.5deg)}}
.ali-fig__hit:hover .ali-fig__art{animation:aliPerk .5s ease-out forwards}
@keyframes aliPerk{to{transform:translateY(-10px) scale(1.04) rotate(0deg)}}
@media (prefers-reduced-motion:reduce){.ali-fig__art{animation:none}}
/* --- AWT: bot rig --- */
.ali-fig__art{display:none!important}
.bot{position:relative;display:block;width:100%;aspect-ratio:1/1;line-height:0}
/* every layer is the same pre-aligned square, so they simply stack */
.bot__l{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;
  -webkit-user-drag:none;user-select:none}
.bot__body{z-index:1}
.bot__arm{z-index:2;transform-origin:63% 56%;transition:transform .18s ease}
.bot__head{z-index:3;transform-origin:50% 78%;animation:botBob 4.6s ease-in-out infinite}
.bot__face{z-index:4;transform-origin:50% 78%;animation:botBob 4.6s ease-in-out infinite}
/* the head bobs; body stays planted - reads alive without the whole sticker jiggling */
@keyframes botBob{0%,100%{transform:translateY(0) rotate(-1.1deg)}50%{transform:translateY(-6px) rotate(1.1deg)}}
@keyframes botWave{0%,100%{transform:rotate(0deg)}25%{transform:rotate(-17deg)}55%{transform:rotate(9deg)}80%{transform:rotate(-11deg)}}
.bot.is-waving .bot__arm{animation:botWave 1.4s ease-in-out}
/* whole figure: gentle float + a real drop shadow (never baked into the art) */
.ali-fig{filter:drop-shadow(0 16px 22px rgba(20,8,34,.30))}
.ali-fig__hit{animation:botFloat 6s ease-in-out infinite}
@keyframes botFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.ali-fig__hit:hover{animation:none;transform:translateY(-8px) scale(1.05)}
@media (prefers-reduced-motion:reduce){
  .bot__head,.bot__face,.ali-fig__hit,.bot.is-waving .bot__arm{animation:none!important}
}
/* --- bot box fix --- */
/* the legacy headImgFallback <img> was still inside the button, adding ~215px
   of dead height under him. The figure is a square; nothing else belongs. */
.ali-fig__hit>img,.ali-fig>img{display:none!important}
.ali-fig{width:clamp(150px,12vw,200px);height:auto;aspect-ratio:1/1;bottom:14px!important}
.ali-fig__hit{display:block;width:100%;aspect-ratio:1/1}
.bot{width:100%;height:100%}
/* --- bot rig v2 --- */
/* kill every legacy layer: the old human-Ali fallback + the PNG faces */
.ali-fig__hit>img,.ali-fig>img,.ali-fig__art,.ali-pill{display:none!important}
.ali-fig{width:clamp(150px,12vw,200px);height:auto;aspect-ratio:1/1;bottom:14px!important;
  right:clamp(10px,1.6vw,28px);z-index:70;line-height:0;
  filter:drop-shadow(0 16px 22px rgba(20,8,34,.32))}
.ali-fig__hit{display:block;width:100%;aspect-ratio:1/1;padding:0;border:0;background:none;
  cursor:grab;line-height:0;animation:none!important}
/* PERSPECTIVE = the ball socket. Without it rotateY/rotateX just squash. */
.bot{position:relative;display:block;width:100%;height:100%;
  perspective:620px;perspective-origin:50% 42%;transform-style:preserve-3d}
.bot__l{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;
  -webkit-user-drag:none;user-select:none;backface-visibility:hidden}
.bot__body{z-index:1}
/* arm pivots at the SHOULDER, not the image centre - that is why it looked bolted on */
.bot__arm{z-index:2;transform-origin:64% 57%;will-change:transform}
/* head + face pivot at the NECK: rotation there reads as a ball joint */
.bot__head{z-index:3;transform-origin:50% 80%;will-change:transform}
.bot__face{z-index:4;transform-origin:50% 80%;will-change:transform}
@media (prefers-reduced-motion:reduce){.bot__head,.bot__face,.bot__arm{transform:none!important}}
/* --- bot size + seat --- */
/* he was ~166px and clipped by the viewport edge - seat him properly */
.ali-fig{width:clamp(200px,17vw,280px)!important;bottom:8px!important;
  right:clamp(8px,1.2vw,22px)!important;overflow:visible!important}
.bot{perspective:760px!important;perspective-origin:50% 40%!important;overflow:visible}
.bot__l{overflow:visible}
/* --- bot seat v3 --- */
/* the figure sits IN the page, not on the very edge; nothing clips him */
.ali-fig{width:clamp(190px,15vw,250px)!important;bottom:18px!important;
  right:clamp(12px,1.5vw,26px)!important;overflow:visible!important;
  filter:drop-shadow(0 20px 26px rgba(20,8,34,.34))}
.ali-fig__hit,.bot,.bot__l{overflow:visible!important}
/* a soft contact shadow so he stands on the page instead of floating */
.ali-fig::after{content:"";position:absolute;left:22%;right:22%;bottom:2px;height:10px;
  border-radius:50%;background:radial-gradient(ellipse at center,rgba(20,8,34,.28),transparent 70%);
  z-index:0;pointer-events:none}
@media (max-width:760px){.ali-fig{width:132px!important;bottom:10px!important}}
/* --- guru3d --- */
/* real 3D canvas replaces the flat layers */
.bot canvas{width:100%!important;height:100%!important;display:block}
.bot:has(canvas) .bot__l{display:none!important}
.bot{perspective:none!important}
.ali-fig{width:clamp(190px,15vw,250px)!important;bottom:18px!important}
/* ===== v8.5.1: 20% smaller guru, free drag, mini-head hide ===== */
.ali-fig{width:clamp(152px,12vw,200px)!important}
@media (max-width:760px){.ali-fig{width:106px!important}}
.ali-fig.is-free{right:auto!important;bottom:auto!important;left:var(--ax)!important;top:var(--ay)!important}
.ali-fig.is-dragging{transition:none!important}
.ali-fig.is-dragging .ali-fig__hit{cursor:grabbing}
.ali-fig--minihead{width:84px!important}
.ali-fig--minihead .bot{border-radius:50%;overflow:hidden;
  background:radial-gradient(circle at 50% 32%,#ffffff 0%,#f2ecfa 68%,#e7ddf3 100%);
  box-shadow:0 8px 22px rgba(20,8,34,.30),inset 0 0 0 2px rgba(201,166,245,.55)}
.ali-fig--minihead::after{display:none!important}
.ali-fig--minihead .ali-fig__x{opacity:1;transform:rotate(45deg)}
.ali-fig--minihead .ali-fig__hit:hover{transform:translateY(-2px) scale(1.04)}
.ali-open .ali-fig__x{opacity:0!important;pointer-events:none}

/* ===== v8.5.2: flush mini head + glass/gold button polish ===== */
.ali-fig{transition:width .28s cubic-bezier(.4,0,.2,1),opacity .25s ease,transform .25s ease}
.ali-fig__x{
  width:30px;height:30px;top:-4px;right:-4px;font-size:15px;
  background:linear-gradient(145deg,#7a4cbe 0%,#4a2378 55%,#341459 100%);
  border:1.5px solid rgba(212,175,55,.6);color:#fff;
  box-shadow:0 4px 10px rgba(20,8,34,.38),inset 0 1px 2px rgba(255,255,255,.35),inset 0 -2px 4px rgba(0,0,0,.28);
  transition:transform .22s cubic-bezier(.34,1.56,.64,1),box-shadow .22s ease,opacity .18s ease,background .2s ease}
.ali-fig__x:hover{background:linear-gradient(145deg,#8a5cce 0%,#5b2e91 55%,#40196b 100%);
  transform:scale(1.14);
  box-shadow:0 6px 16px rgba(20,8,34,.5),0 0 14px rgba(201,166,245,.55),inset 0 1px 2px rgba(255,255,255,.4)}
.ali-fig--minihead .ali-fig__x{transform:rotate(45deg)}
.ali-fig--minihead .ali-fig__x:hover{transform:rotate(45deg) scale(1.14)}
.ali-fig--minihead .bot{
  background:radial-gradient(circle at 50% 30%,#ffffff 0%,#f4eefb 55%,#e2d5f2 100%);
  box-shadow:0 12px 28px rgba(20,8,34,.36),
             0 0 0 2px rgba(212,175,55,.8),0 0 0 5.5px rgba(255,255,255,.75),
             inset 0 -12px 20px rgba(122,80,180,.16)}
.ali-fig--minihead .ali-fig__hit:hover{transform:translateY(-2px) scale(1.05)}
/* chat chrome to match: glassy plum + gold */
.ali-iconbtn{background:linear-gradient(145deg,rgba(255,255,255,.22),rgba(255,255,255,.06)) , rgba(74,35,120,.35)!important;
  border:1px solid rgba(212,175,55,.45)!important;color:#fff!important;
  box-shadow:0 2px 6px rgba(20,8,34,.25),inset 0 1px 1.5px rgba(255,255,255,.3);
  transition:transform .2s cubic-bezier(.34,1.56,.64,1),box-shadow .2s ease}
.ali-iconbtn:hover{transform:scale(1.1);box-shadow:0 4px 10px rgba(20,8,34,.35),0 0 10px rgba(201,166,245,.45),inset 0 1px 1.5px rgba(255,255,255,.35)}
.ali-chip{background:linear-gradient(160deg,rgba(255,255,255,.9),rgba(244,238,251,.82))!important;
  border:1px solid rgba(122,80,180,.35)!important;
  box-shadow:0 2px 6px rgba(20,8,34,.12),inset 0 1px 1px rgba(255,255,255,.8);
  backdrop-filter:blur(8px);
  transition:transform .18s cubic-bezier(.34,1.56,.64,1),box-shadow .18s ease,border-color .18s ease}
.ali-chip:hover{transform:translateY(-1.5px);border-color:rgba(212,175,55,.7)!important;
  box-shadow:0 5px 12px rgba(20,8,34,.18),0 0 8px rgba(212,175,55,.25),inset 0 1px 1px rgba(255,255,255,.9)}
.ali-send{background:linear-gradient(145deg,#8a5cce 0%,#5b2e91 55%,#40196b 100%)!important;
  border:1.5px solid rgba(212,175,55,.55)!important;
  box-shadow:0 3px 9px rgba(20,8,34,.32),inset 0 1px 2px rgba(255,255,255,.35),inset 0 -2px 4px rgba(0,0,0,.25)!important;
  transition:transform .2s cubic-bezier(.34,1.56,.64,1),box-shadow .2s ease}
.ali-send:hover{transform:scale(1.08);box-shadow:0 5px 14px rgba(20,8,34,.42),0 0 12px rgba(201,166,245,.5),inset 0 1px 2px rgba(255,255,255,.4)!important}
/* buttons appear only when needed: hover/focus reveals, in both states */
.ali-fig--minihead .ali-fig__x{opacity:0}
.ali-fig--minihead:hover .ali-fig__x,.ali-fig--minihead .ali-fig__x:focus-visible{opacity:1}
