/* Stairway to Gray help widget — STG dark terminal palette */
.stg-chat{
	--c-bg:var(--stg-bg-2,#171a24); --c-bg2:var(--stg-bg-3,#1e2230); --c-fg:var(--stg-fg,#e7e9f0); --c-mute:var(--stg-muted,#9aa0b4);
	--c-line:var(--stg-line,#2a2f3d); --c-acc:var(--stg-accent,#7aa2ff); --c-acc2:var(--stg-accent-2,#9ce6c0); --c-tg:#2aabee;
	position:fixed; right:22px; bottom:22px; z-index:9990; font-family:inherit; color:var(--c-fg);
}
.stg-chat svg{ width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.stg-chat svg.is-fill{ fill:currentColor; stroke:none; }

/* launcher */
.stg-chat-launch{
	position:relative; display:grid; place-items:center; width:58px; height:58px; margin-left:auto; padding:0!important; border:0!important; border-radius:50%!important; cursor:pointer; min-height:0!important;
	color:#0b0d14; background:linear-gradient(145deg,#9cb9ff,var(--c-acc)); box-shadow:0 12px 28px -10px rgba(122,162,255,.75),inset 0 1px 0 rgba(255,255,255,.4);
	transition:transform .2s cubic-bezier(.2,.7,.2,1),box-shadow .2s;
}
.stg-chat-launch:hover{ transform:translateY(-2px) scale(1.04); }
.stg-chat-launch:focus-visible{ outline:2px solid var(--c-fg); outline-offset:3px; }
.stg-chat-launch::after{ content:""; position:absolute; inset:0; border-radius:50%; border:2px solid var(--c-acc); opacity:0; animation:stg-chat-ring 2.6s cubic-bezier(.2,.7,.2,1) 1.5s 3; pointer-events:none; }
@keyframes stg-chat-ring{ 0%{ transform:scale(1); opacity:.6 } 100%{ transform:scale(1.55); opacity:0 } }
.stg-chat-launch svg{ position:absolute; width:26px; height:26px; transition:opacity .2s, transform .25s cubic-bezier(.2,.7,.2,1); }
.stg-chat-i-close{ opacity:0; transform:rotate(-90deg) scale(.6); }
.stg-chat.is-open .stg-chat-i-open{ opacity:0; transform:rotate(90deg) scale(.6); }
.stg-chat.is-open .stg-chat-i-close{ opacity:1; transform:none; }
.stg-chat.is-open .stg-chat-launch::after{ animation:none; }
.stg-chat.is-chatting{ display:none; }

/* panel */
.stg-chat-panel{
	position:absolute; right:0; bottom:74px; width:340px; max-width:calc(100vw - 32px);
	background:linear-gradient(180deg,var(--c-bg2),var(--c-bg)); border:1px solid var(--c-line); border-radius:16px;
	box-shadow:0 28px 60px -24px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.02) inset; overflow:hidden;
	transform-origin:bottom right; animation:stg-chat-in .24s cubic-bezier(.2,.7,.2,1);
}
.stg-chat-panel[hidden]{ display:none; }
.stg-chat-panel::before{ content:""; display:block; height:3px; background:repeating-linear-gradient(90deg,var(--c-acc) 0 6px,transparent 6px 12px); opacity:.55; }
@keyframes stg-chat-in{ from{ opacity:0; transform:translateY(10px) scale(.97) } to{ opacity:1; transform:none } }
.stg-chat-head{ display:flex; align-items:flex-start; gap:12px; padding:16px 16px 12px; }
.stg-chat-mark{ flex:none; width:40px; height:40px; border-radius:10px; background:#0a0c12; box-shadow:inset 0 0 0 1px var(--c-line); object-fit:contain; padding:4px; }
.stg-chat-intro{ flex:1; min-width:0; }
.stg-chat-intro strong{ display:block; font-family:var(--stg-mono,ui-monospace,monospace); font-size:16px; font-weight:700; letter-spacing:-.01em; color:var(--c-fg); }
.stg-chat-intro span{ display:block; margin-top:3px; font-size:13px; line-height:1.45; color:var(--c-mute); }
.stg-chat-x{ flex:none; display:grid; place-items:center; width:30px; height:30px; margin:-4px -4px 0 0; padding:0!important; border:0!important; border-radius:8px!important; min-height:0!important; background:transparent!important; color:var(--c-mute)!important; box-shadow:none!important; cursor:pointer; }
.stg-chat-x:hover{ background:rgba(255,255,255,.08)!important; color:var(--c-fg)!important; }
.stg-chat-x svg{ width:18px; height:18px; }

.stg-chat-options{ display:grid; gap:8px; padding:4px 12px 12px; }
.stg-chat-opt{
	display:flex; align-items:center; gap:12px; width:100%; padding:12px!important; text-align:left; cursor:pointer; font:inherit; min-height:0!important; line-height:1.35!important; text-transform:none!important; letter-spacing:normal!important;
	color:var(--c-fg)!important; text-decoration:none!important; background:rgba(255,255,255,.025)!important; border:1px solid var(--c-line)!important; border-radius:12px!important; box-shadow:none!important;
	transition:border-color .18s, background .18s, transform .18s;
}
.stg-chat-opt:hover,.stg-chat-opt:focus-visible{ border-color:rgba(122,162,255,.55)!important; background:rgba(122,162,255,.07)!important; transform:translateY(-1px); outline:none; }
.stg-chat-opt.is-tg:hover,.stg-chat-opt.is-tg:focus-visible{ border-color:rgba(42,171,238,.6)!important; background:rgba(42,171,238,.08)!important; }
.stg-chat-ico{ flex:none; display:grid; place-items:center; width:40px; height:40px; border-radius:11px; background:rgba(122,162,255,.13); color:var(--c-acc); }
.stg-chat-opt.is-tg .stg-chat-ico{ background:rgba(42,171,238,.14); color:var(--c-tg); }
.stg-chat-opt.is-mail .stg-chat-ico{ background:rgba(156,230,192,.1); color:var(--c-acc2); }
.stg-chat-txt{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.stg-chat-txt strong{ display:flex; align-items:center; gap:8px; font-size:14.5px; font-weight:600; }
.stg-chat-txt em{ font-style:normal; font-size:12.5px; color:var(--c-mute); }
.stg-chat-dot{ width:7px; height:7px; border-radius:50%; background:var(--c-acc2); box-shadow:0 0 0 3px rgba(156,230,192,.15); }
.stg-chat-go{ flex:none; color:var(--c-mute); transition:transform .18s, color .18s; }
.stg-chat-opt:hover .stg-chat-go{ transform:translateX(3px); color:var(--c-fg); }
.stg-chat-opt.is-loading .stg-chat-txt em{ font-size:0; }
.stg-chat-opt.is-loading .stg-chat-txt em::after{ content:"Connecting…"; font-size:12.5px; }
.stg-chat-opt.is-loading .stg-chat-go{ animation:stg-chat-spin .9s linear infinite; }
@keyframes stg-chat-spin{ to{ transform:rotate(360deg) } }
.stg-chat-foot{ margin:0!important; padding:10px 16px 14px; border-top:1px solid var(--c-line); font-size:11.5px; line-height:1.5; color:var(--c-mute)!important; }

/* phones: clear Ustone's bottom tab bar */
@media (max-width:991px){
	.stg-chat{ right:14px; bottom:calc(78px + env(safe-area-inset-bottom,0px)); }
	.stg-chat-launch{ width:52px; height:52px; }
	.stg-chat-panel{ bottom:64px; }
}
@media (max-width:480px){
	.stg-chat-panel{ position:fixed; right:12px; left:12px; width:auto; max-width:none; bottom:calc(144px + env(safe-area-inset-bottom,0px)); }
}
@media (prefers-reduced-motion:reduce){
	.stg-chat-launch::after,.stg-chat-panel{ animation:none; }
	.stg-chat-launch,.stg-chat-launch svg,.stg-chat-opt,.stg-chat-go{ transition:none; }
}
