.support-widget {
    --support-bg: #05080c;
    --support-panel: #0b0f15;
    --support-sunken: #03060a;
    --support-line: rgba(255, 255, 255, .13);
    --support-orange: #ff7a1a;
    --support-orange-soft: #ffbe8f;
    --support-text: #f5f7fb;
    --support-muted: #b9c2d1;
    bottom: max(18px, env(safe-area-inset-bottom));
    color: var(--support-text);
    font-family: 'RNDMX Exo 2', 'Exo 2', system-ui, sans-serif;
    position: fixed;
    right: max(18px, env(safe-area-inset-right));
    z-index: 70;
}

.support-widget__trigger {
    align-items: center;
    background:
        radial-gradient(ellipse at 75% 18%, rgba(255, 255, 255, .18), transparent 48%),
        linear-gradient(180deg, #171d27 0%, #080b10 100%);
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 999px;
    box-shadow:
        0 0 22px rgba(31, 117, 255, .28),
        0 12px 36px rgba(0, 0, 0, .52),
        inset 0 1px 0 rgba(255, 255, 255, .12);
    color: var(--support-orange);
    cursor: pointer;
    display: flex;
    font-size: 24px;
    height: 58px;
    justify-content: center;
    position: relative;
    transition: border-color 160ms ease, color 160ms ease, filter 160ms ease;
    width: 58px;
}

.support-widget__trigger:hover {
    border-color: rgba(255, 122, 26, .58);
    color: var(--support-orange-soft);
    filter: brightness(1.12);
}

.support-widget__badge {
    align-items: center;
    background: #e32636;
    border: 2px solid #fff;
    border-radius: 999px;
    color: #fff;
    display: flex;
    font: 800 11px/1 'RNDMX Exo 2', system-ui, sans-serif;
    height: 20px;
    justify-content: center;
    min-width: 20px;
    padding: 0 4px;
    position: absolute;
    right: -2px;
    top: -2px;
}

.support-widget__badge[hidden],
.support-widget__tooltip[hidden] {
    display: none;
}

.support-widget__panel {
    background:
        radial-gradient(ellipse at 86% 18%, rgba(255, 255, 255, .08), transparent 8rem),
        radial-gradient(ellipse at 80% 32%, rgba(30, 110, 255, .34), transparent 17rem),
        var(--support-bg);
    border: 1px solid var(--support-line);
    border-radius: 18px;
    bottom: 72px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .58), inset 0 1px 0 rgba(255, 255, 255, .06);
    color: var(--support-text);
    max-height: min(680px, calc(100vh - 120px));
    overflow: auto;
    position: absolute;
    right: 0;
    width: min(390px, calc(100vw - 28px));
}

.support-widget__header {
    align-items: center;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    display: flex;
    font-size: 17px;
    font-weight: 800;
    justify-content: space-between;
    padding: 16px 18px;
}

.support-widget__header button {
    background: transparent;
    border: 0;
    color: var(--support-muted);
    cursor: pointer;
    font-size: 26px;
}

.support-widget__intro {
    color: var(--support-muted);
    font-size: 13px;
    line-height: 1.45;
    padding: 14px 18px 4px;
}

