/* ============================================================
   DE — digital consultant of Shirokov Deus Technology
   Native SDT component. Obsidian + champagne gold, restrained glass.
   Reuses site.css design tokens (:root vars). Scoped to .de- classes.
   ============================================================ */
#de-root{position:fixed;right:clamp(16px,2vw,28px);bottom:clamp(16px,2vw,28px);z-index:120;
  font-family:'Manrope',system-ui,-apple-system,sans-serif}
#de-root *{box-sizing:border-box}

/* ---------- launcher ---------- */
.de-launch{display:inline-flex;align-items:center;gap:12px;cursor:pointer;border:0;font-family:inherit;
  padding:11px 20px 11px 12px;border-radius:999px;color:var(--ink,#F4F2EC);
  background:linear-gradient(180deg,rgba(26,30,39,.92),rgba(12,14,18,.96));
  border:1px solid rgba(228,207,158,.34);backdrop-filter:blur(12px);
  box-shadow:0 20px 50px -20px rgba(0,0,0,.85),0 0 0 1px rgba(228,207,158,.08),inset 0 1px 0 rgba(255,255,255,.06);
  transition:transform .28s cubic-bezier(.22,.61,.36,1),box-shadow .28s,border-color .28s}
.de-launch:hover{transform:translateY(-3px);border-color:rgba(228,207,158,.6);
  box-shadow:0 30px 60px -22px rgba(0,0,0,.9),0 0 28px -6px rgba(198,162,84,.45)}
.de-launch:focus-visible{outline:2px solid var(--gold-hi,#E4CF9E);outline-offset:3px}
.de-badge{position:relative;width:40px;height:40px;flex:0 0 auto;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:17px;letter-spacing:-.01em;color:#221a08;
  background:radial-gradient(circle at 50% 34%,#fff2d6,#E4CF9E 58%,#C6A254 100%);
  box-shadow:0 0 22px -4px rgba(228,207,158,.7),inset 0 1px 0 rgba(255,255,255,.5)}
.de-badge i{position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;background:#7FD6A6;
  border:2px solid #12141a;box-shadow:0 0 0 0 rgba(127,214,166,.6);animation:dePulse 2.4s infinite}
@keyframes dePulse{0%{box-shadow:0 0 0 0 rgba(127,214,166,.5)}70%,100%{box-shadow:0 0 0 7px rgba(127,214,166,0)}}
.de-launch .de-lt{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15;padding-right:4px}
.de-launch .de-lt b{font-size:15px;font-weight:700;letter-spacing:.02em}
.de-launch .de-lt span{font-size:11.5px;color:var(--mute,#7B7F89);letter-spacing:.02em}
.de-launch .de-lt span em{font-style:normal;color:#8FE3B0}

/* ---------- panel ---------- */
.de-panel{position:fixed;right:clamp(16px,2vw,28px);bottom:clamp(16px,2vw,28px);z-index:121;
  width:min(384px,calc(100vw - 32px));height:min(600px,calc(100dvh - 40px));display:flex;flex-direction:column;overflow:hidden;
  border-radius:22px;border:1px solid rgba(228,207,158,.22);
  background:linear-gradient(180deg,rgba(17,19,24,.97),rgba(9,10,13,.98));backdrop-filter:blur(18px);
  box-shadow:0 50px 120px -40px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.04);
  transform-origin:bottom right;opacity:0;transform:translateY(14px) scale(.96);pointer-events:none;
  transition:opacity .3s cubic-bezier(.22,.61,.36,1),transform .3s cubic-bezier(.22,.61,.36,1)}
#de-root.open .de-panel{opacity:1;transform:none;pointer-events:auto}
#de-root.open .de-launch{opacity:0;transform:scale(.9);pointer-events:none}
.de-panel::before{content:"";position:absolute;left:0;right:0;top:0;height:150px;pointer-events:none;
  background:radial-gradient(120% 90% at 20% 0,rgba(198,162,84,.14),transparent 62%)}

/* header */
.de-head{position:relative;display:flex;align-items:center;gap:12px;padding:16px 14px 14px 16px;border-bottom:1px solid rgba(255,255,255,.08)}
.de-head .de-av{width:42px;height:42px;flex:0 0 auto;border-radius:13px;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:18px;letter-spacing:-.01em;color:#221a08;background:radial-gradient(circle at 50% 34%,#fff2d6,#E4CF9E 58%,#C6A254);
  box-shadow:0 0 18px -4px rgba(228,207,158,.6),inset 0 1px 0 rgba(255,255,255,.5)}
.de-head .de-ht{flex:1;min-width:0}
.de-head .de-ht b{display:block;font-size:16px;font-weight:700;letter-spacing:.01em;color:var(--ink,#F4F2EC)}
.de-head .de-ht span{display:block;font-size:12px;color:var(--mute,#7B7F89);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.de-head .de-st{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:#8FE3B0;margin-top:2px}
.de-head .de-st i{width:6px;height:6px;border-radius:50%;background:#7FD6A6;box-shadow:0 0 8px rgba(127,214,166,.8)}
.de-ico{width:34px;height:34px;flex:0 0 auto;border-radius:9px;border:1px solid var(--line2,rgba(255,255,255,.15));background:rgba(255,255,255,.03);
  color:var(--dim,#AEB2BC);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s}
.de-ico:hover{border-color:var(--gold,#C6A254);color:var(--gold-hi,#E4CF9E)}
.de-ico:focus-visible{outline:2px solid var(--gold-hi,#E4CF9E);outline-offset:2px}
.de-ico svg{width:17px;height:17px}

/* messages */
.de-body{flex:1;overflow-y:auto;padding:18px 16px 8px;display:flex;flex-direction:column;gap:11px;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}
.de-body::-webkit-scrollbar{width:8px}.de-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.1);border-radius:8px}
.de-msg{max-width:86%;font-size:14.5px;line-height:1.48;padding:11px 14px;border-radius:15px;animation:deIn .32s cubic-bezier(.22,.61,.36,1)}
@keyframes deIn{from{opacity:0;transform:translateY(7px)}}
.de-msg.de{align-self:flex-start;background:rgba(255,255,255,.045);border:1px solid var(--line,rgba(255,255,255,.085));border-bottom-left-radius:5px;color:var(--ink,#F4F2EC)}
.de-msg.me{align-self:flex-end;color:#F2E9D5;border-bottom-right-radius:5px;
  background:linear-gradient(135deg,rgba(228,207,158,.2),rgba(228,207,158,.06));border:1px solid rgba(228,207,158,.28)}
.de-msg a{color:var(--gold-hi,#E4CF9E);text-decoration:underline;text-underline-offset:2px}
.de-msg .de-rec{margin-top:9px;padding:11px 13px;border-radius:12px;background:rgba(198,162,84,.08);border:1px solid rgba(228,207,158,.26)}
.de-msg .de-rec b{display:block;font-size:14px;color:var(--gold-hi,#E4CF9E)}
.de-msg .de-rec span{display:block;font-size:12.5px;color:var(--dim,#AEB2BC);margin-top:2px}
.de-typing{align-self:flex-start;display:inline-flex;gap:4px;padding:13px 15px;border-radius:15px;border-bottom-left-radius:5px;
  background:rgba(255,255,255,.045);border:1px solid var(--line,rgba(255,255,255,.085))}
.de-typing i{width:6px;height:6px;border-radius:50%;background:var(--mute,#7B7F89);animation:deBlink 1.3s infinite}
.de-typing i:nth-child(2){animation-delay:.18s}.de-typing i:nth-child(3){animation-delay:.36s}
@keyframes deBlink{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* quick replies */
.de-quick{display:flex;flex-wrap:wrap;gap:7px;padding:2px 16px 6px}
.de-quick button{font-family:inherit;font-size:13px;color:var(--dim,#AEB2BC);background:rgba(255,255,255,.03);
  border:1px solid var(--line2,rgba(255,255,255,.15));border-radius:99px;padding:8px 13px;cursor:pointer;transition:.2s;animation:deIn .3s}
.de-quick button:hover{border-color:var(--gold,#C6A254);color:var(--gold-hi,#E4CF9E);transform:translateY(-1px)}
.de-quick button:focus-visible{outline:2px solid var(--gold-hi,#E4CF9E);outline-offset:2px}

/* input */
.de-foot{padding:10px 12px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid rgba(255,255,255,.08)}
.de-inrow{display:flex;align-items:flex-end;gap:9px;background:rgba(255,255,255,.04);border:1px solid var(--line2,rgba(255,255,255,.15));
  border-radius:16px;padding:6px 6px 6px 14px;transition:border-color .2s}
.de-inrow:focus-within{border-color:rgba(228,207,158,.5)}
.de-in{flex:1;border:0;background:transparent;color:var(--ink,#F4F2EC);font-family:inherit;font-size:14.5px;line-height:1.4;
  resize:none;max-height:96px;padding:7px 0;outline:none}
.de-in::placeholder{color:var(--mute,#7B7F89)}
.de-send{width:38px;height:38px;flex:0 0 auto;border:0;border-radius:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  color:#221a08;background:var(--metal,linear-gradient(160deg,#EEDFBB,#C6A254 60%,#8A6E3B));transition:.2s;box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.de-send:hover{filter:brightness(1.05)}.de-send:disabled{opacity:.45;cursor:default;filter:grayscale(.3)}
.de-send:focus-visible{outline:2px solid var(--gold-hi,#E4CF9E);outline-offset:2px}
.de-send svg{width:18px;height:18px}
.de-note{font-size:11px;color:var(--mute,#7B7F89);text-align:center;margin-top:8px;letter-spacing:.01em}
.de-err{font-size:12.5px;color:#E5A24D;padding:2px 16px 6px}

/* ---------- mobile ---------- */
@media(max-width:560px){
  #de-root{right:14px;bottom:14px}
  .de-launch{padding:0;width:56px;height:56px;justify-content:center;border-radius:50%}
  .de-launch .de-lt{display:none}
  .de-badge{width:52px;height:52px;font-size:22px}
  .de-panel{right:0;left:0;bottom:0;width:100vw;height:min(88dvh,100dvh);border-radius:20px 20px 0 0;
    transform-origin:bottom center;transform:translateY(20px)}
  .de-msg{max-width:90%}
}
@media(prefers-reduced-motion:reduce){
  .de-launch,.de-panel,.de-msg,.de-quick button{transition:none!important;animation:none!important}
  .de-badge i,.de-typing i{animation:none!important}
}
