/* =========================================================
   ELIAN VIRELION | GLOBAL PARTNER BOT
   Public-facing Virelion_OS experiences only
========================================================= */

#elianPartnerRoot {
  --elian-cyan:#56daf5;
  --elian-violet:#9364ec;
  --elian-pink:#dd6fd8;
  --elian-gold:#d6af70;
  --elian-text:#f4f0fa;
  --elian-muted:rgba(235,231,242,.68);

  position:fixed;
  inset:auto auto 0 0;

  z-index:2147482000;

  font-family:
    Inter,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  color:var(--elian-text);

  pointer-events:none;
}


/* ---------------------------------------------------------
   Launcher
--------------------------------------------------------- */

.elian-partner-launcher {
  position:fixed;

  left:
    max(
      16px,
      env(safe-area-inset-left)
    );

  bottom:
    max(
      16px,
      env(safe-area-inset-bottom)
    );

  width:62px;
  height:62px;

  padding:0;

  display:grid;
  place-items:center;

  border:
    1px solid
    rgba(120,219,255,.52);

  border-radius:20px;

  background:
    radial-gradient(
      circle at 32% 20%,
      rgba(106,222,255,.24),
      transparent 44%
    ),
    linear-gradient(
      145deg,
      rgba(11,19,43,.76),
      rgba(18,8,36,.84)
    );

  box-shadow:
    0 0 0 1px
      rgba(255,255,255,.05)
      inset,

    0 0 22px
      rgba(82,220,248,.32),

    0 0 42px
      rgba(164,83,233,.24),

    0 15px 42px
      rgba(0,0,0,.42);

  backdrop-filter:
    blur(14px)
    saturate(155%);

  -webkit-backdrop-filter:
    blur(14px)
    saturate(155%);

  cursor:pointer;

  pointer-events:auto;

  transition:
    transform .2s ease,
    box-shadow .2s ease,
    border-color .2s ease;

  animation:
    elianPartnerBreathe
    3.8s ease-in-out
    infinite;
}


.elian-partner-launcher:hover,
.elian-partner-launcher:focus-visible {
  transform:
    translateY(-3px)
    scale(1.035);

  border-color:
    rgba(132,234,255,.85);

  box-shadow:
    0 0 0 1px
      rgba(255,255,255,.08)
      inset,

    0 0 30px
      rgba(82,220,248,.46),

    0 0 58px
      rgba(181,79,233,.34),

    0 18px 48px
      rgba(0,0,0,.48);
}


.elian-partner-launcher img {
  width:37px;
  height:37px;

  object-fit:contain;

  filter:
    drop-shadow(
      0 0 7px
      rgba(93,221,255,.72)
    )
    drop-shadow(
      0 0 13px
      rgba(186,89,234,.50)
    );
}


.elian-partner-launcher::after {
  content:"";

  position:absolute;

  inset:-5px;

  border:
    1px solid
    rgba(100,211,246,.22);

  border-radius:24px;

  animation:
    elianPartnerRing
    3.8s ease-out
    infinite;

  pointer-events:none;
}


.elian-partner-label {
  position:fixed;

  left:
    max(
      88px,
      calc(
        env(safe-area-inset-left)
        + 88px
      )
    );

  bottom:
    max(
      27px,
      calc(
        env(safe-area-inset-bottom)
        + 27px
      )
    );

  display:flex;

  align-items:center;

  gap:8px;

  padding:
    8px 11px;

  border:
    1px solid
    rgba(255,255,255,.10);

  border-radius:999px;

  background:
    rgba(5,9,23,.72);

  box-shadow:
    0 12px 30px
    rgba(0,0,0,.30);

  backdrop-filter:
    blur(12px);

  -webkit-backdrop-filter:
    blur(12px);

  color:
    rgba(245,242,250,.86);

  font-size:.69rem;

  letter-spacing:.025em;

  pointer-events:none;

  transition:
    opacity .18s ease,
    transform .18s ease;
}


.elian-partner-label small {
  color:var(--elian-cyan);

  font:
    .52rem/1
    ui-monospace,
    monospace;

  letter-spacing:.14em;
}


/* ---------------------------------------------------------
   Chat Chamber
--------------------------------------------------------- */