.support-widget__intro p { margin: 0 0 10px; }
.support-widget__intro strong { color: #fff; }

.support-widget__messages {
    display: grid;
    gap: 8px;
    max-height: 230px;
    overflow-y: auto;
    padding: 8px 18px;
}

.support-widget__message {
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 12px;
    font-size: 13px;
    line-height: 1.45;
    max-width: 88%;
    padding: 9px 11px;
    white-space: pre-wrap;
    word-break: break-word;
}

.support-widget__message--visitor {
    background: linear-gradient(180deg, #ff8c2b 0%, #ff5500 100%);
    color: #080b0f;
    justify-self: end;
}

.support-widget__message--admin {
    background: linear-gradient(180deg, rgba(35, 102, 206, .72), rgba(15, 42, 92, .9));
    justify-self: start;
}

.support-widget__message-meta {
    color: rgba(245, 247, 251, .56);
    font-size: 10px;
    line-height: 1.25;
    margin-bottom: 5px;
}

.support-widget__message--visitor .support-widget__message-meta {
    color: rgba(8, 11, 15, .62);
}

.support-widget__message-body a {
    color: #ffffff;
    overflow-wrap: anywhere;
    text-decoration: underline;
    text-decoration-color: rgba(255, 255, 255, .62);
    text-underline-offset: 2px;
}

.support-widget__message--visitor .support-widget__message-body a {
    color: #ffffff;
    text-decoration-color: rgba(255, 255, 255, .78);
}

.support-widget__new-divider {
    align-items: center;
    color: rgba(185, 194, 209, .72);
    display: flex;
    font-size: 10px;
    gap: 8px;
    line-height: 1;
    padding: 5px 0 2px;
}

.support-widget__new-divider::before,
.support-widget__new-divider::after {
    background: rgba(255, 255, 255, .13);
    content: '';
    height: 1px;
    flex: 1;
}

.support-widget__status {
    color: #fca5a5;
    font-size: 12px;
    line-height: 1.4;
    margin: 0;
    min-height: 17px;
    padding: 0 18px;
}

.support-widget__form { display: grid; gap: 9px; padding: 10px 18px 18px; }
.support-widget__label { font-size: 12px; font-weight: 700; }
.support-widget__form textarea {
    background: var(--support-sunken);
    border: 1px solid var(--support-line);
    border-radius: 10px;
    color: #fff;
    font: 14px/1.4 'RNDMX Exo 2', system-ui, sans-serif;
    padding: 10px;
    resize: vertical;
}
.support-widget__form textarea:focus {
    border-color: rgba(155, 216, 255, .66);
    box-shadow: 0 0 0 2px rgba(30, 110, 255, .18);
    outline: none;
}
.support-widget__form button {
    background:
        radial-gradient(ellipse at 66% 50%, rgba(255, 255, 255, .82), rgba(214, 238, 255, .45) 18%, transparent 58%),
        linear-gradient(90deg, #d5d7d9 0%, #f1f2f2 48%, #d4d7da 100%);
    border: 1px solid rgba(255, 255, 255, .58);
    border-radius: 10px;
    box-shadow: 0 0 13px rgba(143, 206, 255, .18), inset 0 1px 0 rgba(255, 255, 255, .68);
    color: #080b0f;
    cursor: pointer;
    font: 800 14px/1 'RNDMX Exo 2', system-ui, sans-serif;
    padding: 12px;
}

.support-widget__tooltip {
    animation: support-widget-tooltip-in 180ms ease-out;
    background: linear-gradient(180deg, #171d27 0%, #080b10 100%);
    border: 1px solid rgba(255, 122, 26, .5);
    border-radius: 10px;
    bottom: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .48), 0 0 16px rgba(255, 122, 26, .12);
    color: var(--support-text);
    font-size: 13px;
    font-weight: 800;
    padding: 10px 13px;
    position: absolute;
    right: 70px;
    white-space: nowrap;
}

.support-widget__tooltip::after {
    border: 7px solid transparent;
    border-left-color: rgba(255, 122, 26, .5);
    content: '';
    left: 100%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.support-widget__trigger.is-shaking { animation: support-widget-shake .58s ease-in-out; }

@keyframes support-widget-shake {
    0%, 100% { transform: rotate(0); }
    20% { transform: rotate(-10deg); }
    40% { transform: rotate(9deg); }
    60% { transform: rotate(-6deg); }
    80% { transform: rotate(4deg); }
}

@keyframes support-widget-tooltip-in {
    from { opacity: 0; transform: translateX(8px); }
    to { opacity: 1; transform: translateX(0); }
}

@media (prefers-reduced-motion: reduce) {
    .support-widget__trigger.is-shaking,
    .support-widget__tooltip { animation: none; }
}