/* ── THU NHỎ TOÀN BỘ GIAO DIỆN DESKTOP XUỐNG 90% ── */
@media (min-width: 1024px) {
    body {
        zoom: 0.9;
        width: 111.11vw !important;  /* Tăng chiều rộng để bù lại phần bị thu nhỏ */
        height: 111.11vh !important; /* Tăng chiều cao để bù lại phần bị thu nhỏ */
        margin: 0 !important;
    }
    
    html {
        background-color: #000000;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }
}
:root { --ease-ios: cubic-bezier(0.25, 0.1, 0.25, 1); --glass-bg: rgba(24, 24, 27, 0.55); --glass-border: rgba(255, 255, 255, 0.05); }
html, body { 
    margin: 0; padding: 0; 
    width: 100%; max-width: 100%; 
    height: 100%; 
    overflow: hidden; 
    overflow-x: hidden !important; /* Cấm tuyệt đối trượt ngang */
    -webkit-font-smoothing: antialiased; 
    overscroll-behavior: none; 
    touch-action: manipulation; /* Chặn hoàn toàn lỗi chạm đúp phóng to (Double-tap zoom) trên iPhone */
}
body { 
    background-color: #000000; color: #f2f2f7; 
    -webkit-user-select: none; user-select: none; 
    position: fixed; inset: 0; 
    width: 100%; /* Đổi từ 100vw thành 100% để chống tràn mép */
    height: 100dvh; 
}
input, textarea { -webkit-user-select: text; user-select: text; }
::-webkit-scrollbar { width: 4px; } ::-webkit-scrollbar-track { background: transparent; margin: 4px; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.2); border-radius: 10px; transition: background 0.3s; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.4); }
.glass-panel { background: var(--glass-bg); backdrop-filter: blur(50px); -webkit-backdrop-filter: blur(50px); border-right: 1px solid var(--glass-border); box-shadow: 10px 0 40px rgba(0,0,0,0.5); }
.ios-card { background: rgba(30, 30, 32, 0.5); backdrop-filter: blur(20px); border: 1px solid var(--glass-border); border-radius: 20px; overflow: hidden; transition: all 0.3s var(--ease-ios); }
.pro-input { background: rgba(0, 0, 0, 0.3); border: 1px solid rgba(255, 255, 255, 0.06); color: #fff; transition: all 0.3s var(--ease-ios); font-size: 13px; font-weight: 500; border-radius: 12px; padding: 12px 16px; box-shadow: inset 0 2px 6px rgba(0,0,0,0.15); }
.pro-input:focus { background: rgba(0, 0, 0, 0.5); border-color: #0A84FF; outline: none; box-shadow: 0 0 0 3px rgba(10, 132, 255, 0.2), inset 0 2px 6px rgba(0,0,0,0.15); }
select.pro-input { padding-top: 12px; padding-bottom: 12px; -webkit-appearance: none; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E"); background-position: right 0.75rem center; background-repeat: no-repeat; background-size: 1.2em 1.2em; }
select option { background-color: #1c1c1e; color: #fff; padding: 14px; } select optgroup { background-color: #000; color: #8E8E93; font-weight: 700; }
.module-group { background: rgba(30, 30, 32, 0.45); border-radius: 20px; margin-bottom: 16px; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.06); box-shadow: 0 4px 20px -5px rgba(0,0,0,0.4); backdrop-filter: blur(25px); transition: all 0.4s var(--ease-ios); }
.module-group:hover { background: rgba(40, 40, 42, 0.55); border-color: rgba(255, 255, 255, 0.12); }
.module-header { background: transparent; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; width: 100%; }
.module-header:active { background: rgba(255, 255, 255, 0.04); }
.module-content { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.4s var(--ease-ios), opacity 0.4s ease; opacity: 0; }
.module-content.open { grid-template-rows: 1fr; opacity: 1; }
.module-content.open .module-inner { padding: 8px 20px 20px 20px; border-top: 1px solid rgba(255,255,255,0.03); }
.module-inner { min-height: 0; overflow: hidden; }
.chk-pro { appearance: none; width: 24px; height: 24px; border-radius: 6px; border: 1.5px solid rgba(142, 142, 147, 0.4); background: rgba(0,0,0,0.2); display: grid; place-content: center; cursor: pointer; transition: all 0.3s var(--ease-ios); box-shadow: inset 0 2px 4px rgba(0,0,0,0.1); }
.chk-pro::before { content: ""; width: 12px; height: 12px; transform: scale(0); background: #fff; border-radius: 3px; transition: transform 0.3s var(--ease-ios); box-shadow: 0 1px 3px rgba(0,0,0,0.3); }
.chk-pro:checked::before { transform: scale(1); }
.chk-pro:checked { border-color: #0A84FF; background: #0A84FF; box-shadow: 0 0 10px rgba(10, 132, 255, 0.3); }
.chk-gold:checked { border-color: #FFD60A; background: #FFD60A; box-shadow: 0 0 10px rgba(255, 214, 10, 0.3); }
.chk-red:checked { border-color: #FF453A; background: #FF453A; box-shadow: 0 0 10px rgba(255, 69, 58, 0.3); }
input[type=range] { -webkit-appearance: none; background: transparent; }
input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; height: 24px; width: 24px; border-radius: 50%; background: #ffffff; cursor: pointer; margin-top: -10px; box-shadow: 0 2px 8px rgba(0,0,0,0.4); transition: transform 0.2s var(--ease-ios); }
input[type=range]::-webkit-slider-thumb:active { transform: scale(1.15); }
input[type=range]::-webkit-slider-runnable-track { width: 100%; height: 5px; cursor: pointer; background: rgba(255,255,255,0.15); border-radius: 3px; box-shadow: inset 0 1px 2px rgba(0,0,0,0.2); }
.slider-red::-webkit-slider-thumb { background: #FF453A; } .slider-flux::-webkit-slider-thumb { background: #BF5AF2; } .slider-cyan::-webkit-slider-thumb { background: #64D2FF; box-shadow: 0 0 10px rgba(100, 210, 255, 0.4); }
.modal-fade-in { animation: modalFadeIn 0.4s var(--ease-ios); }
@keyframes modalFadeIn { from { opacity: 0; transform: scale(0.95); filter: blur(15px); } to { opacity: 1; transform: scale(1); filter: blur(0); } }
.shimmer-text { background: linear-gradient(90deg, #8E8E93 0%, #fff 50%, #8E8E93 100%); background-size: 200% auto; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shine 3s linear infinite; }
@keyframes shine { to { background-position: 200% center; } }
.mobile-image-frame { border: 1px solid rgba(255, 255, 255, 0.05); box-shadow: 0 30px 70px -15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(255,255,255,0.03); background: #000; border-radius: 32px; overflow: hidden; width: auto; height: auto; max-width: 95vw; max-height: 65vh; display: flex; align-items: center; justify-content: center; margin: 0 auto; position: relative; }
#img-original, #img-modified { display: block; max-width: 100%; max-height: 65vh; object-fit: contain; width: auto; height: auto; }
#img-modified-wrapper { 
    position: absolute; 
    top: 0; left: 0; 
    height: 100%; 
    width: 50%; 
    overflow: hidden; 
    z-index: 10; 
    box-shadow: 1px 0 15px rgba(0,0,0,0.2);
}
.comp-label { position: absolute; bottom: 16px; padding: 6px 14px; background: rgba(28, 28, 30, 0.6); color: white; font-size: 11px; font-weight: 700; letter-spacing: 0.5px; border-radius: 20px; pointer-events: none; z-index: 25; backdrop-filter: blur(15px); border: 1px solid rgba(255,255,255,0.15); box-shadow: 0 4px 10px rgba(0,0,0,0.3); display: none !important; }
.comp-label.before { right: 16px; } .comp-label.after { left: 16px; } 
.btn-iso-glass { background: rgba(255,255,255,0.05); backdrop-filter: blur(25px); border: 1px solid rgba(255,255,255,0.08); color: rgba(255,255,255,0.9); border-radius: 16px; font-weight: 600; transition: all 0.3s var(--ease-ios); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.btn-iso-glass:hover { background: rgba(255,255,255,0.1); color: #fff; } .btn-iso-glass:active { transform: scale(0.96); background: rgba(255,255,255,0.08); }
.scan-tag { display: inline-flex; align-items: center; padding: 2px 6px; margin: 0 2px; color: #fff; font-size: 9px; font-weight: 600; font-family: monospace; opacity: 0; animation: pop-in 0.3s forwards; white-space: nowrap; }
.scan-tag.highlight { color: #FFD60A; text-shadow: 0 0 5px rgba(255, 214, 10, 0.5); }
.sequential-log-text { 
    display: block; 
    font-family: 'JetBrains Mono', monospace; 
    font-size: 11px; 
    font-weight: 700; 
    color: #0A84FF; 
    text-shadow: 0 0 10px rgba(10, 132, 255, 0.6); 
    white-space: nowrap; 
    background: rgba(0,0,0,0.65); 
    backdrop-filter: blur(4px); 
    padding: 5px 12px; 
    border-radius: 6px; 
    border-left: 3px solid #0A84FF; 
    animation: pop-in 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) forwards; 
    transform-origin: bottom center; 
}
.sequential-log-text::before { content: ">> "; opacity: 0.7; }
.mask-linear-fade { mask-image: linear-gradient(to right, black 80%, transparent 100%); -webkit-mask-image: linear-gradient(to right, black 80%, transparent 100%); }
@keyframes spinRing { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.loader-ring { border: 3px solid rgba(10, 132, 255, 0.1); border-top: 3px solid #0A84FF; border-radius: 50%; width: 60px; height: 60px; animation: spinRing 1s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite; }
.loader-ring-inner { border: 3px solid rgba(255, 214, 10, 0.1); border-bottom: 3px solid #FFD60A; border-radius: 50%; width: 40px; height: 40px; animation: spinRing 1.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite reverse; }
.glass-dropzone { background: transparent !important; backdrop-filter: none !important; border: none !important; border-radius: 44px; box-shadow: none !important; transition: all 0.5s cubic-bezier(0.25, 0.1, 0.25, 1); }
.glass-dropzone:hover { background: rgba(255, 255, 255, 0.03) !important; border: none !important; transform: scale(1.01) translateY(-2px); box-shadow: none !important; }
.history-item { width: 48px; height: 48px; border-radius: 12px; border: 1px solid rgba(255,255,255,0.1); background-size: cover; background-position: center; cursor: pointer; transition: all 0.3s var(--ease-ios); position: relative; box-shadow: 0 4px 10px rgba(0,0,0,0.3); }
.history-item:hover { transform: scale(1.1) translateY(-2px); border-color: #0A84FF; z-index: 10; box-shadow: 0 8px 15px rgba(10, 132, 255, 0.3); }
.history-dl-btn { position: absolute; bottom: -4px; right: -4px; width: 18px; height: 18px; background: #0A84FF; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; font-size: 9px; border: 1.5px solid #1c1c1e; box-shadow: 0 2px 5px rgba(0,0,0,0.5); transition: all 0.3s var(--ease-ios); opacity: 0; transform: scale(0.8); }
.history-item:hover .history-dl-btn { opacity: 1; transform: scale(1); }
@keyframes flashRed { 0%, 100% { background-color: rgba(28, 28, 30, 0.8); box-shadow: 0 0 0 rgba(255, 69, 58, 0); } 50% { background-color: rgba(255, 69, 58, 0.3); box-shadow: 0 0 25px rgba(255, 69, 58, 0.5); border-color: rgba(255, 69, 58, 0.8); } }
@keyframes bellPop { 0%, 100% { opacity: 1; box-shadow: 0 0 6px rgba(255,69,58,0.4); } 50% { opacity: 0.75; box-shadow: 0 0 18px rgba(255,69,58,0.8); } }
.flash-action-btn { animation: flashRed 1.5s var(--ease-ios) infinite; border-color: #FF453A !important; color: #FF453A !important; }
.qr-scanner-line { position: absolute; left: 0; width: 100%; height: 2px; background: #0A84FF; box-shadow: 0 0 10px #0A84FF, 0 0 20px #0A84FF; animation: qr-scan 2.5s ease-in-out infinite; pointer-events: none; z-index: 10; }
@media (max-width: 768px) { .mobile-image-frame { max-height: 48vh !important; max-width: 90vw !important; } #img-original, #img-modified { max-height: 48vh !important; } }
.guide-content-box img { width: 100% !important; max-width: 100% !important; height: auto !important; border-radius: 16px; margin: 16px 0 !important; display: block; object-fit: contain; }
.guide-content-box iframe { width: 100% !important; border-radius: 16px; aspect-ratio: 16/9; margin: 16px 0 !important; }
.guide-content-box p { margin-bottom: 12px; } .guide-content-box h1, .guide-content-box h2, .guide-content-box h3 { color: white; margin-top: 16px; margin-bottom: 8px; font-weight: bold; }

/* ═══════════════════════════════════════════════════════
   DESKTOP UPGRADE V2 — PROFESSIONAL PC LAYOUT
   ═══════════════════════════════════════════════════════ */

/* ── Desktop sidebar resize helper ── */
@media (min-width: 1024px) and (max-width: 1280px) {
    #sidebar { width: 240px !important; }
}
@media (min-width: 1280px) {
    #sidebar { width: 260px !important; }
}
@media (min-width: 1600px) {
    #sidebar { width: 280px !important; }
}

@media (min-width: 1024px) {

    /* ── BACKGROUND desktop — tinh tế hơn ── */
    .fixed.inset-0.bg-\[\#000\] {
        background:
            radial-gradient(ellipse 70% 55% at 15% 60%, rgba(10,132,255,0.055) 0%, transparent 55%),
            radial-gradient(ellipse 50% 70% at 85% 20%, rgba(191,90,242,0.035) 0%, transparent 50%),
            radial-gradient(ellipse 40% 40% at 50% 90%, rgba(48,209,88,0.02) 0%, transparent 50%),
            #000 !important;
    }

    /* ── SIDEBAR: viền sáng bên phải, glassy ── */
    #sidebar {
        border: none !important;
        box-shadow: none !important; /* Xóa hiệu ứng đổ bóng viền */
        background: transparent !important; /* Xóa nền đen mờ */
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    /* Đường glow ở đầu sidebar */
    #sidebar::before {
        display: none; /* Thêm dòng này để ẩn hoàn toàn viền sáng */
    }

    /* ── TOP BAR: cao hơn, tinh tế hơn ── */
    #desktop-top-bar {
        height: 59px !important;
        background: rgba(8,8,11,0.88) !important;
        border-bottom: none !important;
        backdrop-filter: blur(40px) !important;
        -webkit-backdrop-filter: blur(40px) !important;
        padding: 15px 28px 0 28px !important; 
        box-shadow: 0 4px 20px rgba(0,0,0,0.15) !important;
    }

    /* ── SIDEBAR HEADER: rõ ràng, đẹp hơn ── */
    #sidebar > div:nth-child(2) {
        height: 75px !important; 
        padding: 15px 20px 0 20px !important; 
        border-bottom: none !important;
        background: transparent !important; 
        box-shadow: none !important; 
    }

    /* ── INPUT & SELECT: cân bằng tốt cho PC ── */
    #sidebar .pro-input {
        font-size: 12px !important;
        padding: 10px 13px !important;
        border-radius: 10px !important;
    }
    #sidebar select.pro-input {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    /* ── MODULE groups: compact nhưng thoáng ── */
    #sidebar .module-group {
        margin-bottom: 10px !important;
        border-radius: 14px !important;
        background: transparent !important; /* Xóa nền mờ để tiệp với nền đen */
        border: none !important; /* Bỏ hoàn toàn viền */
        box-shadow: none !important; /* Bỏ hiệu ứng bóng đổ */
    }
    #sidebar .module-group:hover {
        border: none !important;
        background: rgba(255, 255, 255, 0.03) !important; /* Cảm ứng hover cực nhẹ chuẩn iOS */
    }
    #sidebar .module-header {
        padding: 11px 15px !important;
    }
    #sidebar .module-content.open .module-inner {
        padding: 4px 15px 15px 15px !important;
        border-top: 1px solid rgba(255,255,255,0.04) !important;
    }

    /* ── SPACING: giảm đủ dùng, không bị rỗng ── */
    #sidebar .p-4  { padding: 0.7rem !important; }
    #sidebar .p-3  { padding: 0.55rem !important; }
    #sidebar .py-4 { padding-top: 0.7rem !important; padding-bottom: 0.7rem !important; }
    #sidebar .py-3 { padding-top: 0.55rem !important; padding-bottom: 0.55rem !important; }
    #sidebar .mb-4 { margin-bottom: 0.7rem !important; }
    #sidebar .mb-3 { margin-bottom: 0.45rem !important; }
    #sidebar .mt-4 { margin-top: 0.7rem !important; }
    #sidebar .mt-3 { margin-top: 0.45rem !important; }
    #sidebar .gap-4 { gap: 0.7rem !important; }
    #sidebar .gap-3 { gap: 0.5rem !important; }

    /* ── CHK-PRO, SLIDERS, ICONS ── */
    #sidebar .chk-pro { width: 20px !important; height: 20px !important; border-radius: 5px !important; }
    #sidebar .chk-pro::before { width: 10px !important; height: 10px !important; }
    #sidebar input[type=range]::-webkit-slider-thumb { height: 20px !important; width: 20px !important; margin-top: -7px !important; }
    #sidebar svg.w-5.h-5 { width: 1.05rem !important; height: 1.05rem !important; }
    #sidebar svg.w-4.h-4 { width: 0.875rem !important; height: 0.875rem !important; }

    /* ── TYPOGRAPHY: dễ đọc, không quá nhỏ ── */
    #sidebar .text-\[13px\]    { font-size: 12px !important; }
    #sidebar .text-\[12\.5px\] { font-size: 11.5px !important; }
    #sidebar .text-\[12px\]    { font-size: 11.5px !important; }
    #sidebar .text-\[11px\]    { font-size: 10.5px !important; }
    #sidebar .text-\[10\.5px\] { font-size: 10px !important; }
    #sidebar .text-\[10px\]    { font-size: 9.5px !important; }
    #sidebar .text-xs          { font-size: 0.72rem !important; }

    /* ── BORDER RADIUS: desktop app-style ── */
    #sidebar .rounded-\[20px\] { border-radius: 14px !important; }
    #sidebar .rounded-\[16px\] { border-radius: 11px !important; }
    #sidebar .rounded-xl       { border-radius: 9px !important; }

    /* ── FOOTER ACTIONS: better desktop feel ── */
    #sidebar > div:last-child {
        padding: 14px 16px !important;
        background: rgba(8,8,11,0.7) !important;
        border-top: 1px solid rgba(255,255,255,0.07) !important;
        backdrop-filter: blur(30px) !important;
    }
    #process-image {
        border-radius: 14px !important;
        padding: 13px 20px !important;
        font-size: 13px !important;
        letter-spacing: 0.12em !important;
        box-shadow: 0 8px 25px rgba(255,255,255,0.12), 0 2px 6px rgba(0,0,0,0.3) !important;
    }
    #reset-button {
        border-radius: 11px !important;
        padding: 10px 20px !important;
        font-size: 11px !important;
    }
    
    /* Bỏ đường kẻ ngang bên trong khi mở rộng Module */
    #sidebar .module-content.open .module-inner {
        border-top: none !important;
    }

    /* Xóa viền Box thông báo & nút tải ảnh */
    #system-notification-box {
        border: none !important;
        background: #232a2e !important;
        box-shadow: 0 4px 15px rgba(0,0,0,0.2) !important;
    }

    #sidebar button[onclick*="image-upload"] {
        border: none !important;
        background: rgba(255, 255, 255, 0.025) !important;
        box-shadow: 0 4px 15px rgba(0,0,0,0.2) !important;
    }
    #sidebar button[onclick*="image-upload"]:hover {
        background: rgba(255, 255, 255, 0.05) !important;
    }

    /* ── WORKSPACE: main area tối ưu ── */
    #main-workspace {
        background: transparent !important;
    }

    /* ── IMAGE AREA: tận dụng không gian màn hình lớn ── */
    #comparison-view {
        max-height: 75vh !important;
        max-width: 85vw !important;
    }
    .mobile-image-frame {
        max-height: 60vh !important;
        border-radius: 14px !important;
        box-shadow: 0 40px 90px -20px rgba(0,0,0,0.85), 0 0 0 1px rgba(255,255,255,0.06) !important;
    }
    #img-original, #img-modified {
        max-height: 60vh !important;
    }

    /* ── DOWNLOAD BUTTON: đẹp, nổi bật ── */
    #placeholder-state {
        border-radius: 28px !important;
    }

    /* ── NOTIFICATION BOX: width fit cho sidebar desktop ── */
    #system-notification-box {
        border-radius: 14px !important;
    }

    /* --- XÓA NỀN & VIỀN 3 KHU VỰC TRÊN SIDEBAR --- */
    #sidebar > div:nth-child(2) {
        background: transparent !important;
        border-bottom: none !important;
        box-shadow: none !important;
    }
    #kontext-module-container,
    #kontext-module-container > div,
    #kontext-module-container .p-4 {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }
    #sidebar > div:last-child {
        background: transparent !important;
        border-top: none !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
    }

    /* ── SCROLLBAR: tinh tế trên PC ── */
    #sidebar ::-webkit-scrollbar { width: 0px !important; display: none !important; }
    #sidebar ::-webkit-scrollbar-thumb { background: transparent !important; }

    /* ── AUTO SCAN BUTTON ── */
    #btn-auto-pilot {
        padding: 16px 20px !important;
        border-radius: 16px !important;
        font-size: 24px !important;
        letter-spacing: 0.12em !important;
        font-weight: 900 !important;
    }
    #btn-auto-pilot svg {
        width: 24px !important;
        height: 24px !important;
    }
}