.elian-partner-panel {
  position:fixed;

  left:
    max(
      16px,
      env(safe-area-inset-left)
    );

  bottom:
    max(
      92px,
      calc(
        env(safe-area-inset-bottom)
        + 92px
      )
    );

  width:
    min(
      390px,
      calc(100vw - 32px)
    );

  max-height:
    min(
      610px,
      calc(100svh - 120px)
    );

  display:flex;
  flex-direction:column;

  overflow:hidden;

  border:
    1px solid
    rgba(116,180,255,.28);

  border-radius:25px;

  background:
    radial-gradient(
      circle at 12% 0%,
      rgba(68,212,241,.10),
      transparent 38%
    ),

    radial-gradient(
      circle at 92% 4%,
      rgba(183,81,228,.10),
      transparent 40%
    ),

    linear-gradient(
      145deg,
      rgba(9,16,39,.70),
      rgba(4,8,21,.79)
    );

  box-shadow:
    0 30px 90px
      rgba(0,0,0,.54),

    0 0 48px
      rgba(68,171,224,.08),

    inset 0 1px 0
      rgba(255,255,255,.085);

  backdrop-filter:
    blur(22px)
    saturate(155%);

  -webkit-backdrop-filter:
    blur(22px)
    saturate(155%);

  opacity:0;

  visibility:hidden;

  transform:
    translateY(14px)
    scale(.975);

  transform-origin:
    bottom left;

  transition:
    opacity .2s ease,
    visibility .2s ease,
    transform .2s ease;

  pointer-events:none;
}


#elianPartnerRoot.is-open
.elian-partner-panel {
  opacity:1;
  visibility:visible;

  transform:
    translateY(0)
    scale(1);

  pointer-events:auto;
}


#elianPartnerRoot.is-open
.elian-partner-label {
  opacity:0;
  transform:
    translateX(-8px);
}


/* ---------------------------------------------------------
   Header
--------------------------------------------------------- */

.elian-partner-head {
  display:flex;
  align-items:center;

  gap:11px;

  padding:
    14px 15px;

  border-bottom:
    1px solid
    rgba(255,255,255,.075);

  background:
    rgba(2,5,15,.27);
}


.elian-partner-avatar {
  width:39px;
  height:39px;

  display:grid;
  place-items:center;

  flex:0 0 auto;

  border:
    1px solid
    rgba(104,218,248,.32);

  border-radius:13px;

  background:
    rgba(10,16,35,.42);

  box-shadow:
    0 0 18px
    rgba(84,216,247,.14);
}


.elian-partner-avatar img {
  width:27px;
  height:27px;

  filter:
    drop-shadow(
      0 0 6px
      rgba(85,220,248,.65)
    );
}


.elian-partner-id {
  min-width:0;
  flex:1;
}


.elian-partner-id strong {
  display:block;

  font-family:
    Georgia,
    serif;

  font-size:1rem;
}


.elian-partner-id span {
  display:block;

  margin-top:3px;

  color:var(--elian-cyan);

  font:
    .54rem/1.2
    ui-monospace,
    monospace;

  letter-spacing:.16em;
}


.elian-partner-close {
  width:34px;
  height:34px;

  border:
    1px solid
    rgba(255,255,255,.10);

  border-radius:50%;

  background:
    rgba(255,255,255,.025);

  color:white;

  cursor:pointer;
}


/* ---------------------------------------------------------
   Messages
--------------------------------------------------------- */

.elian-partner-messages {
  min-height:190px;
  flex:1;

  display:flex;
  flex-direction:column;

  gap:10px;

  overflow-y:auto;

  overscroll-behavior:contain;

  padding:
    15px;
}


.elian-partner-message {
  max-width:88%;

  padding:
    11px 12px;

  border:
    1px solid
    rgba(255,255,255,.075);

  border-radius:
    15px 15px
    15px 5px;

  background:
    rgba(255,255,255,.035);

  box-shadow:
    inset 0 1px 0
    rgba(255,255,255,.035);
}


.elian-partner-message.user {
  align-self:flex-end;

  border-radius:
    15px 15px
    5px 15px;

  border-color:
    rgba(214,175,112,.18);

  background:
    rgba(214,175,112,.055);
}


.elian-partner-message strong {
  display:block;

  margin-bottom:5px;

  font-family:
    Georgia,
    serif;

  font-size:.79rem;
}


