
.cs-widget-root{
  --cs-brand:#f2c94c;
  --cs-accent:#2a0d40;
  position:fixed;
  inset:0;
  pointer-events:none;
  font-family:Inter,Arial,Helvetica,sans-serif;
}
.cs-backdrop{
  position:absolute;
  inset:0;
  background:rgba(3,2,8,.36);
  opacity:0;
  visibility:hidden;
  transition:.18s ease;
}
.cs-modal-host:not(:empty){pointer-events:auto}
.cs-widget-root.cs-chat-open .cs-backdrop,
.cs-widget-root.cs-modal-open .cs-backdrop{
  opacity:1; visibility:visible; pointer-events:auto;
}
.cs-shell{
  position:fixed;
  right:16px;
  bottom:20px;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
  pointer-events:auto;
}
.cs-actions{
  display:flex;
  flex-direction:column;
  gap:8px;
  opacity:0;
  transform:translateY(12px) scale(.98);
  visibility:hidden;
  transition:.18s ease;
}
.cs-widget-root.cs-expanded .cs-actions{
  opacity:1; transform:translateY(0) scale(1); visibility:visible;
}
.cs-toggle,.cs-action,.cs-primary,.cs-secondary,.cs-list-item,.cs-chat-send,.cs-chat-close{
  border:0; cursor:pointer; font:inherit;
}
.cs-toggle{
  display:flex; align-items:center; gap:8px;
  background:linear-gradient(180deg,#3b1558,#220733);
  color:#fff; padding:12px 14px; border-radius:18px;
  box-shadow:0 10px 30px rgba(0,0,0,.28);
}
.cs-action{
  min-width:122px;
  display:flex; align-items:center; gap:8px;
  justify-content:flex-start;
  background:#13061f;
  color:#fff;
  border:1px solid rgba(242,201,93,.16);
  padding:10px 12px;
  border-radius:16px;
  box-shadow:0 10px 24px rgba(0,0,0,.24);
}
.cs-action:hover,.cs-toggle:hover,.cs-primary:hover,.cs-secondary:hover,.cs-list-item:hover{filter:brightness(1.04)}
.cs-action svg,.cs-toggle svg,.cs-chat-send svg,.cs-chat-close svg,.cs-secondary svg{color:var(--cs-brand)}
.cs-modal-host{
  position:fixed; inset:0; display:grid; place-items:center; pointer-events:none;
}
.cs-modal-wrap{pointer-events:auto; width:min(94vw,440px); padding:16px}
.cs-card{
  background:linear-gradient(180deg,rgba(28,12,42,.98),rgba(11,6,20,.98));
  color:#fff;
  border:1px solid rgba(255,255,255,.06);
  border-radius:24px;
  box-shadow:0 24px 80px rgba(0,0,0,.45);
  padding:22px;
}
.cs-branding{display:flex; align-items:center; gap:14px; margin-bottom:12px}
.cs-brand-logo{width:52px; height:52px; border-radius:16px; object-fit:cover; background:#240739}
.cs-kicker{font-size:12px; color:#c8b6db}
.cs-card h3{margin:0 0 8px; font-size:24px}
.cs-lead,.cs-sub,.cs-mini-note{color:#ddcfeb; line-height:1.45}
.cs-steps{display:grid; gap:10px; margin:16px 0 18px}
.cs-step{background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.05); border-radius:14px; padding:12px 14px}
.cs-label{display:block; margin:12px 0 6px; color:#dcc9f0; font-size:14px}
.cs-input{
  width:100%; background:#12081d; color:#fff;
  border:1px solid rgba(255,255,255,.1); border-radius:14px;
  padding:14px 14px; outline:none;
}
.cs-input:focus{border-color:rgba(242,201,93,.6)}
.cs-row{display:flex; gap:10px; margin-top:16px}
.cs-col-mobile{flex-direction:column}
.cs-primary{
  flex:1; background:var(--cs-brand); color:#241800;
  padding:14px 16px; border-radius:14px; font-weight:700;
}
.cs-secondary{
  flex:1; background:transparent; color:#f4d98b; border:1px solid rgba(242,201,93,.35);
  padding:14px 16px; border-radius:14px;
}
.cs-summary{display:grid; gap:10px; margin:16px 0}
.cs-summary-row{
  display:flex; align-items:center; justify-content:space-between;
  background:rgba(255,255,255,.04); border-radius:14px; padding:12px 14px;
}
.cs-list{display:grid; gap:10px; margin-top:14px}
.cs-list-item{
  text-align:left; background:#12081d; color:#fff; border:1px solid rgba(255,255,255,.08);
  border-radius:14px; padding:12px 14px;
}
.cs-list-item small{display:block; color:#bcaccd; margin-top:4px; word-break:break-all}
.cs-chat-panel{
  position:fixed; right:16px; bottom:96px; width:min(92vw,390px); height:min(72vh,560px);
  background:linear-gradient(180deg,rgba(28,12,42,.98),rgba(11,6,20,.98));
  border:1px solid rgba(255,255,255,.06);
  border-radius:24px; box-shadow:0 24px 80px rgba(0,0,0,.45);
  display:none; flex-direction:column; overflow:hidden; pointer-events:auto;
}
.cs-widget-root.cs-chat-open .cs-chat-panel{display:flex}
.cs-chat-head{
  display:flex; justify-content:space-between; align-items:center; padding:16px 18px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.cs-chat-title small{display:block; color:#cbb8de; margin-top:3px}
.cs-chat-close{
  width:36px; height:36px; border-radius:12px; background:rgba(255,255,255,.04); color:#fff;
}
.cs-chat-messages{flex:1; overflow:auto; padding:16px; display:grid; gap:10px}
.cs-msg{max-width:85%; display:grid; gap:4px}
.cs-msg-client{justify-self:end}
.cs-msg-office,.cs-msg-system{justify-self:start}
.cs-msg-meta{font-size:12px; color:#bcaed0}
.cs-msg-body{
  background:#1a0b28; color:#fff; border-radius:16px; padding:10px 12px; line-height:1.4;
}
.cs-msg-client .cs-msg-body{background:#f2c94c; color:#241800}
.cs-chat-form{
  display:flex; gap:10px; padding:14px; border-top:1px solid rgba(255,255,255,.06);
}
.cs-chat-input{
  flex:1; background:#12081d; color:#fff; border:1px solid rgba(255,255,255,.1); border-radius:14px; padding:12px 14px;
}
.cs-chat-send{
  width:46px; min-width:46px; border-radius:14px; background:#1a0b28; color:#fff;
}
.cs-toast{
  position:fixed; left:50%; bottom:24px; transform:translateX(-50%) translateY(16px);
  background:#0f0918; color:#fff; border:1px solid rgba(255,255,255,.08);
  border-radius:999px; padding:10px 14px; opacity:0; visibility:hidden; transition:.18s ease; pointer-events:none;
}
.cs-toast.is-visible{opacity:1; visibility:visible; transform:translateX(-50%) translateY(0)}
@media (max-width: 640px){
  .cs-shell{right:12px; bottom:14px}
  .cs-action{min-width:108px; padding:9px 11px}
  .cs-toggle{padding:11px 13px}
  .cs-chat-panel{right:12px; left:12px; width:auto; bottom:88px}
}
