*{box-sizing:border-box}
#marg-launcher{
  position:fixed;bottom:calc(24px + env(safe-area-inset-bottom));right:calc(24px + env(safe-area-inset-right));z-index:99999;
  width:60px;height:60px;border-radius:50%;
  background:#fff;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;box-shadow:0 4px 16px rgba(0,0,0,.25);
  border:3px solid #fff;overflow:hidden;
  transition:transform .2s;
  -webkit-tap-highlight-color:transparent;
}
#marg-launcher-img{width:100%;height:100%;object-fit:cover;border-radius:50%}
#marg-launcher:hover{transform:scale(1.08)}
#marg-launcher-label{
  position:fixed;bottom:38px;right:92px;z-index:99999;
  background:#fff;padding:8px 16px;border-radius:20px;
  font-family:Segoe UI,Arial,sans-serif;font-size:13px;font-weight:600;color:#333;
  box-shadow:0 2px 10px rgba(0,0,0,.15);
}

#marg-panel{
  position:fixed;bottom:100px;right:24px;z-index:99999;
  width:360px;max-width:92vw;height:520px;max-height:75vh;max-height:75dvh;
  background:#f7fafc;border-radius:16px;overflow:hidden;
  box-shadow:0 10px 40px rgba(0,0,0,.25);
  display:none;flex-direction:column;
  font-family:Segoe UI,Arial,sans-serif;
}
#marg-panel.open{display:flex}

#marg-header{
  background:linear-gradient(90deg,#e8721c,#f2a154);
  color:#fff;padding:14px 16px;display:flex;justify-content:space-between;align-items:center;
  flex-shrink:0;
}
.marg-header-left{display:flex;align-items:center;gap:10px}
#marg-header-img{width:38px;height:38px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.6);flex-shrink:0}
#marg-header .title{font-weight:700;font-size:15px}
#marg-header .sub{font-size:10.5px;opacity:.9;line-height:1.3;max-width:200px}
#marg-header .controls{display:flex;gap:6px;align-items:center}
#marg-header button{background:rgba(255,255,255,.2);border:none;color:#fff;width:36px;height:36px;border-radius:50%;cursor:pointer;font-size:15px;flex-shrink:0;-webkit-tap-highlight-color:transparent}
#marg-header button.active{background:#fff;color:#e8721c}

#marg-messages{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:14px;display:flex;flex-direction:column;gap:10px}
.marg-msg{max-width:85%;padding:10px 13px;border-radius:14px;font-size:14px;line-height:1.5;white-space:pre-wrap;word-break:break-word;overflow-wrap:break-word}
.marg-msg.bot{background:#fff;align-self:flex-start;box-shadow:0 1px 4px rgba(0,0,0,.08);border-bottom-left-radius:4px}
.marg-msg.user{background:#e8721c;color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.marg-msg.typing{background:#fff;align-self:flex-start;color:#999;font-style:italic}

#marg-inputbar{display:flex;gap:6px;padding:10px;padding-bottom:calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #eee;flex-shrink:0}
#marg-input{flex:1;min-width:0;border:1px solid #ddd;border-radius:20px;padding:10px 14px;font-size:16px;outline:none}
#marg-input:focus{border-color:#e8721c}
.marg-icon-btn{width:42px;height:42px;min-width:42px;border-radius:50%;border:none;cursor:pointer;font-size:16px;flex-shrink:0;-webkit-tap-highlight-color:transparent}
#marg-mic{background:#f0f0f0;color:#555}
#marg-mic.listening{background:#e74c3c;color:#fff;animation:marg-pulse 1s infinite}
#marg-send{background:#e8721c;color:#fff}
@keyframes marg-pulse{0%{box-shadow:0 0 0 0 rgba(231,76,60,.5)}70%{box-shadow:0 0 0 10px rgba(231,76,60,0)}100%{box-shadow:0 0 0 0 rgba(231,76,60,0)}}

@media (max-width:480px){
  #marg-panel{
    right:10px;left:10px;width:auto;
    bottom:calc(86px + env(safe-area-inset-bottom));
    height:auto;max-height:70vh;max-height:70dvh;
  }
  #marg-launcher{right:calc(16px + env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom))}
  #marg-launcher-label{display:none}
  #marg-header .sub{display:none}
}

@media (max-height:480px) and (orientation:landscape){
  #marg-panel{bottom:8px;top:8px;height:auto;max-height:none}
}