.elian-partner-message p {
  margin:0;

  color:var(--elian-muted);

  font-size:.76rem;

  line-height:1.48;
}


.elian-partner-actions {
  display:flex;
  flex-wrap:wrap;

  gap:6px;

  margin-top:9px;
}


.elian-partner-action {
  display:inline-flex;

  align-items:center;

  min-height:31px;

  padding:
    0 10px;

  border:
    1px solid
    rgba(75,210,240,.25);

  border-radius:999px;

  color:var(--elian-cyan);

  background:
    rgba(75,210,240,.04);

  text-decoration:none;

  font-size:.68rem;

  font-weight:700;
}


/* ---------------------------------------------------------
   Quick prompts
--------------------------------------------------------- */

.elian-partner-prompts {
  display:flex;

  gap:6px;

  padding:
    0 14px 11px;

  overflow-x:auto;

  scrollbar-width:none;
}


.elian-partner-prompts::-webkit-scrollbar {
  display:none;
}


.elian-partner-prompts button {
  flex:0 0 auto;

  min-height:31px;

  padding:
    0 10px;

  border:
    1px solid
    rgba(255,255,255,.09);

  border-radius:999px;

  background:
    rgba(255,255,255,.025);

  color:
    rgba(236,232,244,.67);

  font-size:.65rem;

  cursor:pointer;
}


/* ---------------------------------------------------------
   Form
--------------------------------------------------------- */

.elian-partner-form {
  padding:
    12px 14px 14px;

  border-top:
    1px solid
    rgba(255,255,255,.07);
}


.elian-partner-form-row {
  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    auto;

  gap:7px;
}


.elian-partner-form input {
  min-width:0;
  width:100%;

  min-height:43px;

  padding:
    0 12px;

  border:
    1px solid
    rgba(255,255,255,.11);

  border-radius:12px;

  outline:none;

  background:
    rgba(1,4,13,.64);

  color:white;
}


.elian-partner-form input:focus {
  border-color:
    rgba(82,216,245,.46);

  box-shadow:
    0 0 0 3px
    rgba(82,216,245,.06);
}


.elian-partner-send {
  min-width:70px;

  border:
    1px solid
    rgba(80,216,244,.34);

  border-radius:12px;

  background:
    linear-gradient(
      135deg,
      rgba(24,144,184,.24),
      rgba(105,52,158,.31)
    );

  color:white;

  font-weight:700;

  cursor:pointer;
}


.elian-partner-footer {
  display:flex;
  justify-content:space-between;

  gap:10px;

  padding:
    0 15px 12px;

  color:
    rgba(232,228,240,.38);

  font-size:.58rem;
}


.elian-partner-footer a {
  color:
    rgba(105,218,243,.70);

  text-decoration:none;
}


@keyframes elianPartnerBreathe {
  0%,
  100% {
    transform:
      translateY(0);
  }

  50% {
    transform:
      translateY(-3px);
  }
}


@keyframes elianPartnerRing {
  0% {
    opacity:.62;

    transform:
      scale(.90);
  }

  70% {
    opacity:0;

    transform:
      scale(1.28);
  }

  100% {
    opacity:0;
  }
}


@media (max-width:600px) {

  .elian-partner-label {
    display:none;
  }


  .elian-partner-launcher {
    width:58px;
    height:58px;

    border-radius:18px;

    left:
      max(
        12px,
        env(safe-area-inset-left)
      );

    bottom:
      max(
        12px,
        env(safe-area-inset-bottom)
      );
  }


  .elian-partner-panel {
    left:
      max(
        10px,
        env(safe-area-inset-left)
      );

    bottom:
      max(
        80px,
        calc(
          env(safe-area-inset-bottom)
          + 80px
        )
      );

    width:
      calc(
        100vw
        - 20px
        - env(safe-area-inset-left)
        - env(safe-area-inset-right)
      );

    max-height:
      min(
        72svh,
        580px
      );

    border-radius:21px;
  }


  .elian-partner-messages {
    min-height:170px;
  }

}


@media (prefers-reduced-motion:reduce) {

  .elian-partner-launcher,
  .elian-partner-launcher::after {
    animation:none;
  }


  .elian-partner-panel {
    transition:none;
  }

}
