#gft-root {
        --gft-primary: #0f9d76;
        --gft-primary2: #0b7a5c;
        --gft-radius: 16px;
        --gft-font: 'Vazirmatn', Tahoma, sans-serif;
        --gft-fs: 14px;
        --gft-bg: #ffffff;
        --gft-ink: #212b26;
        --gft-muted: #7d8c85;
        --gft-line: #e6ece8;
        --gft-panel-bg: #f7faf8;
        --gft-bubble-me: linear-gradient(135deg, var(--gft-primary), var(--gft-primary2));
        --gft-bubble-you: #ffffff;
        direction: rtl;
        font-family: var(--gft-font);
        font-size: var(--gft-fs);
        line-height: 1.8;
}
#gft-root button, #gft-root input[type='button'], #gft-root input[type='submit'] { direction: rtl; }

#gft-root .gft-font-tahoma { --gft-font: Tahoma, 'Vazirmatn', sans-serif; }
#gft-root .gft-font-system { --gft-font: system-ui, -apple-system, 'Segoe UI', Tahoma, sans-serif; }
#gft-root .gft-font-iranyekan { --gft-font: 'IRANYekanX', 'IRANYekan', 'Vazirmatn', Tahoma, sans-serif; }

#gft-root.gft-dark {
        --gft-bg: #1c2320;
        --gft-ink: #e8eeea;
        --gft-muted: #94a39b;
        --gft-line: #2e3934;
        --gft-panel-bg: #222b27;
        --gft-bubble-you: #2b3631;
}

.gft-launcher {
        position: fixed;
        bottom: 22px;
        z-index: 999998;
        width: 62px;
        height: 62px;
        border-radius: 50%;
        border: none;
        cursor: pointer;
        background: var(--gft-bubble-me);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 10px 28px -8px rgba(0, 0, 0, .38), 0 0 0 0 rgba(15, 157, 118, .5);
        transition: transform .25s cubic-bezier(.34, 1.56, .64, 1), box-shadow .3s;
        animation: gft-pop .5s cubic-bezier(.34, 1.56, .64, 1);
}
#gft-root.gft-pos-right .gft-launcher { right: 22px; }
#gft-root.gft-pos-left .gft-launcher { left: 22px; }
.gft-launcher:hover { transform: scale(1.08) rotate(4deg); box-shadow: 0 14px 34px -8px rgba(0,0,0,.45); }
.gft-launcher:active { transform: scale(.94); }
.gft-launcher svg { width: 27px; height: 27px; }
.gft-launcher .gft-launcher-icon img { width: 34px; height: 34px; object-fit: contain; border-radius: 8px; }
.gft-launcher .gft-launcher-close { display: none; }
.gft-launcher.open .gft-launcher-icon { display: none; }
.gft-launcher.open .gft-launcher-close { display: block; }