/* ── HIỂN THỊ ĐÚNG 4 ẢNH TRÊN PC (ĐÃ ĐỒNG BỘ VỚI ZOOM 90%) ── */
/* Cho màn hình Laptop nhỏ */
@media (min-width: 1024px) and (max-width: 1279px) {
    .showcase-item { 
        width: calc((111.11vw - 240px - 76px) / 4) !important; 
        height: 145px !important; 
        flex-shrink: 0 !important;
    }
}
/* Cho màn hình PC tiêu chuẩn */
@media (min-width: 1280px) and (max-width: 1599px) {
    .showcase-item { 
        width: calc((111.11vw - 260px - 76px) / 4) !important; 
        height: 155px !important; 
        flex-shrink: 0 !important;
    }
}
/* Cho màn hình PC lớn (UltraWide) */
@media (min-width: 1600px) {
    .showcase-item { 
        width: calc((111.11vw - 280px - 80px) / 4) !important; 
        height: 185px !important; 
        flex-shrink: 0 !important;
    }
}
   
/* --- XÓA NỀN VÀ VIỀN NÚT AUTO SCAN (Chỉ áp dụng khi chưa chạy) --- */
#btn-auto-pilot:not(.is-running) {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#btn-auto-pilot:not(.is-running):hover {
    background: rgba(255, 255, 255, 0.03) !important;
}

