:root{--bg-page: #f0f0f0;--bg-window: #fff;--bg-card: #fafafa;--bg-card-hover: #fff;--bg-card-selected: #f0fff0;--bg-input: #fff;--bg-log: #f8f8f8;--bg-btn-toggle: #f0f0f0;--bg-btn-toggle-hover: #e8e8e8;--bg-btn-toggle-active: #e8f5e9;--bg-progress: #e8e8e8;--bg-device-image: #e8e8e8;--bg-tips: #fafafa;--border-light: #f0f0f0;--border-card: #e8e8e8;--border-input: #e0e0e0;--border-tips: #e0e0e0;--text-primary: #555;--text-secondary: #666;--text-muted: #999;--text-light: #bbb;--text-log: #666;--shadow-window: 0 8px 40px rgba(0,0,0,.12);--shadow-overlay: 0 10px 50px rgba(0, 0, 0, .5);--accent: #4CAF50;--accent-hover: #45a049;--accent-light: #e8f5e9;--accent-lighter: #c8e6c9;--scrollbar-track: #f0f0f0;--scrollbar-thumb: #ccc;--scrollbar-thumb-hover: #aaa}[data-theme=dark]{--bg-page: #1b1b1f;--bg-window: #2d2d2d;--bg-card: #363636;--bg-card-hover: #404040;--bg-card-selected: #2d4a2d;--bg-input: #363636;--bg-log: #252525;--bg-btn-toggle: #404040;--bg-btn-toggle-hover: #4a4a4a;--bg-btn-toggle-active: #2d4a2d;--bg-progress: #404040;--bg-device-image: #404040;--bg-tips: #363636;--border-light: #404040;--border-card: #4a4a4a;--border-input: #555;--border-tips: #555;--text-primary: #e0e0e0;--text-secondary: #b0b0b0;--text-muted: #888;--text-light: #666;--text-log: #b0b0b0;--shadow-window: 0 8px 40px rgba(0,0,0,.4);--shadow-overlay: 0 10px 50px rgba(0, 0, 0, .7);--accent: #5cb85c;--accent-hover: #4cae4c;--accent-light: #2d4a2d;--accent-lighter: #3d5a3d;--scrollbar-track: #363636;--scrollbar-thumb: #555;--scrollbar-thumb-hover: #666}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--bg-page);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:40px 20px;transition:background .3s}.app-shell{display:flex;align-items:center;gap:22px}.tool-sidebar{position:fixed;left:32px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:12px;padding:16px 12px;width:70px;border-radius:999px;background:linear-gradient(180deg,#ffffffeb,#f5f5f5e6);border:1px solid rgba(255,255,255,.8);box-shadow:0 16px 30px #00000024;backdrop-filter:blur(8px);z-index:10}.tool-item{position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer}.tool-btn{width:36px;height:36px;border-radius:50%;border:none;background:transparent;color:var(--text-muted);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}[data-theme=dark] .tool-sidebar{background:linear-gradient(180deg,#3c3c3ce6,#2d2d2deb);border-color:#ffffff14}.tool-btn svg{width:24px;height:24px;fill:currentColor}.tool-btn svg path{fill:currentColor!important}.tool-item:hover .tool-btn{color:var(--accent);background:#4caf501f;transform:translateY(-1px) scale(1.08)}.tool-pop{position:absolute;left:calc(100% + 22px);top:50%;transform:translateY(-50%);min-width:190px;padding:9px 12px;border-radius:10px;background:#fffffffa;border:1px solid rgba(255,255,255,.7);box-shadow:0 12px 24px #0000001f;opacity:0;pointer-events:none;transition:all .2s ease;z-index:12}.tool-pop-image{padding:8px;min-width:0}.tool-pop-image img{width:160px;height:auto;display:block;border-radius:10px}.tool-pop:before{content:"";position:absolute;left:-7px;top:50%;width:12px;height:12px;transform:translateY(-50%) rotate(45deg);background:inherit;border-left:1px solid rgba(255,255,255,.7);border-bottom:1px solid rgba(255,255,255,.7)}.tool-pop-title{font-size:.85rem;font-weight:600;color:var(--text-primary)}.tool-pop-desc{margin-top:4px;font-size:.72rem;color:var(--text-muted)}.tool-item:hover .tool-pop{opacity:1;transform:translateY(-50%)}[data-theme=dark] .tool-pop{background:#2a2a2afa;border-color:#ffffff14}[data-theme=dark] .tool-pop:before{border-left-color:#ffffff14;border-bottom-color:#ffffff14}.window{background:var(--bg-window);border-radius:12px;box-shadow:var(--shadow-window);width:480px;overflow:hidden;transition:background .3s,box-shadow .3s}.title-bar{padding:16px 20px;border-bottom:1px solid var(--border-light);display:flex;align-items:center;justify-content:space-between}.title-bar h1{font-size:1rem;font-weight:600;color:var(--text-primary);margin:0}.title-bar-actions{display:flex;align-items:center;gap:8px}.btn-theme{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;border-radius:50%;background:var(--bg-btn-toggle);color:var(--text-muted);cursor:pointer;transition:opacity .5s ease;opacity:0;pointer-events:none}.btn-theme.visible{opacity:1;pointer-events:auto}.btn-theme:hover{background:var(--bg-btn-toggle-hover);color:var(--text-secondary)}.btn-theme svg{width:16px;height:16px}.btn-toggle-all{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;border-radius:50%;background:var(--bg-btn-toggle);color:var(--text-muted);cursor:pointer;transition:all .2s}.btn-toggle-all:hover{background:var(--bg-btn-toggle-hover);color:var(--text-secondary)}.btn-toggle-all.active{color:var(--accent);background:var(--accent-light)}.btn-toggle-all svg{width:18px;height:18px}.content{padding:20px}.firmware-section{margin-bottom:16px}.firmware-header{display:flex;align-items:center;justify-content:space-between;padding:0 0 10px}.firmware-header-text{font-size:.9rem;color:var(--text-secondary)}.firmware-header-text .selected-name{color:var(--accent);font-weight:500}.btn-select-firmware{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--border-input);border-radius:6px;background:var(--bg-input);color:var(--text-secondary);font-size:.8rem;cursor:pointer;transition:all .2s}.btn-select-firmware:hover{border-color:var(--border-card);background:var(--bg-card)}.btn-select-firmware.active{border-color:var(--accent);color:var(--accent)}.btn-select-firmware svg{width:16px;height:16px}.device-list-wrapper{max-height:0;overflow:hidden;transition:max-height .3s ease}.device-list-wrapper.expanded{max-height:330px;overflow-y:auto}.device-list-wrapper::-webkit-scrollbar{width:6px}.device-list-wrapper::-webkit-scrollbar-track{background:var(--scrollbar-track);border-radius:3px}.device-list-wrapper::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:3px}.device-list{display:flex;flex-direction:column;gap:10px;padding:10px 12px 10px 0}.device-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:40px 20px;color:var(--text-muted);font-size:.85rem}.loading-spinner{width:32px;height:32px;border:3px solid var(--border-card);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.device-error{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:40px 20px;color:#e74c3c;font-size:.85rem;text-align:center}.device-error button{padding:6px 16px;border:1px solid var(--border-input);border-radius:6px;background:var(--bg-input);color:var(--text-secondary);font-size:.8rem;cursor:pointer;transition:all .2s}.device-error button:hover{border-color:var(--accent);color:var(--accent)}.device-list-tips{padding:12px;border:1px dashed var(--border-tips);border-radius:10px;margin-top:10px;font-size:.75rem;color:var(--text-muted);line-height:1.8;background:var(--bg-tips)}.device-list-tips .qq-number{color:var(--accent);font-weight:500;user-select:all}.device-card{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--border-card);border-radius:10px;cursor:pointer;transition:all .2s;background:var(--bg-card)}.device-card:hover{border-color:var(--border-input);background:var(--bg-card-hover)}.device-card.selected{border-color:var(--accent);background:var(--bg-card-selected)}.device-image{width:60px;height:60px;border-radius:8px;background:var(--bg-device-image);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;cursor:zoom-in;transition:transform .2s}.device-image:hover{transform:scale(1.05)}.device-image img{width:100%;height:100%;object-fit:cover}.device-info{flex:1;min-width:0}.device-name{font-size:.95rem;font-weight:500;color:var(--text-primary);margin-bottom:4px}.device-desc{font-size:.8rem;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.device-check{width:20px;height:20px;border-radius:50%;border:2px solid var(--border-input);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}.device-card.selected .device-check{border-color:var(--accent);background:var(--accent)}.device-check svg{opacity:0;transition:opacity .2s}.device-card.selected .device-check svg{opacity:1}.progress-section{padding-bottom:16px;border-bottom:1px solid var(--border-light);margin-bottom:4px}.progress-header{margin-bottom:12px;display:flex;align-items:center;gap:4px}.progress-title{font-size:.85rem;color:var(--text-secondary);cursor:pointer}.log-link{color:var(--text-muted);cursor:pointer;transition:color .2s;display:inline-flex;align-items:center}.log-link:hover{color:var(--text-secondary)}.log-link.active{color:var(--accent)}.log-link svg{width:18px;height:18px}.progress-bar{height:8px;background:var(--bg-progress);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#c8e600,#a8c600);width:0%;border-radius:4px;transition:width .2s}.plugin-checkbox{display:inline-flex;align-items:center;gap:6px;cursor:pointer;user-select:none;position:relative;margin-left:20px}.plugin-checkbox input[type=checkbox]{position:absolute;opacity:0;width:0;height:0}.plugin-checkbox .checkbox-custom{width:15px;height:14px;border:1px solid var(--border-input);border-radius:1px;transition:all .2s;display:flex;align-items:center;justify-content:center}.plugin-checkbox input[type=checkbox]:checked+.checkbox-custom{border-color:var(--accent);background:transparent}.plugin-checkbox input[type=checkbox]:checked+.checkbox-custom:after{content:"";width:3px;height:6px;border:solid var(--accent);border-width:0 1px 2px 0;transform:rotate(45deg);margin-bottom:2px}.plugin-checkbox .checkbox-label{font-size:.85rem;color:var(--text-secondary);white-space:nowrap}.log-box-wrapper{max-height:0;overflow:hidden;transition:max-height .3s ease,margin .3s ease;margin-top:0}.log-box-wrapper.expanded{max-height:150px;margin-top:14px}.log-box{background:var(--bg-log);border:1px solid var(--border-card);border-radius:8px;padding:12px;height:120px;overflow-y:auto;font-family:Monaco,Consolas,monospace;font-size:.8rem;line-height:1.6}.log-box::-webkit-scrollbar{width:6px}.log-box::-webkit-scrollbar-track{background:var(--scrollbar-track);border-radius:3px}.log-box::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:3px}.log-line{color:var(--text-log);margin-bottom:4px}.log-line.info{color:var(--text-muted)}.log-line.error{color:#e74c3c}.log-line.success{color:#27ae60}.log-line.loading:after{content:"";display:inline-block;width:10px;height:10px;margin-left:6px;border:2.5px solid var(--text-muted);border-top-color:var(--accent);border-right-color:var(--accent);border-radius:50%;animation:spin 1.6s linear infinite;vertical-align:middle}.connection-status{display:flex;align-items:center;gap:6px;font-size:.8rem;color:var(--text-muted);padding:6px 0 22px;cursor:pointer;transition:color .2s}.connection-status:hover{color:var(--text-secondary)}.connection-status.connected{color:var(--accent)}.connection-status.connected:hover{color:var(--accent-hover)}.connection-status svg{width:18px;height:18px}.controls-section{display:flex;align-items:center;justify-content:center;gap:10px}.btn{padding:8px 20px;border:none;border-radius:6px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-start{background:var(--accent);color:#fff;display:inline-flex;align-items:center;gap:6px}.btn-start:hover:not(:disabled){background:var(--accent-hover)}.btn-start svg{width:16px;height:16px}.btn-stop,.btn-erase{background:var(--bg-input);color:var(--text-secondary);border:1px solid var(--border-input);display:inline-flex;align-items:center;gap:4px}.btn-stop:hover,.btn-erase:hover{background:var(--bg-card)}.btn-stop svg,.btn-erase svg{width:14px;height:14px}.image-overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}.image-overlay.active{opacity:1;visibility:visible}.image-overlay-content{position:relative;display:flex;align-items:center;justify-content:center;max-width:90%;max-height:90%}.image-overlay img{max-width:100%;max-height:80vh;border-radius:12px;box-shadow:var(--shadow-overlay);transform:scale(.9);transition:transform .3s;cursor:zoom-out}.image-overlay.active img{transform:scale(1)}.image-nav-btn{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:none;border-radius:50%;background:#00000080;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;z-index:1001;box-shadow:0 2px 8px #0000004d}.image-nav-btn:hover{background:#000000b3}.image-nav-btn.prev{left:-60px}.image-nav-btn.next{right:-60px}.image-nav-btn svg{width:22px;height:22px}.image-nav-btn.hidden{display:none}.image-indicator{position:absolute;bottom:-30px;left:50%;transform:translate(-50%);display:flex;gap:8px}.image-indicator-dot{width:10px;height:10px;border-radius:50%;background:#fff6;cursor:pointer;transition:background .2s;box-shadow:0 1px 3px #0000004d}.image-indicator-dot.active{background:#fff}.image-close-btn{position:fixed;top:20px;right:20px;width:40px;height:40px;border:none;border-radius:50%;background:#fff3;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;z-index:1001}.image-close-btn:hover{background:#ffffff4d}.image-close-btn svg{width:20px;height:20px}.uuid-dialog-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}.uuid-dialog-overlay.active{opacity:1;visibility:visible}.uuid-dialog{background:var(--bg-window);border-radius:12px;box-shadow:var(--shadow-overlay);width:380px;max-width:90%;overflow:hidden;transform:scale(.9);transition:transform .3s}.uuid-dialog-overlay.active .uuid-dialog{transform:scale(1)}.uuid-dialog-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border-light)}.uuid-dialog-header h3{font-size:1rem;font-weight:600;color:var(--text-primary);margin:0}.uuid-close-btn{width:28px;height:28px;border:none;border-radius:50%;background:var(--bg-btn-toggle);color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.uuid-close-btn:hover{background:var(--bg-btn-toggle-hover);color:var(--text-secondary)}.uuid-close-btn svg{width:16px;height:16px}.uuid-dialog-body{padding:20px}.uuid-label{font-size:.85rem;color:var(--text-muted);margin-bottom:10px}.uuid-value-wrapper{display:flex;align-items:center;gap:10px}.uuid-value{flex:1;padding:12px;background:var(--bg-log);border:1px solid var(--border-card);border-radius:8px;font-family:Monaco,Consolas,monospace;font-size:.85rem;color:var(--text-primary);word-break:break-all;user-select:all}.uuid-copy-btn{padding:10px 16px;border:1px solid var(--border-input);border-radius:8px;background:var(--bg-input);color:var(--text-secondary);font-size:.85rem;cursor:pointer;transition:all .2s;white-space:nowrap}.uuid-copy-btn:hover{border-color:var(--accent);color:var(--accent)}.uuid-copy-btn.copied{border-color:var(--accent);background:var(--accent);color:#fff}.uuid-hint{margin-top:16px;padding:12px;background:var(--bg-tips);border:1px dashed var(--border-tips);border-radius:8px;font-size:.75rem;color:var(--text-muted);line-height:1.6}.uuid-actions{margin-top:12px}.uuid-edit-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1px dashed var(--border-input);border-radius:6px;background:transparent;color:var(--text-muted);font-size:.8rem;cursor:pointer;transition:all .2s}.uuid-edit-btn:hover{border-color:var(--accent);color:var(--accent);border-style:solid}.uuid-edit-btn svg{width:14px;height:14px}.uuid-input-wrapper{margin-bottom:10px}.uuid-input{width:100%;padding:12px;border:1px solid var(--border-input);border-radius:8px;background:var(--bg-input);color:var(--text-primary);font-family:Monaco,Consolas,monospace;font-size:.85rem;outline:none;transition:border-color .2s}.uuid-input:focus{border-color:var(--accent)}.uuid-input::placeholder{color:var(--text-light)}.uuid-error{color:#e74c3c;font-size:.8rem;margin-bottom:10px}.uuid-edit-actions{display:flex;gap:10px;margin-top:12px}.uuid-save-btn{padding:8px 20px;border:none;border-radius:6px;background:var(--accent);color:#fff;font-size:.85rem;cursor:pointer;transition:background .2s}.uuid-save-btn:hover{background:var(--accent-hover)}.uuid-cancel-btn{padding:8px 20px;border:1px solid var(--border-input);border-radius:6px;background:var(--bg-input);color:var(--text-secondary);font-size:.85rem;cursor:pointer;transition:all .2s}.uuid-cancel-btn:hover{border-color:var(--border-card);background:var(--bg-card)}@media screen and (max-width:520px){html,body{margin:0;padding:0;background:var(--bg-page);min-height:100vh}body{display:flex;align-items:center;justify-content:center;padding:0}.tool-sidebar{display:none}.window{width:calc(100vw - 40px)!important;max-width:calc(100vw - 40px)!important;border-radius:12px;box-shadow:var(--shadow-window);margin:20px}.title-bar{padding:14px 16px}.title-bar h1{font-size:.95rem}.content{padding:16px}.firmware-header{flex-direction:row;align-items:center;gap:8px}.firmware-header-text{font-size:.85rem;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn-select-firmware{flex-shrink:0;padding:6px 10px;font-size:.75rem}.device-list-wrapper.expanded{max-height:280px}.device-list{padding:10px 8px 10px 0}.device-card{padding:10px}.device-image{width:50px;height:50px}.device-name{font-size:.9rem}.device-desc{font-size:.75rem}.device-list-tips{font-size:.7rem;padding:10px}.progress-title{font-size:.8rem}.log-box{font-size:.75rem;padding:10px;height:100px}.connection-status{font-size:.75rem;padding:8px 0 18px;flex-wrap:wrap}.connection-status span{flex:1;min-width:0}.controls-section{gap:8px}.btn{padding:10px 16px;font-size:.8rem}.btn-start{flex:none;padding:10px 24px}.btn-stop,.btn-erase{padding:10px 14px}.image-nav-btn{width:40px;height:40px;background:#0009}.image-nav-btn.prev{left:10px}.image-nav-btn.next{right:10px}.image-overlay-content{touch-action:pan-y pinch-zoom}.image-close-btn{top:10px;right:10px}.uuid-dialog{width:90%;margin:0 16px}.uuid-value{font-size:.75rem;padding:10px}.uuid-copy-btn{padding:10px 12px;font-size:.8rem}}@media screen and (max-width:360px){.title-bar h1{font-size:.9rem}.content{padding:12px}.device-image{width:45px;height:45px}.btn{padding:8px 12px;font-size:.75rem}.btn-stop svg,.btn-erase svg{display:none}}