/* Piqelo v827 — branded AI launcher.
   Uses the same Piqelo mark as the site header and keeps the assistant
   compact in mobile and in-app browsers. */

.askPiqeloLauncher{
  --ask-ai-accent:#69e5cd;
  box-sizing:border-box!important;
  isolation:isolate;
  overflow:visible!important;
  min-inline-size:0!important;
  border:1px solid rgba(102,222,211,.43)!important;
  border-radius:19px!important;
  padding:8px 14px 8px 8px!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(72,174,225,.13),transparent 35%),
    linear-gradient(135deg,rgba(5,22,36,.985),rgba(6,39,49,.985))!important;
  box-shadow:
    0 18px 45px rgba(0,8,18,.34),
    0 0 0 1px rgba(255,255,255,.025) inset,
    0 0 28px rgba(58,207,196,.08)!important;
  color:#f5fbff!important;
  cursor:pointer;
  touch-action:manipulation;
}
.askPiqeloLauncher:hover{
  border-color:rgba(111,236,216,.72)!important;
  box-shadow:
    0 22px 52px rgba(0,8,18,.39),
    0 0 0 1px rgba(255,255,255,.035) inset,
    0 0 32px rgba(58,207,196,.14)!important;
}
.askPiqeloLauncher:active{transform:translateY(0) scale(.97)!important}
.askPiqeloLauncher:focus-visible{
  outline:3px solid rgba(105,229,205,.68)!important;
  outline-offset:4px!important;
}

.askPiqeloLauncherMark,
.askPiqeloMark,
.askPiqeloOrb{
  position:relative!important;
  box-sizing:border-box!important;
  color:transparent!important;
  text-shadow:none!important;
  background:
    url('/assets/piqelo-mark.png?v=822') center/84% 84% no-repeat,
    linear-gradient(145deg,rgba(7,29,47,.98),rgba(5,23,37,.98))!important;
  border:1px solid rgba(102,198,214,.26)!important;
  box-shadow:
    0 9px 22px rgba(0,8,17,.30),
    inset 0 1px 0 rgba(255,255,255,.045)!important;
}
.askPiqeloLauncherMark{
  inline-size:44px!important;
  block-size:44px!important;
  min-inline-size:44px!important;
  flex:0 0 44px!important;
  border-radius:14px!important;
}
.askPiqeloMark{
  inline-size:40px!important;
  block-size:40px!important;
  min-inline-size:40px!important;
  border-radius:13px!important;
}
.askPiqeloOrb{
  inline-size:62px!important;
  block-size:62px!important;
  border-radius:19px!important;
}

.askPiqeloLauncherMark::after,
.askPiqeloMark::after,
.askPiqeloOrb::after{
  content:"AI";
  position:absolute;
  z-index:3;
  inset-block-start:-6px;
  inset-inline-end:-8px;
  box-sizing:border-box;
  min-inline-size:23px;
  block-size:18px;
  display:grid;
  place-items:center;
  padding:0 5px;
  border:1px solid rgba(223,255,246,.72);
  border-radius:999px;
  background:linear-gradient(105deg,#79d8ff 0%,#69ead3 55%,#a2f1b9 100%);
  color:#04202a;
  box-shadow:0 6px 14px rgba(0,8,17,.30),0 0 14px rgba(75,222,204,.20);
  font:950 8px/1 Inter,ui-sans-serif,system-ui,sans-serif;
  letter-spacing:.07em;
}
.askPiqeloMark::after{
  inset-block-start:-5px;
  inset-inline-end:-7px;
  min-inline-size:21px;
  block-size:16px;
  font-size:7px;
}
.askPiqeloOrb::after{
  inset-block-start:-5px;
  inset-inline-end:-7px;
  min-inline-size:25px;
  block-size:19px;
  font-size:8px;
}

.askPiqeloLauncher>span:last-child{min-inline-size:0!important}
.askPiqeloLauncher b{
  display:block;
  color:#f4fbff;
  font-size:12px!important;
  font-weight:900;
  letter-spacing:-.015em;
  line-height:1.08;
  white-space:nowrap;
}
.askPiqeloLauncher b::after{content:none!important}
.askPiqeloLauncher small{font-size:0!important}
.askPiqeloLauncher small::after{
  content:"Evidence-backed TV assistant";
  display:block;
  margin-top:3px;
  color:#91afbf;
  font-size:10px;
  font-weight:700;
  line-height:1.2;
}
.askPiqeloIdentity b::after{content:" · AI";color:#78e5cf;font-size:.72em;letter-spacing:.02em}

@media(max-width:1100px){
  .askPiqeloLauncher{
    inset-inline-end:14px!important;
    inset-block-end:calc(78px + env(safe-area-inset-bottom))!important;
    inline-size:62px!important;
    block-size:62px!important;
    min-inline-size:62px!important;
    min-block-size:62px!important;
    max-inline-size:62px!important;
    max-block-size:62px!important;
    display:grid!important;
    place-items:center!important;
    gap:0!important;
    padding:7px!important;
    border-radius:20px!important;
  }
  .askPiqeloLauncher>span:last-child{display:none!important}
  .askPiqeloLauncherMark{
    inline-size:48px!important;
    block-size:48px!important;
    min-inline-size:48px!important;
    flex-basis:48px!important;
    border-radius:15px!important;
    background-size:86% 86%,100% 100%!important;
  }
}

@media(max-width:430px){
  .askPiqeloLauncher{
    inset-inline-end:12px!important;
    inline-size:58px!important;
    block-size:58px!important;
    min-inline-size:58px!important;
    min-block-size:58px!important;
    max-inline-size:58px!important;
    max-block-size:58px!important;
    padding:6px!important;
    border-radius:18px!important;
  }
  .askPiqeloLauncherMark{
    inline-size:44px!important;
    block-size:44px!important;
    min-inline-size:44px!important;
    flex-basis:44px!important;
    border-radius:14px!important;
  }
  .askPiqeloLauncherMark::after{
    inset-block-start:-5px;
    inset-inline-end:-7px;
    min-inline-size:22px;
    block-size:17px;
    font-size:7.5px;
  }
}

@media(prefers-reduced-motion:reduce){
  .askPiqeloLauncher{transition:none!important}
}