/* ── BLUR MỀM MẠI KHI ĐANG AUTO SCAN ── */
#btn-auto-pilot.is-running {
    background: rgba(10, 132, 255, 0.05) !important;
    border: 1px solid rgba(10, 132, 255, 0.18) !important;
    box-shadow: none !important;
    color: #0A84FF;
    text-shadow: 0 0 18px rgba(10, 132, 255, 0.55), 0 0 35px rgba(10, 132, 255, 0.3);
    animation: scanPulseBlur 2.4s ease-in-out infinite;
    transition: all 0.8s var(--ease-ios);
    filter: drop-shadow(0 0 14px rgba(10, 132, 255, 0.35));
}
@keyframes scanPulseBlur {
    0%, 100% { filter: drop-shadow(0 0 10px rgba(10, 132, 255, 0.25)); opacity: 0.9; }
    50% { filter: drop-shadow(0 0 22px rgba(10, 132, 255, 0.55)); opacity: 1; }
}

/* ── BLUR XANH LÁ "DÍNH CHẾT" KHI HOÀN TẤT ── */
#btn-auto-pilot.is-done {
    background: rgba(48, 209, 88, 0.05) !important;
    border: 1px solid rgba(48, 209, 88, 0.2) !important;
    box-shadow: none !important;
    color: #30D158;
    text-shadow: 0 0 18px rgba(48, 209, 88, 0.5), 0 0 35px rgba(48, 209, 88, 0.28);
    pointer-events: none !important;
    cursor: not-allowed !important;
    opacity: 0.95;
    animation: doneSoftGlow 3.2s ease-in-out infinite;
    filter: drop-shadow(0 0 14px rgba(48, 209, 88, 0.32));
    transition: all 0.8s var(--ease-ios);
}
@keyframes doneSoftGlow {
    0%, 100% { filter: drop-shadow(0 0 10px rgba(48, 209, 88, 0.22)); }
    50% { filter: drop-shadow(0 0 22px rgba(48, 209, 88, 0.5)); }
}