.gft-launcher .gft-online-dot {
        position: absolute;
        bottom: 4px;
        right: 4px;
        width: 15px;
        height: 15px;
        border-radius: 50%;
        background: #9aa8a1;
        border: 3px solid #fff;
        transition: background .3s;
}
.gft-launcher.online .gft-online-dot { background: #2fd780; animation: gft-pulse 2s infinite; }

.gft-unread-badge {
        position: absolute;
        top: -5px;
        left: -5px;
        min-width: 24px;
        height: 24px;
        padding: 0 7px;
        border-radius: 999px;
        background: #ff4d4f;
        color: #fff;
        font-size: 12px;
        font-weight: 800;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 4px 12px rgba(255, 77, 79, .5);
        animation: gft-pop .4s cubic-bezier(.34, 1.56, .64, 1);
}

.gft-greeting {
        position: fixed;
        bottom: 34px;
        z-index: 999997;
        max-width: 250px;
        background: var(--gft-bg);
        color: var(--gft-ink);
        border: 1px solid var(--gft-line);
        border-radius: 16px 16px 16px 4px;
        padding: 12px 16px;
        font-size: 13px;
        font-weight: 500;
        box-shadow: 0 12px 34px -10px rgba(0, 0, 0, .25);
        animation: gft-slide-up .5s cubic-bezier(.2, .9, .3, 1.2);
        cursor: pointer;
}
#gft-root.gft-pos-right .gft-greeting { right: 96px; border-radius: 16px 16px 4px 16px; }
#gft-root.gft-pos-left .gft-greeting { left: 96px; }
.gft-greeting::after { content: ''; }
.gft-greeting .gft-greet-close {
        position: absolute;
        top: -8px;
        left: -8px;
        width: 22px;
        height: 22px;
        border-radius: 50%;
        background: var(--gft-ink);
        color: #fff;
        border: none;
        font-size: 12px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
}

.gft-panel {
        position: fixed;
        bottom: 96px;
        z-index: 999999;
        width: 378px;
        max-width: calc(100vw - 32px);
        height: min(620px, calc(100vh - 130px));
        background: var(--gft-bg);
        border-radius: var(--gft-radius);
        box-shadow: 0 24px 70px -16px rgba(10, 30, 22, .45);
        display: flex;
        flex-direction: column;
        overflow: hidden;
        opacity: 0;
        pointer-events: none;
        transform: translateY(24px) scale(.96);
        transform-origin: bottom;
        transition: opacity .28s ease, transform .28s cubic-bezier(.2, .9, .3, 1.15);
        border: 1px solid var(--gft-line);
}
#gft-root.gft-pos-right .gft-panel { right: 22px; transform-origin: bottom right; }
#gft-root.gft-pos-left .gft-panel { left: 22px; transform-origin: bottom left; }
.gft-panel.open { opacity: 1; pointer-events: auto; transform: translateY(0) scale(1); }

.gft-header {
        background: var(--gft-bubble-me);
        color: #fff;
        padding: 16px 18px;
        display: flex;
        align-items: center;
        gap: 12px;
        flex-shrink: 0;
        position: relative;
        overflow: hidden;
}
.gft-header.solid { background: var(--gft-primary); }

.gft-panel-close {
        position: absolute;
        top: 10px;
        inset-inline-end: 12px;
        width: 30px;
        height: 30px;
        border: 0;
        border-radius: 9px;
        background: rgba(255, 255, 255, .16);
        color: #fff;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        z-index: 2;
        transition: background .18s ease, transform .18s ease;
}
.gft-panel-close svg { width: 15px; height: 15px; display: block; }
.gft-panel-close:hover { background: rgba(255, 255, 255, .32); transform: rotate(90deg); }
.gft-panel-close:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.gft-header::before {
        content: '';
        position: absolute;
        width: 140px;
        height: 140px;
        border-radius: 50%;
        background: rgba(255, 255, 255, .12);
        top: -70px;
        left: -40px;
}
.gft-header::after {
        content: '';
        position: absolute;
        width: 90px;
        height: 90px;
        border-radius: 50%;
        background: rgba(255, 255, 255, .1);
        bottom: -50px;
        right: 30px;
}
.gft-agent-avatar {
        width: 46px;
        height: 46px;
        border-radius: 14px;
        object-fit: cover;
        background: rgba(255, 255, 255, .25);
        border: 2px solid rgba(255, 255, 255, .55);
        flex-shrink: 0;
        position: relative;
        z-index: 1;
}
.gft-agent-info { flex: 1; position: relative; z-index: 1; min-width: 0; }
.gft-agent-name { font-weight: 800; font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gft-agent-status { font-size: 11.5px; opacity: .9; display: flex; align-items: center; gap: 5px; }
.gft-agent-status .st-dot { width: 7px; height: 7px; border-radius: 50%; background: #9fb0a8; }
.gft-agent-status.on .st-dot { background: #59ffa8; box-shadow: 0 0 8px rgba(89, 255, 168, .8); }
.gft-header-actions { display: flex; gap: 4px; position: relative; z-index: 1; }
.gft-icon-btn {
        width: 34px;
        height: 34px;
        border-radius: 10px;
        border: none;
        background: rgba(255, 255, 255, .16);
        color: #fff;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: background .2s;
}
.gft-icon-btn:hover { background: rgba(255, 255, 255, .3); }
.gft-icon-btn svg { width: 17px; height: 17px; }

.gft-body {
        flex: 1;
        overflow-y: auto;
        position: relative;
        background: var(--gft-panel-bg);
        padding: 16px 14px;
        display: flex;
        flex-direction: column;
        gap: 9px;
}
.gft-body::-webkit-scrollbar { width: 7px; }
.gft-body::-webkit-scrollbar-thumb { background: rgba(125, 140, 133, .3); border-radius: 99px; }

.gft-day-sep { text-align: center; font-size: 11px; color: var(--gft-muted); margin: 6px 0; display: flex; align-items: center; gap: 10px; }
.gft-day-sep::before, .gft-day-sep::after { content: ''; flex: 1; height: 1px; background: var(--gft-line); }

.gft-row { display: flex; flex-direction: column; max-width: 82%; animation: gft-msg-in .3s ease; }
.gft-row.me { align-self: flex-end; align-items: flex-end; }
.gft-row.them { align-self: flex-start; align-items: flex-start; }

.gft-bubble {
        padding: 10px 14px;
        border-radius: 16px;
        font-size: 13.5px;
        white-space: pre-wrap;
        word-break: break-word;
        position: relative;
        box-shadow: 0 1px 2.5px rgba(0, 0, 0, .07);
}
.gft-row.me .gft-bubble {
        background: var(--gft-bubble-you);
        color: var(--gft-ink);
        border: 1px solid var(--gft-line);
        border-radius: 4px 16px 16px 16px;
}
.gft-row.them .gft-bubble {
        background: var(--gft-bubble-me);
        color: #fff;
        border-radius: 16px 4px 16px 16px;
}
.gft-row.them .gft-bubble.ai {
        background: linear-gradient(135deg, #3b4d8f, #26335e);
}
.gft-row.them .gft-bubble.sys {
        background: transparent;
        border: 1.5px dashed #d9b06c;
        color: #8a6d3b;
        box-shadow: none;
        font-size: 12.5px;
}
#gft-root.gft-dark .gft-row.them .gft-bubble.sys { color: #e5c78a; border-color: #6e5a33; }

.gft-msg-meta {
        font-size: 10px;
        color: var(--gft-muted);
        margin-top: 3px;
        padding: 0 5px;
        display: flex;
        align-items: center;
        gap: 4px;
}
.gft-row.me .gft-tick { display: inline-flex; }
.gft-tick svg { width: 14px; height: 12px; }
.gft-tick.t1 { color: #9fb0a8; }
.gft-tick.t2 { color: #35b6e8; }
.gft-row.me .gft-tick.t2 svg { filter: drop-shadow(0 0 3px rgba(53, 182, 232, .45)); }

.gft-sender-label { font-size: 10.5px; color: var(--gft-muted); margin: 0 4px 2px; font-weight: 700; }
.gft-sender-label .ai-badge {
        background: linear-gradient(135deg, #3b4d8f, #26335e);
        color: #fff;
        border-radius: 99px;
        padding: 1px 9px;
        font-size: 9.5px;
        margin-inline-start: 5px;
}

.gft-typing { display: flex; gap: 4px; padding: 12px 16px; align-items: center; }
.gft-typing span {
        width: 7px; height: 7px; border-radius: 50%;
        background: var(--gft-muted);
        animation: gft-bounce 1.2s infinite;
}
.gft-typing span:nth-child(2) { animation-delay: .18s; }
.gft-typing span:nth-child(3) { animation-delay: .36s; }

.gft-start-box { display: flex; flex-direction: column; gap: 10px; }
.gft-welcome-card {
        background: var(--gft-bg);
        border: 1px solid var(--gft-line);
        border-radius: 16px;
        padding: 16px;
        text-align: center;
}
.gft-welcome-card .gft-wc-emoji { font-size: 34px; margin-bottom: 6px; }
.gft-welcome-card .gft-wc-title { font-weight: 800; font-size: 15px; margin-bottom: 4px; color: var(--gft-ink); }
.gft-welcome-card .gft-wc-text { font-size: 12.5px; color: var(--gft-muted); }

.gft-chip {
        border: 1.5px solid var(--gft-primary);
        color: var(--gft-primary);
        background: transparent;
        border-radius: 999px;
        padding: 8px 15px;
        font-size: 12.5px;
        font-weight: 600;
        font-family: inherit;
        cursor: pointer;
        transition: all .18s;
        text-align: right;
}
.gft-chip:hover { background: var(--gft-primary); color: #fff; transform: translateY(-1px); box-shadow: 0 6px 16px -8px rgba(15,157,118,.6); }

.gft-prechat {
        background: var(--gft-bg);
        border: 1px solid var(--gft-line);
        border-radius: 16px;
        padding: 16px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        order: 9999;      
        margin-top: auto; 
        flex-shrink: 0;
}
.gft-prechat .gft-pc-title { font-weight: 800; font-size: 13.5px; color: var(--gft-ink); }
.gft-prechat input {
        border: 1.5px solid var(--gft-line);
        background: var(--gft-panel-bg);
        border-radius: 11px;
        padding: 10px 13px;
        font-family: inherit;
        font-size: 13px;
        color: var(--gft-ink);
        width: 100%;
        box-sizing: border-box;
        text-align: right;
}
.gft-prechat input:focus { border-color: var(--gft-primary); outline: none; }
.gft-prechat .gft-pc-submit {
        background: var(--gft-bubble-me);
        color: #fff;
        border: none;
        border-radius: 11px;
        padding: 11px;
        font-family: inherit;
        font-size: 13.5px;
        font-weight: 700;
        cursor: pointer;
        transition: transform .15s;
}
.gft-prechat .gft-pc-submit:hover { transform: translateY(-1px); }
.gft-prechat .gft-pc-submit svg { width: 14px; height: 14px; transform: scaleX(-1); margin-right: 4px; vertical-align: -2px; }
.gft-pc-error { color: #e05252; font-size: 11.5px; display: none; }

.gft-socials { display: flex; gap: 8px; justify-content: center; padding: 4px 0 2px; }
.gft-socials a {
        width: 36px;
        height: 36px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--gft-bg);
        border: 1px solid var(--gft-line);
        color: var(--gft-muted);
        text-decoration: none !important;
        transition: all .18s;
}
.gft-socials a:hover { border-color: var(--gft-primary); color: var(--gft-primary); transform: translateY(-2px); }
.gft-socials a svg { width: 17px; height: 17px; }

.gft-footer {
        padding: 10px 12px;
        border-top: 1px solid var(--gft-line);
        background: var(--gft-bg);
        flex-shrink: 0;
}
.gft-input-row { display: flex; gap: 8px; align-items: flex-end; }
.gft-textarea {
        flex: 1;
        border: 1.5px solid var(--gft-line);
        background: var(--gft-panel-bg);
        border-radius: 13px;
        padding: 11px 14px;
        font-family: inherit;
        font-size: 13.5px;
        color: var(--gft-ink);
        resize: none;
        max-height: 110px;
        line-height: 1.7;
        transition: border .2s;
}
.gft-textarea:focus { border-color: var(--gft-primary); outline: none; }
.gft-textarea::placeholder { color: var(--gft-muted); }
.gft-send-btn {
        width: 44px;
        height: 44px;
        border-radius: 13px;
        border: none;
        background: var(--gft-bubble-me);
        color: #fff;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        transition: transform .18s, opacity .2s;
}
.gft-send-btn:hover { transform: scale(1.07); }
.gft-send-btn:disabled { opacity: .55; cursor: wait; transform: none; }
.gft-send-btn svg { width: 19px; height: 19px; transform: scaleX(-1); margin-left: -2px; }

.gft-powered {
        text-align: center;
        font-size: 10px;
        color: var(--gft-muted);
        padding: 7px 0 3px;
        background: var(--gft-bg);
}
.gft-powered-brand { color: var(--gft-primary); text-decoration: none; font-weight: 700; }

.gft-react-bar { position: relative; display: flex; align-items: center; gap: 4px; margin-top: 2px; }
.gft-react-pick {
        position: absolute;
        bottom: calc(100% + 2px);
        inset-inline-start: 2px;
        z-index: 3;
        display: flex; gap: 1px;
        background: var(--gft-bg);
        border: 1px solid var(--gft-line);
        border-radius: 999px;
        padding: 3px 8px;
        box-shadow: 0 3px 12px -4px rgba(0,0,0,.14);
        opacity: 0;
        transform: translateY(3px);
        transition: opacity .18s ease, transform .18s ease;
        pointer-events: none;
}
.gft-row:hover .gft-react-pick { opacity: 1; transform: translateY(0); pointer-events: auto; }
.gft-react-pick button {
        background: none; border: none; cursor: pointer;
        font-size: 16px; padding: 2px 5px; border-radius: 9px;
        transition: transform .15s ease, background .15s ease;
        line-height: 1;
}
.gft-react-pick button img.emoji {
        width: 1.15em !important;
        height: 1.15em !important;
        max-width: none !important;
        max-height: none !important;
        margin: 0 !important;
        display: inline-block;
        vertical-align: middle;
}
.gft-react-pick button:hover { transform: scale(1.35) translateY(-2px); background: var(--gft-panel-bg); }
.gft-react-shown { display: flex; gap: 3px; }
.gft-react-chip {
        font-size: 11px;
        background: var(--gft-bg);
        border: 1px solid var(--gft-line);
        border-radius: 999px;
        padding: 1px 7px;
        animation: gft-pop .25s cubic-bezier(.34, 1.56, .64, 1);
}

.gft-edited-tag {
        font-size: 10px;
        color: var(--gft-muted);
        background: rgba(125,140,133,.14);
        border-radius: 99px;
        padding: 0 7px;
        margin-inline-start: 6px;
        vertical-align: middle;
}
#gft-root.gft-dark .gft-edited-tag { background: rgba(255,255,255,.08); }

.gft-csat {
        background: var(--gft-bg);
        border: 1.5px solid var(--gft-primary);
        border-radius: 16px;
        padding: 14px 16px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        animation: gft-msg-in .3s ease;
}
.gft-csat-title { font-size: 12.5px; font-weight: 700; color: var(--gft-ink); line-height: 1.9; }
.gft-csat-stars { display: flex; gap: 4px; justify-content: center; direction: ltr; }
.gft-csat-stars button {
        background: none; border: none; cursor: pointer;
        font-size: 27px; color: #d5ddd8;
        padding: 0 3px;
        transition: transform .16s cubic-bezier(.34, 1.56, .64, 1), color .16s;
        line-height: 1.2;
}
.gft-csat-stars button:hover { transform: scale(1.25) rotate(-6deg); }
.gft-csat-stars button.filled { color: #f5b301; }
.gft-csat-comment {
        border: 1.5px solid var(--gft-line);
        background: var(--gft-panel-bg);
        border-radius: 11px;
        padding: 9px 12px;
        font-family: inherit;
        font-size: 12.5px;
        color: var(--gft-ink);
        resize: none;
}
.gft-csat-comment:focus { border-color: var(--gft-primary); outline: none; }
.gft-csat-send {
        background: var(--gft-bubble-me);
        color: #fff;
        border: none;
        border-radius: 10px;
        padding: 9px;
        font-family: inherit;
        font-size: 13px;
        font-weight: 700;
        cursor: pointer;
        transition: transform .15s, opacity .2s;
}
.gft-csat-send:hover { transform: translateY(-1px); }
.gft-csat-send:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.gft-csat-thanks { text-align: center; font-weight: 800; color: var(--gft-primary); padding: 8px 0 4px; animation: gft-pop .4s cubic-bezier(.34, 1.56, .64, 1); }

@media (max-width: 480px) {
        .gft-panel {
                width: 100vw !important;
                max-width: 100vw;
                height: 100dvh !important;
                bottom: 0 !important;
                right: 0 !important;
                left: 0 !important;
                border-radius: 0 !important;
                transform: translateY(100%);
        }
        .gft-panel.open { transform: translateY(0); }
        .gft-greeting { display: none; }
}

@keyframes gft-pop {
        0% { transform: scale(0); }
        100% { transform: scale(1); }
}
@keyframes gft-pulse {
        0% { box-shadow: 0 0 0 0 rgba(47, 215, 128, .45); }
        70% { box-shadow: 0 0 0 9px rgba(47, 215, 128, 0); }
        100% { box-shadow: 0 0 0 0 rgba(47, 215, 128, 0); }
}
@keyframes gft-slide-up {
        from { opacity: 0; transform: translateY(16px) scale(.95); }
        to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes gft-msg-in {
        from { opacity: 0; transform: translateY(8px); }
        to { opacity: 1; transform: translateY(0); }
}
@keyframes gft-bounce {
        0%, 60%, 100% { transform: translateY(0); }
        30% { transform: translateY(-6px); }
}

.gft-panel.gft-scrolled .gft-header {
        box-shadow: 0 6px 18px -8px rgba(10, 30, 22, .35);
}
.gft-panel .gft-header { transition: box-shadow .25s ease; }

.gft-panel .gft-textarea:focus {
        border-color: var(--gft-primary);
        box-shadow: 0 0 0 3px rgba(15, 157, 118, .16);
        outline: none;
}

.gft-panel .gft-send-btn:active { transform: scale(.94); }
.gft-panel .gft-launcher:active { transform: scale(.93); }

.gft-launcher::after {
        content: '';
        position: absolute; inset: -4px;
        border-radius: 50%;
        border: 2px solid rgba(15, 157, 118, .35);
        opacity: 0;
        transition: opacity .3s ease;
        pointer-events: none;
}
.gft-launcher.online:hover::after { opacity: 1; animation: gft-launch-ring 1.6s infinite; }
@keyframes gft-launch-ring {
        0% { transform: scale(.96); opacity: .8; }
        100% { transform: scale(1.12); opacity: 0; }
}

.gft-panel .gft-chip { transition: transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease; }
.gft-panel .gft-chip:hover { transform: translateY(-2px); box-shadow: 0 6px 14px -8px rgba(15,157,118,.4); }

.gft-w-attach {
        flex-shrink: 0; width: 38px; height: 38px; border-radius: 10px;
        border: none; background: transparent; color: #6b7f76; cursor: pointer;
        display: inline-flex; align-items: center; justify-content: center;
        transition: background .18s, color .18s, transform .15s;
}
.gft-w-attach svg { width: 19px; height: 19px; }
.gft-w-attach:hover { background: rgba(15, 157, 118, .12); color: #0b7a5c; transform: translateY(-1px); }
.gft-w-attach:active { transform: scale(.94); }
.gft-panel.gft-dark .gft-w-attach { color: #93a89e; }
.gft-panel.gft-dark .gft-w-attach:hover { background: rgba(23, 180, 137, .18); color: #4cd3a9; }

.gft-pending-att {
        display: flex; align-items: center; gap: 10px; margin-bottom: 8px;
        padding: 8px 10px; border-radius: 12px;
        background: rgba(15, 157, 118, .08); border: 1px dashed rgba(15, 157, 118, .45);
        font-size: 12.5px; animation: gft-fade-up .2s ease;
}
.gft-pending-att img { width: 42px; height: 42px; border-radius: 9px; object-fit: cover; }
.gft-pending-att .fi {
        width: 42px; height: 42px; border-radius: 9px; background: #fff;
        display: inline-flex; align-items: center; justify-content: center; font-size: 19px;
}
.gft-pending-att .nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; unicode-bidi: plaintext; text-align: start; font-weight: 600; color: #274238; }
.gft-pending-att .sz { color: #6b7f76; font-size: 11px; }
.gft-pending-att .rm {
        width: 26px; height: 26px; border-radius: 50%; border: none; background: rgba(214,69,69,.12);
        color: #c33; cursor: pointer; font-size: 15px; line-height: 1; flex-shrink: 0;
        transition: background .18s, transform .15s;
}
.gft-pending-att .rm:hover { background: rgba(214,69,69,.25); transform: scale(1.08); }
.gft-pending-att.upl { color: #436254; font-weight: 600; }
.gft-panel.gft-dark .gft-pending-att { background: rgba(23, 180, 137, .12); border-color: rgba(23, 180, 137, .4); }
.gft-panel.gft-dark .gft-pending-att .nm { color: #cfe6da; }
.gft-panel.gft-dark .gft-pending-att .fi { background: #1b2a23; }

.gft-w-spin {
        width: 14px; height: 14px; border-radius: 50%; flex-shrink: 0;
        border: 2px solid rgba(15, 157, 118, .25); border-top-color: #0b7a5c;
        animation: gft-w-rot .7s linear infinite;
}
@keyframes gft-w-rot { to { transform: rotate(360deg); } }

.gft-att-wrap { margin-top: 2px; }
.gft-att-img {
        display: block; max-width: min(230px, 100%); max-height: 190px; width: 100%;
        border-radius: 12px; object-fit: cover; cursor: zoom-in;
        transition: transform .18s ease, box-shadow .18s ease;
        box-shadow: 0 3px 10px -4px rgba(0, 0, 0, .25);
}
.gft-att-img:hover { transform: scale(1.02); box-shadow: 0 8px 22px -8px rgba(0, 0, 0, .35); }
.gft-row.me .gft-att-img { border: 2px solid rgba(255, 255, 255, .4); }
.gft-att-file {
        display: inline-flex; align-items: center; gap: 9px; text-decoration: none;
        background: rgba(255, 255, 255, .92); border: 1px solid #e2e9e5; color: #274238;
        padding: 8px 12px; border-radius: 11px; max-width: min(230px, 100%);
        box-shadow: 0 2px 8px -4px rgba(0, 0, 0, .18);
        transition: transform .18s, box-shadow .18s, border-color .18s;
}
.gft-att-file:hover { transform: translateY(-1px); border-color: #0f9d76; box-shadow: 0 6px 16px -6px rgba(15, 157, 118, .35); }
.gft-att-file .ic { font-size: 18px; flex-shrink: 0; }
.gft-att-file .meta { display: flex; flex-direction: column; min-width: 0; }
.gft-att-file .fn { font-size: 12px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; unicode-bidi: plaintext; text-align: start; }
.gft-att-file .fs { font-size: 10.5px; color: #7d8f86; }
.gft-panel.gft-dark .gft-att-file { background: #1b2a23; border-color: #2e4237; color: #dcebe3; }
.gft-panel.gft-dark .gft-att-file .fs { color: #8fa49a; }

#gft-w-lightbox {
        position: fixed; inset: 0; z-index: 2147483000; display: none;
        align-items: center; justify-content: center; padding: 24px;
        background: rgba(8, 14, 11, .9); cursor: zoom-out; backdrop-filter: blur(3px);
}
#gft-w-lightbox.open { display: flex; }
#gft-w-lightbox img {
        max-width: min(94vw, 1000px); max-height: 90vh; border-radius: 12px;
        box-shadow: 0 30px 90px rgba(0, 0, 0, .6); animation: gft-lb-pop .2s cubic-bezier(.2, .9, .3, 1.2);
}
#gft-w-lightbox .gft-w-lb-close {
        position: absolute; top: 16px; left: 16px; width: 40px; height: 40px; border-radius: 50%;
        background: rgba(255, 255, 255, .14); color: #fff; font-size: 22px; line-height: 38px;
        text-align: center; cursor: pointer; transition: background .18s;
}
#gft-w-lightbox .gft-w-lb-close:hover { background: #d64545; }
@keyframes gft-lb-pop { from { transform: scale(.92); opacity: 0; } to { transform: scale(1); opacity: 1; } }

@keyframes gft-fade-up { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

.gft-histbox { border: 1px dashed var(--gft-line, #dce5e0); border-radius: 12px; overflow: hidden; background: rgba(255,255,255,.6); }
.gft-hist-toggle {
        width: 100%; display: flex; align-items: center; justify-content: space-between;
        background: none; border: none; cursor: pointer; padding: 10px 12px;
        font: inherit; font-size: 12.5px; font-weight: 700; color: var(--gft-ink, #1c2b24);
        transition: background .16s;
}
.gft-hist-toggle:hover { background: var(--gft-soft, #f0f5f2); }
.gft-hist-toggle .gft-hist-arrow { transition: transform .2s ease; font-size: 10px; color: var(--gft-muted, #6b7f74); }
.gft-hist-toggle.open .gft-hist-arrow { transform: rotate(180deg); }
.gft-hist-toggle .gft-hist-ic { margin-inline-end: 6px; }
.gft-hist-list { display: none; padding: 4px 8px 8px; max-height: 190px; overflow-y: auto; }
.gft-hist-list.open { display: block; }
.gft-hist-item {
        width: 100%; text-align: right; background: #fff; border: 1px solid var(--gft-line, #e3eae5);
        border-radius: 10px; padding: 8px 10px; margin-top: 6px; cursor: pointer; font: inherit;
        transition: border-color .15s, box-shadow .15s, transform .15s;
        display: flex; align-items: center; gap: 8px;
}
.gft-hist-item:hover { border-color: var(--gft-primary, #0f9d76); box-shadow: 0 4px 12px -6px rgba(15,157,118,.35); transform: translateY(-1px); }
.gft-hist-item .hi-dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 8px; background: #9aa8a0; }
.gft-hist-item .hi-dot.closed { background: #d68f2c; }
.gft-hist-item .hi-main { min-width: 0; flex: 1; }
.gft-hist-item .hi-preview { font-size: 12px; color: var(--gft-ink, #1c2b24); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gft-hist-item .hi-meta { font-size: 10.5px; color: var(--gft-muted, #6b7f74); margin-top: 2px; display: flex; gap: 8px; align-items: center; }
.gft-hist-item .hi-stars { color: #f5b301; font-size: 10px; letter-spacing: 1px; }
.gft-hist-item .hi-arrow { color: var(--gft-muted, #6b7f74); font-size: 13px; }
.gft-hist-empty { padding: 10px 6px 6px; font-size: 11.5px; color: var(--gft-muted, #6b7f74); text-align: center; }
.gft-hist-loading { padding: 14px; text-align: center; font-size: 11.5px; color: var(--gft-muted, #6b7f74); }
.gft-hist-loading .gft-w-spin { display: inline-block; }

.gft-history-view { display: none; flex-direction: column; position: absolute; inset: 0; background: var(--gft-bg, #f6faf8); z-index: 5; animation: gft-fade-up .22s ease; }
.gft-history-view.open { display: flex; }
.gft-hv-head {
        display: flex; align-items: center; justify-content: space-between; gap: 8px;
        padding: 10px 12px; background: #fff; border-bottom: 1px solid var(--gft-line, #e3eae5);
}
.gft-hv-title { font-size: 12.5px; font-weight: 800; color: var(--gft-ink, #1c2b24); display: flex; align-items: center; gap: 6px; }
.gft-hv-date { font-size: 10.5px; color: var(--gft-muted, #6b7f74); font-weight: 400; }
.gft-hv-back {
        border: 1px solid var(--gft-line, #e3eae5); background: #fff; border-radius: 8px;
        padding: 5px 12px; font: inherit; font-size: 11.5px; font-weight: 700; cursor: pointer;
        color: var(--gft-ink, #1c2b24); transition: background .15s, border-color .15s;
}
.gft-hv-back:hover { background: var(--gft-soft, #f0f5f2); border-color: var(--gft-primary, #0f9d76); }
.gft-hv-body { flex: 1; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.gft-hv-banner {
        margin: 0 12px 8px; padding: 7px 10px; border-radius: 8px; font-size: 11px;
        background: #fdf3e3; color: #8a6116; border: 1px solid #f0dfb8; text-align: center;
}
.gft-body.hist-mode > *:not(.gft-history-view) { display: none !important; }
.gft-body.hist-mode .gft-history-view { display: flex; }
.gft-histbox-inline { margin-top: 4px; border-style: solid; background: #fff; }

.gft-faqbox {
        border: 1px dashed var(--gft-line, #dce5e0);
        border-radius: 12px;
        overflow: hidden;
        background: var(--gft-bg, rgba(255,255,255,.6));
        flex-shrink: 0;
}
.gft-faq-list {
        display: none;
        padding: 4px 8px 8px;
        max-height: 190px;
        overflow-y: auto;
        flex-direction: column;
        gap: 6px;
}
.gft-faq-list.open { display: flex; }
.gft-faq-list .gft-chip { border-radius: 12px; padding: 8px 12px; }
.gft-faq-list .gft-chip:hover { transform: none; }

#gft-root .gft-btn:focus-visible,
#gft-root .gft-chip:focus-visible,
#gft-root .gft-attach:focus-visible,
#gft-root .gft-lb:focus-visible,
#gft-root .gft-hist-toggle:focus-visible,
.gft-panel textarea:focus-visible,
.gft-panel input:focus-visible,
.gft-panel button:focus-visible {
        outline: 2px solid var(--gft-primary);
        outline-offset: 2px;
        border-radius: 8px;
}

.gft-body::-webkit-scrollbar-track { background: transparent; }
.gft-panel .gft-hist-list::-webkit-scrollbar,
.gft-panel .gft-hist-view-body::-webkit-scrollbar { width: 6px; }
.gft-panel .gft-hist-list::-webkit-scrollbar-thumb,
.gft-panel .gft-hist-view-body::-webkit-scrollbar-thumb { background: rgba(125,140,133,.3); border-radius: 99px; }
.gft-panel .gft-hist-list::-webkit-scrollbar-thumb:hover,
.gft-panel .gft-hist-view-body::-webkit-scrollbar-thumb:hover { background: rgba(125,140,133,.55); }
#gft-root.gft-dark .gft-hist-list::-webkit-scrollbar-thumb,
#gft-root.gft-dark .gft-faq-list::-webkit-scrollbar-thumb,
#gft-root.gft-dark .gft-hist-view-body::-webkit-scrollbar-thumb { background: rgba(255,255,255,.14); }

#gft-launcher { transition: transform .22s cubic-bezier(.34,1.56,.64,1), box-shadow .22s ease; }
#gft-launcher:hover { transform: translateY(-3px) scale(1.04); }
#gft-launcher:active { transform: translateY(-1px) scale(.98); }

@keyframes gft-msg-in { from { opacity: 0; transform: translateY(6px) scale(.98); } to { opacity: 1; transform: none; } }
.gft-row .gft-bubble { animation: gft-msg-in .28s ease both; }
@media (prefers-reduced-motion: reduce) {
        .gft-row .gft-bubble { animation: none; }
        #gft-launcher { transition: none; }
}

.gft-panel .gft-chip { position: relative; overflow: hidden; }
.gft-panel .gft-chip::after {
        content: ''; position: absolute; top: 0; bottom: 0; width: 40%;
        inset-inline-start: -60%; transform: skewX(-18deg);
        background: linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent);
        transition: inset-inline-start .5s ease;
}
.gft-panel .gft-chip:hover::after { inset-inline-start: 120%; }

#gft-root .gft-launcher .gft-online-dot.off { background: #f0a13c; animation: none; box-shadow: 0 0 0 3px rgba(240,161,60,.22); }

.gft-agent-status.off { color: #c77f22; }
.gft-agent-status .st-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #9aa89f; margin-inline-end: 6px; vertical-align: 1px; }
.gft-agent-status.on .st-dot { background: #2fd780; }
.gft-agent-status.off .st-dot { background: #f0a13c; }

.gft-greeting.gft-greeting-off { border-inline-start: 3px solid #f0a13c; }

.gft-offline-card {
        background: linear-gradient(160deg, #fff8ec, #fffdf8);
        border: 1px solid #f3ddb7;
        border-radius: 14px;
        padding: 12px;
        display: flex; flex-direction: column; gap: 10px;
        box-shadow: 0 4px 14px rgba(197, 138, 42, .08);
}
.gft-off-banner { display: flex; gap: 10px; align-items: flex-start; }
.gft-ob-ic {
        width: 38px; height: 38px; flex: 0 0 38px; border-radius: 12px;
        display: flex; align-items: center; justify-content: center;
        background: linear-gradient(135deg, #f7b34c, #e08b1f);
        color: #fff; font-size: 19px;
        box-shadow: 0 3px 8px rgba(224,139,31,.35);
}
.gft-ob-t { font-weight: 800; font-size: 13px; color: #7a5310; }
.gft-ob-s { font-size: 11.5px; color: #a07c3c; line-height: 1.7; margin-top: 2px; }
.gft-ob-s b { color: #7a5310; }

.gft-off-sched {
        display: flex; justify-content: space-between; align-items: center;
        width: 100%; border: 1px dashed #e3c68f;
        background: rgba(255,255,255,.65); border-radius: 10px;
        padding: 8px 12px; font-size: 12px; font-weight: 700; color: #7a5310; cursor: pointer;
        transition: background .15s ease;
}
.gft-off-sched:hover { background: #fff; }
.gft-off-sched .gft-os-arrow { transition: transform .2s ease; font-size: 10px; }
.gft-off-sched.open .gft-os-arrow { transform: rotate(180deg); }
.gft-off-days { display: none; flex-direction: column; gap: 2px; }
.gft-off-days.open { display: flex; animation: gft-off-days-in .2s ease; }
@keyframes gft-off-days-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.gft-off-day {
        display: flex; justify-content: space-between; align-items: center;
        padding: 6px 10px; border-radius: 8px; font-size: 11.5px; color: #6d5a35;
}
.gft-off-day:nth-child(odd) { background: rgba(255,255,255,.55); }
.gft-off-day.today { background: #fdf0d7; border: 1px solid #ecd39e; font-weight: 700; color: #6b4a0e; }
.gft-off-day.closed .gft-od-time { color: #c79a5b; }
.gft-od-badge {
        font-style: normal; font-size: 9.5px; background: #e08b1f; color: #fff;
        border-radius: 20px; padding: 1px 7px; margin-inline-start: 4px; vertical-align: 1px;
}

.gft-off-form { display: flex; flex-direction: column; gap: 8px; }
.gft-of-title { font-size: 12px; font-weight: 800; color: #7a5310; }
.gft-off-input {
        width: 100%; border: 1px solid #ecd8b4; border-radius: 10px;
        background: #fff; padding: 9px 12px; font-size: 12.5px; color: var(--gft-ink, #212b26);
        font-family: inherit; transition: border-color .15s ease, box-shadow .15s ease;
        box-sizing: border-box; text-align: right;
}
.gft-off-input:focus { outline: none; border-color: #e0a13c; box-shadow: 0 0 0 3px rgba(240,161,60,.16); }
.gft-off-input.gft-off-msg { resize: vertical; min-height: 64px; line-height: 1.7; }
.gft-off-send {
        display: flex; align-items: center; justify-content: center; gap: 8px;
        border: none; border-radius: 10px; padding: 10px 14px; cursor: pointer;
        background: linear-gradient(135deg, #f2a94a, #dd8a20);
        color: #fff; font-weight: 800; font-size: 13px; font-family: inherit;
        box-shadow: 0 4px 10px rgba(221,138,32,.32);
        transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.gft-off-send:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 6px 14px rgba(221,138,32,.4); filter: brightness(1.04); }
.gft-off-send:disabled { opacity: .7; cursor: wait; }

.gft-off-success { text-align: center; padding: 12px 8px; animation: gft-off-days-in .25s ease; }
.gft-ofs-ic { font-size: 26px; margin-bottom: 4px; }
.gft-ofs-t { font-weight: 800; font-size: 12.5px; color: #2c7a4b; }
.gft-ofs-s { font-size: 11.5px; color: #8a9a92; margin-top: 4px; line-height: 1.8; }
.gft-off-error {
        font-size: 11.5px; color: #b3402f; background: #fdefec;
        border: 1px solid #f3cdc5; border-radius: 8px; padding: 7px 10px;
}

#gft-root.gft-dark .gft-offline-card {
        background: linear-gradient(160deg, #332a1c, #2c2519);
        border-color: #5a4728;
        box-shadow: none;
}
#gft-root.gft-dark .gft-ob-t { color: #f2c477; }
#gft-root.gft-dark .gft-ob-s { color: #bfa06a; }
#gft-root.gft-dark .gft-ob-s b { color: #f2c477; }
#gft-root.gft-dark .gft-off-sched { background: rgba(255,255,255,.04); border-color: #5a4728; color: #f2c477; }
#gft-root.gft-dark .gft-off-sched:hover { background: rgba(255,255,255,.08); }
#gft-root.gft-dark .gft-off-day { color: #c9b184; }
#gft-root.gft-dark .gft-off-day:nth-child(odd) { background: rgba(255,255,255,.03); }
#gft-root.gft-dark .gft-off-day.today { background: #45361d; border-color: #6b5330; color: #f4d191; }
#gft-root.gft-dark .gft-of-title { color: #f2c477; }
#gft-root.gft-dark .gft-off-input { background: #232019; border-color: #514531; color: #e8eeea; }
#gft-root.gft-dark .gft-off-input:focus { border-color: #c98a2e; box-shadow: 0 0 0 3px rgba(201,138,46,.18); }
#gft-root.gft-dark .gft-off-error { background: #3a221c; border-color: #6a3a2f; color: #f0a08c; }

.gft-footer { position: relative; } 

.gft-w-emoji {
        flex-shrink: 0; width: 38px; height: 38px; border-radius: 10px;
        border: none; background: transparent; color: #6b7f76; cursor: pointer;
        display: inline-flex; align-items: center; justify-content: center;
        font-size: 19px; line-height: 1; padding: 0;
        transition: background .18s ease, color .18s ease, transform .15s ease;
}
.gft-w-emoji:hover { background: rgba(15, 157, 118, .12); color: #0b7a5c; transform: translateY(-1px); }
.gft-w-emoji:active { transform: scale(.94); }
.gft-w-emoji.active { background: rgba(15, 157, 118, .16); color: #0b7a5c; }
#gft-root.gft-dark .gft-w-emoji { color: #93a89e; }
#gft-root.gft-dark .gft-w-emoji:hover,
#gft-root.gft-dark .gft-w-emoji.active { background: rgba(23, 180, 137, .18); color: #4cd3a9; }

.gft-emoji-pop {
        position: absolute;
        bottom: calc(100% - 8px);
        inset-inline-start: 10px;
        z-index: 30;
        width: min(356px, calc(100% - 20px));
        max-height: min(320px, 52vh);
        overflow-y: auto;
        background: var(--gft-bg);
        border: 1px solid var(--gft-line);
        border-radius: 14px;
        box-shadow: 0 18px 42px -14px rgba(10, 30, 22, .38);
        padding: 10px 10px 8px;
        display: flex;
        flex-direction: column;
        gap: 7px;
        animation: gft-ep-in .12s ease;
}
.gft-emoji-pop[hidden] { display: none !important; } 
.gft-emoji-pop::-webkit-scrollbar { width: 6px; }
.gft-emoji-pop::-webkit-scrollbar-thumb { background: rgba(125, 140, 133, .3); border-radius: 99px; }

.gft-ep-label {
        font-size: 10px;
        font-weight: 800;
        color: var(--gft-muted);
        padding: 1px 4px 0;
        letter-spacing: .2px;
}
.gft-ep-grid { display: grid; grid-template-columns: repeat(10, 1fr); gap: 2px; }
.gft-ep-btn {
        width: 100%;
        aspect-ratio: 1 / 1;
        min-height: 32px;
        border: none;
        background: transparent;
        border-radius: 9px;
        font-size: 18px;
        line-height: 1;
        cursor: pointer;
        padding: 0;
        transition: background .15s ease, transform .12s ease;
}
.gft-ep-btn:hover { background: var(--gft-panel-bg); transform: scale(1.22); }
.gft-ep-btn:active { transform: scale(.95); }

#gft-root.gft-dark .gft-emoji-pop {
        box-shadow: 0 18px 42px -14px rgba(0, 0, 0, .65);
}
#gft-root.gft-dark .gft-ep-btn:hover { background: rgba(255, 255, 255, .07); }
#gft-root.gft-dark .gft-emoji-pop::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .14); }

@media (max-width: 480px) {
        .gft-emoji-pop { width: calc(100% - 20px); }
        .gft-ep-grid { grid-template-columns: repeat(5, 1fr); }
}

@keyframes gft-ep-in {
        from { opacity: 0; transform: translateY(6px) scale(.96); }
        to { opacity: 1; transform: none; }
}

.gft-launcher.has-unread { animation: gft-halo 2.2s ease-out infinite; }
@keyframes gft-halo {
        0%   { box-shadow: 0 10px 28px -8px rgba(0, 0, 0, .38), 0 0 0 0 rgba(255, 77, 79, .45); }
        70%  { box-shadow: 0 10px 28px -8px rgba(0, 0, 0, .38), 0 0 0 16px rgba(255, 77, 79, 0); }
        100% { box-shadow: 0 10px 28px -8px rgba(0, 0, 0, .38), 0 0 0 0 rgba(255, 77, 79, 0); }
}

.gft-panel .gft-input-row { border-radius: 14px; transition: box-shadow .25s ease; }
.gft-panel .gft-input-row:focus-within { box-shadow: 0 0 0 3px rgba(15, 157, 118, .10); }
.gft-panel .gft-textarea::placeholder { color: #9fb0a6; opacity: 1; transition: color .2s ease; }
.gft-panel .gft-textarea:focus::placeholder { color: #c3cfc8; }
#gft-root.gft-dark .gft-textarea::placeholder { color: #71837a; }
#gft-root.gft-dark .gft-textarea:focus::placeholder { color: #5a6b62; }

#gft-root .gft-row.me .gft-bubble { border-radius: 16px 16px 16px 4px; }
#gft-root .gft-row.them .gft-bubble { border-radius: 16px 16px 4px 16px; }

.gft-launcher:focus-visible { outline: 3px solid rgba(15, 157, 118, .55); outline-offset: 3px; }
.gft-emoji-pop .gft-ep-btn:focus-visible,
.gft-panel .gft-w-emoji:focus-visible { outline: 2px solid var(--gft-primary); outline-offset: 1px; border-radius: 9px; }

@media (prefers-reduced-motion: reduce) {
        .gft-emoji-pop { animation: none; }
        .gft-launcher.has-unread { animation: none; }
        .gft-ep-btn, .gft-w-emoji { transition: none; }
}

.gft-dnd-overlay {
        position: absolute;
        inset: 0;
        z-index: 60;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 12px; 
        background: rgba(247, 252, 250, .80);
        backdrop-filter: blur(2.5px);
        -webkit-backdrop-filter: blur(2.5px);
        opacity: 0;
        visibility: hidden;
        transform: scale(.985);
        pointer-events: none; 
        transition: opacity .14s ease, transform .14s ease, visibility 0s linear .14s;
}
.gft-dnd-overlay.show {
        opacity: 1;
        visibility: visible;
        transform: none;
        transition-delay: 0s;
}

.gft-dnd-box {
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        text-align: center;
        padding: 16px;
        border: 2px dashed rgba(15, 157, 118, .55);
        border-radius: calc(var(--gft-radius, 16px) - 8px);
        background: rgba(15, 157, 118, .06);
        animation: gft-dnd-pulse 1.8s ease-in-out infinite;
}
.gft-dnd-ic {
        width: 52px;
        height: 52px;
        color: var(--gft-primary);
        margin-bottom: 4px;
}
.gft-dnd-t {
        font-size: 15px;
        font-weight: 800;
        color: var(--gft-ink);
}
.gft-dnd-s {
        font-size: 11.5px;
        color: var(--gft-muted);
}

@keyframes gft-dnd-pulse {
        0%, 100% { border-color: rgba(15, 157, 118, .45); background: rgba(15, 157, 118, .05); }
        50%      { border-color: rgba(15, 157, 118, .90); background: rgba(15, 157, 118, .11); }
}

#gft-root.gft-dark .gft-dnd-overlay { background: rgba(13, 18, 15, .82); }
#gft-root.gft-dark .gft-dnd-box {
        border-color: rgba(76, 211, 169, .55);
        background: rgba(23, 180, 137, .09);
        animation-name: gft-dnd-pulse-dark;
}
#gft-root.gft-dark .gft-dnd-ic { color: #4cd3a9; }
#gft-root.gft-dark .gft-dnd-t { color: #dcebe3; }
#gft-root.gft-dark .gft-dnd-s { color: #8fa49a; }

@keyframes gft-dnd-pulse-dark {
        0%, 100% { border-color: rgba(76, 211, 169, .40); background: rgba(23, 180, 137, .07); }
        50%      { border-color: rgba(76, 211, 169, .85); background: rgba(23, 180, 137, .14); }
}

@media (prefers-reduced-motion: reduce) {
        .gft-dnd-overlay { transition: none; }
        .gft-dnd-box { animation: none; }
}