.support-widget{
    position:fixed;
    right:20px;
    bottom:20px;
    z-index:9997;
    font-family:'Manrope','Inter',sans-serif;
    color:#eff8ff;
}
.support-widget *{
    box-sizing:border-box;
}
.support-teaser{
    position:absolute;
    right:10px;
    bottom:82px;
    width:min(308px,calc(100vw - 52px));
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:13px 14px;
    border-radius:20px;
    border:1px solid rgba(61,207,245,.18);
    background:
        linear-gradient(180deg,rgba(10,30,44,.96),rgba(8,20,31,.98)),
        radial-gradient(circle at top left,rgba(58,241,156,.08),transparent 28%);
    box-shadow:0 20px 40px rgba(0,0,0,.42),0 0 24px rgba(0,180,255,.1);
    backdrop-filter:blur(16px);
    opacity:0;
    transform:translateY(12px) scale(.97);
    pointer-events:none;
    transition:opacity .24s ease,transform .24s ease;
}
.support-widget.teaser-visible .support-teaser{
    opacity:1;
    transform:translateY(0) scale(1);
    pointer-events:auto;
}
.support-teaser::after{
    content:"";
    position:absolute;
    right:28px;
    bottom:-7px;
    width:14px;
    height:14px;
    border-right:1px solid rgba(61,207,245,.18);
    border-bottom:1px solid rgba(61,207,245,.18);
    background:rgba(8,20,31,.98);
    transform:rotate(45deg);
}
.support-teaser-orb{
    position:relative;
    flex:0 0 34px;
    width:34px;
    height:34px;
    border-radius:50%;
    background:
        radial-gradient(circle at 50% 45%,rgba(58,241,156,.9) 0 18%,rgba(18,88,105,.28) 19% 52%,rgba(7,22,34,.96) 53% 100%);
    border:1px solid rgba(82,220,255,.2);
    box-shadow:0 0 0 5px rgba(5,25,38,.34),0 0 20px rgba(58,241,156,.1);
}
.support-teaser-copy{
    min-width:0;
    flex:1 1 auto;
}
.support-teaser-copy strong{
    display:block;
    margin-bottom:4px;
    font-size:13px;
    font-weight:800;
    letter-spacing:.04em;
    color:#f3fbff;
}
.support-teaser-copy p{
    margin:0;
    color:#9cb4c4;
    font-size:12px;
    line-height:1.55;
    font-weight:600;
}
.support-teaser-close{
    width:26px;
    height:26px;
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    border:none;
    border-radius:50%;
    cursor:pointer;
    color:#9cb4c4;
    background:rgba(255,255,255,.04);
    transition:transform .2s ease,color .2s ease,background .2s ease;
}
.support-teaser-close:hover{
    color:#ffffff;
    background:rgba(255,255,255,.08);
    transform:rotate(90deg);
}
.support-launcher{
    position:relative;
    display:flex;
    align-items:center;
    gap:12px;
    min-width:212px;
    padding:11px 15px;
    border:none;
    border-radius:999px;
    cursor:pointer;
    overflow:visible;
    isolation:isolate;
    color:#f3fbff;
    background:
        linear-gradient(180deg,rgba(8,28,43,.96),rgba(5,15,24,.98)),
        radial-gradient(circle at 16% 20%,rgba(20,184,230,.1),transparent 34%);
    border:1px solid rgba(52,193,242,.24);
    box-shadow:0 16px 32px rgba(0,0,0,.42),0 0 22px rgba(0,180,255,.1);
    backdrop-filter:blur(16px);
    transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,opacity .24s ease;
}
.support-launcher::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.08) 30%,transparent 60%);
    transform:translateX(-140%);
    animation:supportSweep 4.2s ease-in-out infinite;
    pointer-events:none;
}
.support-launcher::after{
    content:"";
    position:absolute;
    inset:-12px -10px -10px -10px;
    border-radius:999px;
    background:
        radial-gradient(circle at 24% 50%,rgba(45,214,255,.18),rgba(45,214,255,.08) 34%,rgba(45,214,255,0) 72%),
        radial-gradient(circle at 72% 55%,rgba(58,241,156,.1),rgba(58,241,156,0) 62%);
    filter:blur(12px);
    opacity:.85;
    z-index:-1;
    pointer-events:none;
}
.support-launcher:hover{
    transform:translateY(-2px);
    border-color:rgba(52,193,242,.38);
    box-shadow:0 20px 36px rgba(0,0,0,.46),0 0 28px rgba(0,180,255,.13);
}
.support-launcher:focus-visible,
.support-panel-close:focus-visible,
.support-submit:focus-visible,
.support-send:focus-visible{
    outline:2px solid rgba(95,228,255,.52);
    outline-offset:4px;
}
.support-launcher-icon{
    position:relative;
    flex:0 0 42px;
    width:42px;
    height:42px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#71eaff;
    font-size:15px;
    background:
        radial-gradient(circle at 50% 40%,rgba(18,70,93,.9),rgba(6,22,34,.95));
    border:1px solid rgba(74,209,255,.24);
    box-shadow:0 0 0 4px rgba(5,27,38,.42),0 0 16px rgba(0,180,255,.08);
}
.support-launcher-icon::before{
    content:"";
    position:absolute;
    inset:-10px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(38,195,235,.16) 0%,rgba(38,195,235,.08) 32%,rgba(38,195,235,0) 72%);
    filter:blur(7px);
    opacity:.8;
    z-index:-1;
}
.support-launcher-icon::after{
    content:"";
    position:absolute;
    top:50%;
    left:50%;
    width:8px;
    height:8px;
    border-radius:50%;
    background:#3af19c;
    box-shadow:0 0 16px rgba(58,241,156,.74);
    transform:translate(-50%,-50%);
}
.support-launcher-copy{
    position:relative;
    display:flex;
    flex-direction:column;
    gap:2px;
    min-width:0;
    text-align:left;
    isolation:isolate;
}
.support-launcher-copy::before{
    content:"";
    position:absolute;
    left:-10px;
    right:-6px;
    top:-7px;
    bottom:-7px;
    border-radius:14px;
    background:radial-gradient(circle at 28% 50%,rgba(52,193,242,.14),rgba(52,193,242,.06) 38%,rgba(52,193,242,0) 72%);
    filter:blur(10px);
    opacity:.72;
    z-index:-1;
    pointer-events:none;
}
.support-launcher-copy strong{
    font-size:13px;
    font-weight:800;
    letter-spacing:.08em;
    line-height:1.1;
    text-transform:uppercase;
}
.support-launcher-status{
    display:flex;
    align-items:center;
    gap:6px;
    font-size:11px;
    font-weight:700;
    color:#56e5ab;
}
.support-launcher-status-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#3af19c;
    box-shadow:0 0 18px rgba(58,241,156,.82);
    animation:supportPulse 1.05s infinite;
}
.support-launcher-status-text{
    white-space:nowrap;
}
.support-launcher-badge{
    min-width:22px;
    height:22px;
    padding:0 6px;
    margin-left:auto;
    display:none;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    background:#0ea5c6;
    color:#effbff;
    font-size:11px;
    font-weight:800;
    box-shadow:0 8px 16px rgba(14,165,198,.2);
}
.support-widget.has-unread .support-launcher-badge{
    display:inline-flex;
}
.support-widget[data-status="away"] .support-launcher-status{
    color:#ffd27c;
}
.support-widget[data-status="away"] .support-launcher-status-dot{
    background:#ffb84a;
    box-shadow:0 0 15px rgba(255,184,74,.66);
}
.support-widget[data-status="offline"] .support-launcher-status{
    color:#94a8b9;
}
.support-widget[data-status="offline"] .support-launcher-status-dot{
    background:#7b8ca1;
    box-shadow:none;
    animation:none;
}
.support-widget[data-status="loading"] .support-launcher-status{
    color:#8bc8d8;
}
.support-widget.open .support-launcher{
    opacity:.88;
}
.support-panel{
    position:absolute;
    right:0;
    bottom:96px;
    width:min(408px,calc(100vw - 28px));
    overflow:hidden;
    border-radius:20px;
    border:1px solid rgba(53,138,170,.16);
    background:linear-gradient(180deg,rgba(8,17,28,.985),rgba(8,15,24,.992));
    box-shadow:0 18px 34px rgba(0,0,0,.34),0 0 18px rgba(0,180,255,.05);
    backdrop-filter:blur(18px);
    opacity:0;
    transform:translateY(16px) scale(.98);
    pointer-events:none;
    transition:opacity .26s ease,transform .26s ease;
}
.support-panel::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0) 24%),
        linear-gradient(90deg,rgba(255,255,255,.02),rgba(255,255,255,0) 36%,rgba(255,255,255,.01));
    pointer-events:none;
}
.support-widget.open .support-panel{
    opacity:1;
    transform:translateY(0) scale(1);
    pointer-events:auto;
}
.support-panel-header{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:14px 16px;
    border-bottom:1px solid rgba(76,114,142,.16);
}
.support-panel-brand{
    display:flex;
    align-items:center;
    gap:11px;
    min-width:0;
}
.support-panel-avatar{
    position:relative;
    flex:0 0 36px;
    width:36px;
    height:36px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:linear-gradient(180deg,rgba(8,32,45,.9),rgba(7,20,31,.94));
    border:1px solid rgba(57,174,214,.28);
    box-shadow:0 0 0 1px rgba(18,86,111,.18),0 0 0 4px rgba(6,23,34,.16);
}
.support-panel-avatar::before{
    content:"";
    width:8px;
    height:8px;
    border-radius:50%;
    background:#43f2a5;
    box-shadow:0 0 10px rgba(67,242,165,.48);
}
.support-panel-heading{
    min-width:0;
}
.support-panel-heading strong{
    display:block;
    margin-bottom:3px;
    font-size:12.5px;
    font-weight:800;
    letter-spacing:.01em;
    line-height:1.15;
}
.support-panel-heading p{
    margin:0;
    color:#58e8aa;
    font-size:11px;
    font-weight:700;
}
.support-panel-close{
    width:28px;
    height:28px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:none;
    border-radius:50%;
    cursor:pointer;
    color:#8ea3b4;
    background:transparent;
    transition:transform .2s ease,color .2s ease,background .2s ease;
}
.support-panel-close:hover{
    transform:rotate(90deg);
    color:#ffffff;
    background:rgba(255,255,255,.04);
}
.support-panel-body{
    position:relative;
    padding:15px 16px 16px;
}
.support-stage{
    display:none;
}
.support-stage.active{
    display:block;
}
.support-welcome{
    margin-bottom:12px;
    padding:14px 14px 13px;
    border-radius:15px;
    background:linear-gradient(180deg,rgba(9,28,40,.74),rgba(8,22,34,.7));
    border:1px solid rgba(51,168,211,.12);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
.support-welcome strong{
    display:block;
    margin-bottom:6px;
    font-size:14px;
    font-weight:800;
}
.support-welcome p{
    margin:0;
    color:#97a9b8;
    font-size:12px;
    line-height:1.56;
    font-weight:600;
}
.support-form{
    display:grid;
    gap:11px;
}
.support-input,
.support-composer textarea{
    width:100%;
    padding:14px 16px;
    border:none;
    border-radius:14px;
    color:#eef8ff;
    background:rgba(17,24,35,.86);
    border:1px solid rgba(116,133,152,.14);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.02);
    font:700 13.5px/1.25 'Manrope','Inter',sans-serif;
    transition:border-color .22s ease,box-shadow .22s ease,transform .22s ease;
}
.support-input::placeholder,
.support-composer textarea::placeholder{
    color:#728191;
}
.support-input:focus,
.support-composer textarea:focus{
    outline:none;
    border-color:rgba(39,197,243,.26);
    box-shadow:0 0 0 3px rgba(18,176,230,.045);
    transform:translateY(-1px);
}
.support-submit,
.support-send{
    width:100%;
    padding:14px 18px;
    border:none;
    border-radius:14px;
    cursor:pointer;
    color:#aef7ff;
    font:800 14px/1 'Manrope','Inter',sans-serif;
    background:linear-gradient(180deg,#0c5063,#0a3f4e);
    border:1px solid rgba(45,214,255,.14);
    box-shadow:0 10px 18px rgba(2,31,43,.2),inset 0 1px 0 rgba(255,255,255,.04);
    transition:transform .24s ease,filter .24s ease,box-shadow .24s ease,opacity .24s ease;
}
.support-submit:hover,
.support-send:hover{
    transform:translateY(-1px);
    filter:brightness(1.02);
    box-shadow:0 12px 20px rgba(2,31,43,.24),0 0 12px rgba(0,180,255,.08);
}
.support-submit[disabled],
.support-send[disabled]{
    cursor:wait;
    opacity:.8;
}
.support-error{
    min-height:18px;
    margin-top:2px;
    color:#ffb8b8;
    font-size:12px;
    line-height:1.45;
    font-weight:700;
}
.support-thread-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:12px;
}
.support-thread-chip{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:7px 10px;
    border-radius:999px;
    background:rgba(18,176,230,.1);
    border:1px solid rgba(35,176,224,.18);
    font-size:11px;
    font-weight:800;
    letter-spacing:.08em;
    color:#7beeff;
    text-transform:uppercase;
}
.support-thread-chip::before{
    content:"";
    width:8px;
    height:8px;
    border-radius:50%;
    background:#3af19c;
    box-shadow:0 0 12px rgba(58,241,156,.54);
}
.support-thread-sub{
    color:#8397a8;
    font-size:12px;
    font-weight:700;
}
.support-thread{
    max-height:316px;
    min-height:220px;
    margin-bottom:12px;
    padding:8px 4px 2px 0;
    overflow:auto;
    display:flex;
    flex-direction:column;
    gap:10px;
}
.support-thread::-webkit-scrollbar{
    width:8px;
}
.support-thread::-webkit-scrollbar-thumb{
    border-radius:999px;
    background:rgba(76,214,255,.14);
}
.support-empty{
    padding:18px 16px;
    border-radius:18px;
    background:linear-gradient(180deg,rgba(10,30,44,.9),rgba(8,23,35,.86));
    border:1px solid rgba(51,168,211,.16);
    color:#99aebe;
    font-size:13px;
    line-height:1.6;
    font-weight:600;
}
.support-message{
    display:flex;
    flex-direction:column;
    gap:5px;
    max-width:88%;
}
.support-message.admin{
    align-self:flex-start;
}
.support-message.visitor{
    align-self:flex-end;
}
.support-message-bubble{
    padding:13px 14px;
    border-radius:18px;
    font-size:13px;
    line-height:1.6;
    font-weight:600;
    word-break:break-word;
}
.support-message.admin .support-message-bubble{
    border-radius:18px 18px 18px 6px;
    background:linear-gradient(180deg,rgba(10,30,44,.96),rgba(8,23,35,.92));
    border:1px solid rgba(51,168,211,.18);
    color:#eaf8ff;
}
.support-message.visitor .support-message-bubble{
    border-radius:18px 18px 6px 18px;
    background:linear-gradient(180deg,rgba(11,91,113,.95),rgba(8,62,77,.94));
    border:1px solid rgba(61,207,245,.22);
    color:#eafcff;
}
.support-meta{
    display:flex;
    align-items:center;
    gap:8px;
    color:#73889a;
    font-size:11px;
    font-weight:700;
}
.support-message.visitor .support-meta{
    justify-content:flex-end;
}
.support-composer{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px;
    align-items:end;
}
.support-composer textarea{
    min-height:52px;
    max-height:160px;
    resize:vertical;
}
.support-send{
    width:auto;
    min-width:118px;
    min-height:52px;
    padding:14px 16px;
}
.support-chat-note{
    margin-top:10px;
    color:#7f93a4;
    font-size:12px;
    line-height:1.55;
    font-weight:600;
}
.support-chat-note strong{
    color:#bcecff;
}
@keyframes supportPulse{
    0%{
        transform:scale(.96);
        box-shadow:0 0 0 0 rgba(58,241,156,.48),0 0 12px rgba(58,241,156,.7);
        opacity:.82;
    }
    55%{
        transform:scale(1.18);
        box-shadow:0 0 0 8px rgba(58,241,156,0),0 0 22px rgba(58,241,156,.96);
        opacity:1;
    }
    100%{
        transform:scale(.98);
        box-shadow:0 0 0 0 rgba(58,241,156,0),0 0 12px rgba(58,241,156,.62);
        opacity:.86;
    }
}
@keyframes supportSweep{
    0%,16%{transform:translateX(-140%)}
    40%,100%{transform:translateX(140%)}
}
@media(max-width:720px){
    .support-widget{
        right:12px;
        left:12px;
        bottom:12px;
    }
    .support-teaser{
        right:0;
        width:min(100%,calc(100vw - 24px));
        bottom:76px;
    }
    .support-panel{
        width:min(100%,calc(100vw - 24px));
        bottom:92px;
    }
    .support-launcher{
        width:100%;
        min-width:0;
    }
    .support-composer{
        grid-template-columns:1fr;
    }
    .support-send{
        width:100%;
    }
}