.card{background:var(--card);border-radius:var(--radius);box-shadow:0 1px 6px #00000012;padding:16px;margin-bottom:16px}label.field-label{display:block;font-size:13px;font-weight:600;color:var(--sub);margin-bottom:6px}#batchInput{width:100%;border:2px solid var(--border);border-radius:10px;padding:10px 12px;font-size:14px;outline:none;transition:border-color .2s;resize:vertical;min-height:180px;font-family:Menlo,Consolas,monospace;color:var(--text);background:var(--card);line-height:1.55}#batchInput:focus{border-color:var(--primary)}.hint{font-size:12px;color:var(--sub);margin-top:8px;line-height:1.6}.hint code{background:var(--card-alt);color:var(--primary);padding:1px 6px;border-radius:4px;font-size:12px}.hint strong{color:var(--text)}.row{display:flex;gap:12px;margin-top:14px}.field{flex:1}select{width:100%;border:2px solid var(--border);border-radius:10px;padding:9px 12px;font-size:14px;outline:none;background:var(--card);color:var(--text);cursor:pointer;transition:border-color .2s}select:focus{border-color:var(--primary)}.color-row{display:flex;gap:12px;margin-top:14px}.color-field{flex:1}.color-wrap{display:flex;align-items:center;gap:8px;border:2px solid var(--border);border-radius:10px;padding:7px 12px;background:var(--card)}.color-wrap input[type=color]{width:24px;height:24px;border:none;padding:0;border-radius:6px;cursor:pointer;outline:none}.color-wrap span{font-size:14px;color:var(--text);font-family:Menlo,Consolas,monospace}.dot-picker{display:flex;gap:6px}.dot-btn{flex:1;padding:8px 4px;border-radius:8px;border:2px solid var(--border);background:var(--card);font-size:12px;font-weight:600;color:var(--sub);cursor:pointer;transition:all .2s;text-align:center;line-height:1.4}.dot-btn.active{border-color:var(--primary);background:#ede9ff;color:var(--primary)}.fg-mode{display:flex;gap:6px}.fg-btn{flex:1;padding:8px 4px;border-radius:8px;border:2px solid var(--border);background:var(--card);font-size:13px;font-weight:600;color:var(--sub);cursor:pointer;transition:all .2s}.fg-btn.active{border-color:var(--primary);background:#ede9ff;color:var(--primary)}.grad-dir{display:flex;gap:4px}.dir-btn{flex:1;padding:6px 0;border-radius:8px;border:2px solid var(--border);background:var(--card);font-size:15px;font-weight:700;color:var(--sub);cursor:pointer;transition:all .2s}.dir-btn.active{border-color:var(--primary);background:#ede9ff;color:var(--primary)}.logo-row{display:flex;gap:8px;align-items:center}.logo-upload{flex:1;display:flex;align-items:center;justify-content:center;padding:10px;border-radius:10px;border:2px dashed var(--border);cursor:pointer;transition:all .2s;font-size:13px;font-weight:600;color:var(--sub);background:var(--card)}.logo-upload:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-muted)}.logo-upload.has-logo{border-style:solid;border-color:var(--primary);color:var(--primary)}.logo-clear{flex-shrink:0;width:36px;height:36px;border-radius:10px;border:2px solid var(--border);background:var(--card-alt);color:var(--sub);font-size:18px;font-weight:700;cursor:pointer;transition:all .15s}.logo-clear:hover{color:#f44336;border-color:#f44336}#logoSize{accent-color:var(--primary)}.btn-primary{width:100%;background:linear-gradient(135deg,var(--primary),var(--primary-end));color:#fff;border:none;border-radius:10px;padding:13px 18px;font-size:15px;font-weight:700;cursor:pointer;margin-top:16px;transition:filter .15s}.btn-primary:hover{filter:brightness(1.08)}.btn-primary:active{filter:brightness(.95)}.result-card{display:flex;flex-direction:column}.result-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:10px;border-bottom:1px solid var(--border);margin-bottom:10px}.result-head>span{font-size:14px;font-weight:700;color:var(--text)}.head-btns{display:flex;gap:8px}.btn-zip{background:var(--primary);color:#fff;border:none;border-radius:8px;padding:7px 14px;font-size:13px;font-weight:700;cursor:pointer;transition:filter .15s}.btn-zip:hover:not(:disabled){filter:brightness(1.08)}.btn-zip:disabled{opacity:.4;cursor:not-allowed}.btn-clear{background:var(--card-alt);color:var(--sub);border:none;border-radius:8px;padding:7px 14px;font-size:13px;font-weight:700;cursor:pointer}.btn-clear:hover{filter:brightness(.95)}.stats{font-size:12px;color:var(--sub);margin-bottom:10px;line-height:1.6}.stats .ok{color:#4caf50;font-weight:700}.stats .err{color:#f44336;font-weight:700}.batch-list{flex:1;max-height:620px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.empty{text-align:center;color:var(--sub);padding:40px 20px;font-size:13px;border:2px dashed var(--border);border-radius:10px}.batch-item{display:flex;align-items:center;gap:12px;padding:10px;border-radius:10px;background:var(--card-alt);border:1px solid var(--border)}.batch-item.err{background:#f443360f;border-color:#f443364d}.batch-item canvas{width:64px;height:64px;flex-shrink:0;border-radius:6px;background:#fff;image-rendering:pixelated;cursor:zoom-in;transition:transform .15s}.batch-item canvas:hover{transform:scale(1.05)}.batch-item-body{flex:1;min-width:0}.batch-name{font-size:13px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.batch-content{font-size:11px;color:var(--sub);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:Menlo,Consolas,monospace}.batch-err{font-size:12px;color:#f44336;margin-top:2px}.btn-item-dl{flex-shrink:0;background:var(--primary-muted);color:var(--primary);border:none;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;cursor:pointer}.btn-item-dl:hover{filter:brightness(.95)}@media(min-width:760px){.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:stretch}.grid-2>.card{margin-bottom:0;height:100%;display:flex;flex-direction:column}.result-card{height:100%}}@media(max-width:600px){#batchInput{font-size:14px}.btn-primary{min-height:52px;font-size:16px}.row,.color-row{flex-direction:column;gap:10px}.batch-list{max-height:480px}}.lightbox{display:none;position:fixed;inset:0;background:#000000bf;z-index:1000;align-items:center;justify-content:center;padding:20px;animation:lb-fade .15s ease-out}.lightbox.open{display:flex}@keyframes lb-fade{0%{opacity:0}to{opacity:1}}.lightbox-inner{background:var(--card);border-radius:16px;padding:20px;max-width:calc(100vw - 40px);max-height:calc(100vh - 40px);display:flex;flex-direction:column;gap:14px;position:relative;box-shadow:0 20px 60px #0006}.lightbox-close{position:absolute;top:10px;right:10px;width:32px;height:32px;border-radius:50%;border:none;background:var(--card-alt);color:var(--sub);font-size:22px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1}.lightbox-close:hover{color:#f44336}.lightbox-canvas-wrap{display:flex;align-items:center;justify-content:center;background:var(--card-alt);border-radius:12px;padding:20px;min-height:300px}.lightbox-canvas-wrap canvas{max-width:100%;max-height:calc(100vh - 280px);width:auto;height:auto;background:#fff;border-radius:6px;image-rendering:pixelated}.lightbox-meta{display:flex;flex-direction:column;gap:8px}.lightbox-name{font-size:15px;font-weight:700;color:var(--text);word-break:break-all}.lightbox-content{font-size:12px;color:var(--sub);word-break:break-all;line-height:1.5;font-family:Menlo,Consolas,monospace;max-height:3em;overflow:hidden}.lightbox-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.lightbox-prev,.lightbox-next{width:36px;height:36px;border:none;border-radius:8px;background:var(--card-alt);color:var(--text);font-size:20px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center}.lightbox-prev:hover,.lightbox-next:hover{background:var(--primary-muted);color:var(--primary)}.lightbox-prev:disabled,.lightbox-next:disabled{opacity:.35;cursor:not-allowed}.lightbox-pos{font-size:13px;color:var(--sub);min-width:60px;text-align:center}.lightbox-dl{margin-left:auto;background:var(--primary);color:#fff;border:none;border-radius:8px;padding:8px 16px;font-size:13px;font-weight:700;cursor:pointer}.lightbox-dl:hover{filter:brightness(1.08)}:is([data-theme=dark]) .dot-btn.active{background:var(--primary-muted)}:is([data-theme=dark]) .fg-btn.active{background:var(--primary-muted)}:is([data-theme=dark]) .dir-btn.active{background:var(--primary-muted)}:is([data-theme=dark]) .batch-item.err{background:#f4433614}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .dot-btn.active{background:var(--primary-muted)}:root:not([data-theme=light]) .fg-btn.active{background:var(--primary-muted)}:root:not([data-theme=light]) .dir-btn.active{background:var(--primary-muted)}:root:not([data-theme=light]) .batch-item.err{background:#f4433614}}