@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;700;800;900&family=JetBrains+Mono:wght@500;700&display=swap";:root{--bg-primary:#f4f4f0;--bg-card:#fff;--text-main:#000;--text-muted:#4a4a4a;--border-color:#000;--shadow-color:#000;--shadow-offset:4px;--shadow-offset-hover:6px;--accent-yellow:#ffde59;--accent-cyan:#00f0ff;--accent-pink:#ff2e93;--accent-lime:#00e676;--accent-orange:#ff6b0b;--accent-purple:#a855f7;--border-width:3px;--border-radius:4px;--font-sans:"Plus Jakarta Sans", system-ui, -apple-system, sans-serif;--font-mono:"JetBrains Mono", monospace;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1)}[data-theme=dark]{--bg-primary:#121214;--bg-card:#1e1e24;--text-main:#fff;--text-muted:#a1a1aa;--border-color:#fff;--shadow-color:#ffde59;--shadow-offset:4px;--shadow-offset-hover:6px;--accent-yellow:#ffde59;--accent-cyan:#00f0ff;--accent-pink:#ff2e93;--accent-lime:#00e676;--accent-orange:#ff6b0b;--accent-purple:#c084fc}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-main);min-height:100vh;transition:background-color var(--transition-fast), color var(--transition-fast);flex-direction:column;padding:1.5rem;line-height:1.5;display:flex}.app-container{flex-direction:column;flex:1;gap:1.5rem;width:100%;max-width:1200px;margin:0 auto;display:flex}.header-card{background-color:var(--accent-yellow);color:#000;border:var(--border-width) solid var(--border-color);box-shadow:var(--shadow-offset) var(--shadow-offset) 0px var(--shadow-color);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding:1.25rem 1.5rem;display:flex}.brand-title{letter-spacing:-.03em;align-items:center;gap:.5rem;font-size:1.85rem;font-weight:900;display:flex}.brand-subtitle{color:#fff;border-radius:var(--border-radius);background-color:#000;padding:.2rem .6rem;font-size:.95rem;font-weight:700}.brutal-card{background-color:var(--bg-card);border:var(--border-width) solid var(--border-color);box-shadow:var(--shadow-offset) var(--shadow-offset) 0px var(--shadow-color);border-radius:var(--border-radius);transition:transform var(--transition-fast), box-shadow var(--transition-fast);padding:1.5rem}.section-title{border-bottom:var(--border-width) solid var(--border-color);justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.5rem;font-size:1.35rem;font-weight:800;display:flex}.brutal-btn{font-family:var(--font-sans);border:var(--border-width) solid var(--border-color);box-shadow:var(--shadow-offset) var(--shadow-offset) 0px var(--shadow-color);background-color:var(--accent-cyan);color:#000;cursor:pointer;transition:transform var(--transition-fast), box-shadow var(--transition-fast), background-color var(--transition-fast);-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;gap:.5rem;padding:.65rem 1.25rem;font-size:.95rem;font-weight:800;text-decoration:none;display:inline-flex}.brutal-btn:hover:not(:disabled){box-shadow:var(--shadow-offset-hover) var(--shadow-offset-hover) 0px var(--shadow-color);transform:translate(-2px,-2px)}.brutal-btn:active:not(:disabled){box-shadow:2px 2px 0px var(--shadow-color);transform:translate(2px,2px)}.brutal-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.btn-yellow{background-color:var(--accent-yellow);color:#000}.btn-pink{background-color:var(--accent-pink);color:#fff}.btn-lime{background-color:var(--accent-lime);color:#000}.btn-purple{background-color:var(--accent-purple);color:#fff}.btn-orange{background-color:var(--accent-orange);color:#fff}.btn-dark{background-color:var(--border-color);color:var(--bg-card)}.btn-sm{padding:.35rem .75rem;font-size:.85rem}.main-grid{grid-template-columns:1fr 340px;gap:1.5rem;display:grid}@media (width<=960px){.main-grid{grid-template-columns:1fr}}.dropzone{border:4px dashed var(--border-color);background-color:var(--bg-card);text-align:center;cursor:pointer;transition:background-color var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);box-shadow:var(--shadow-offset) var(--shadow-offset) 0px var(--shadow-color);border-radius:var(--border-radius);padding:3rem 1.5rem;position:relative}.dropzone.dragover{background-color:var(--accent-yellow);color:#000;border-style:solid;transform:scale(1.01)}.dropzone-icon{margin-bottom:.5rem;font-size:3rem;display:inline-block}.dropzone-title{margin-bottom:.25rem;font-size:1.25rem;font-weight:800}.dropzone-hint{color:var(--text-muted);font-size:.9rem}.dropzone-formats{flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:1rem;display:flex}.badge{font-family:var(--font-mono);border:2px solid var(--border-color);background-color:var(--bg-primary);color:var(--text-main);padding:.2rem .5rem;font-size:.75rem;font-weight:700}.queue-controls{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.queue-count{font-size:1rem;font-weight:800}.setting-group{margin-bottom:1.25rem}.setting-label{text-transform:uppercase;letter-spacing:.05em;margin-bottom:.4rem;font-size:.9rem;font-weight:800;display:block}.brutal-select,.brutal-input{width:100%;font-family:var(--font-sans);border:var(--border-width) solid var(--border-color);background-color:var(--bg-primary);color:var(--text-main);box-shadow:3px 3px 0px var(--shadow-color);outline:none;padding:.6rem .8rem;font-size:.95rem;font-weight:700}.brutal-select option,.brutal-select optgroup{background-color:var(--bg-card);color:var(--text-main);font-family:var(--font-sans)}.brutal-select optgroup{font-weight:800}.brutal-select:focus,.brutal-input:focus{background-color:var(--accent-yellow);color:#000}.range-wrap{align-items:center;gap:1rem;display:flex}.brutal-range{-webkit-appearance:none;background:var(--bg-primary);border:var(--border-width) solid var(--border-color);outline:none;flex:1;height:10px}.brutal-range::-webkit-slider-thumb{appearance:none;background:var(--accent-pink);border:var(--border-width) solid var(--border-color);cursor:pointer;width:22px;height:22px;box-shadow:2px 2px 0px var(--shadow-color)}.range-val{font-family:var(--font-mono);text-align:right;min-width:45px;font-weight:800}.dim-inputs{grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.checkbox-wrap{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.5rem;font-size:.9rem;font-weight:700;display:flex}.brutal-checkbox{width:20px;height:20px;accent-color:var(--accent-pink);cursor:pointer}.queue-list{flex-direction:column;gap:1rem;display:flex}.queue-item{background-color:var(--bg-card);border:var(--border-width) solid var(--border-color);box-shadow:var(--shadow-offset) var(--shadow-offset) 0px var(--shadow-color);border-radius:var(--border-radius);transition:transform var(--transition-fast);grid-template-columns:80px 1fr auto;align-items:center;gap:1rem;padding:1rem;display:grid}@media (width<=600px){.queue-item{grid-template-columns:60px 1fr}.queue-item-actions{grid-column:span 2;justify-content:flex-end}}.item-thumb-box{border:var(--border-width) solid var(--border-color);background-color:var(--bg-primary);justify-content:center;align-items:center;width:80px;height:80px;display:flex;position:relative;overflow:hidden}.item-thumb-box img{object-fit:contain;max-width:100%;max-height:100%}.item-details{flex-direction:column;gap:.25rem;min-width:0;display:flex}.item-name{white-space:nowrap;text-overflow:ellipsis;font-size:1rem;font-weight:800;overflow:hidden}.item-meta{font-family:var(--font-mono);color:var(--text-muted);flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.8rem;display:flex}.savings-badge{font-family:var(--font-mono);border:2px solid var(--border-color);padding:.15rem .4rem;font-size:.8rem;font-weight:800}.savings-good{background-color:var(--accent-lime);color:#000}.savings-warn{background-color:var(--accent-yellow);color:#000}.status-badge{font-family:var(--font-mono);border:2px solid var(--border-color);text-transform:uppercase;padding:.2rem .5rem;font-size:.75rem;font-weight:800}.status-pending{background-color:var(--bg-primary)}.status-processing{background-color:var(--accent-cyan);color:#000}.status-completed{background-color:var(--accent-lime);color:#000}.status-error{background-color:var(--accent-pink);color:#fff}.queue-item-actions{align-items:center;gap:.5rem;display:flex}.progress-card{background-color:var(--accent-cyan);color:#000;border:var(--border-width) solid var(--border-color);box-shadow:var(--shadow-offset) var(--shadow-offset) 0px var(--shadow-color);margin-top:1rem;padding:1rem}.progress-bar-outer{border:var(--border-width) solid var(--border-color);background-color:#fff;height:20px;margin-top:.5rem;position:relative;overflow:hidden}.progress-bar-inner{background-color:var(--accent-pink);width:0%;height:100%;transition:width .2s ease-in-out}.toast-container{z-index:9999;flex-direction:column;gap:.75rem;width:calc(100% - 3rem);max-width:380px;display:flex;position:fixed;bottom:1.5rem;right:1.5rem}.toast{border:var(--border-width) solid #000;color:#000;background-color:#fff;justify-content:space-between;align-items:center;gap:.5rem;padding:.85rem 1.1rem;font-size:.9rem;font-weight:800;animation:.2s cubic-bezier(.175,.885,.32,1.275) slideIn;display:flex;box-shadow:4px 4px #000}.toast-success{background-color:var(--accent-lime);color:#000}.toast-error{background-color:var(--accent-pink);color:#fff}.toast-info{background-color:var(--accent-yellow);color:#000}@keyframes slideIn{0%{opacity:0;transform:translateY(100%)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}.empty-state{text-align:center;border:var(--border-width) dashed var(--border-color);background-color:var(--bg-card);padding:2.5rem 1rem}.empty-title{margin-bottom:.5rem;font-size:1.1rem;font-weight:800}.tab-bar{gap:.75rem;margin-bottom:.5rem;display:flex}.tab-btn{font-family:var(--font-sans);border:var(--border-width) solid var(--border-color);background-color:var(--bg-card);color:var(--text-main);box-shadow:var(--shadow-offset) var(--shadow-offset) 0px var(--shadow-color);border-radius:var(--border-radius);cursor:pointer;transition:transform var(--transition-fast), box-shadow var(--transition-fast), background-color var(--transition-fast);padding:.65rem 1.5rem;font-size:1.05rem;font-weight:800}.tab-btn:hover{box-shadow:var(--shadow-offset-hover) var(--shadow-offset-hover) 0px var(--shadow-color);transform:translate(-2px,-2px)}.tab-btn.tab-active{background-color:var(--accent-yellow);color:#000;box-shadow:2px 2px 0px var(--shadow-color);transform:translate(2px,2px)}.info-note{border:2px dashed var(--border-color);background-color:var(--bg-primary);border-radius:var(--border-radius);padding:.75rem}.video-thumb-box{color:#fff;background-color:#000}.frame-grid{flex-wrap:wrap;gap:.85rem;display:flex}.frame-card{background-color:var(--bg-card);border:var(--border-width) solid var(--border-color);width:110px;box-shadow:3px 3px 0px var(--shadow-color);border-radius:var(--border-radius);flex-direction:column;gap:.3rem;padding:.4rem;display:flex;position:relative}.frame-order-badge{background-color:var(--accent-lime);color:#000;font-family:var(--font-mono);border:2px solid var(--border-color);z-index:1;padding:.1rem .4rem;font-size:.7rem;font-weight:800;position:absolute;top:-8px;left:-8px}.frame-thumb{border:2px solid var(--border-color);background-color:var(--bg-primary);justify-content:center;align-items:center;width:100%;height:90px;display:flex;overflow:hidden}.frame-thumb img{object-fit:cover;width:100%;height:100%}.frame-name{font-size:.65rem;font-family:var(--font-mono);white-space:nowrap;text-overflow:ellipsis;color:var(--text-muted);overflow:hidden}.frame-mini-actions{gap:.25rem;display:flex}.frame-mini-btn{border:2px solid var(--border-color);background-color:var(--bg-primary);color:var(--text-main);cursor:pointer;transition:transform var(--transition-fast), background-color var(--transition-fast);flex:1;padding:.2rem;font-size:.75rem}.frame-mini-btn:hover:not(:disabled){background-color:var(--accent-cyan)}.frame-mini-btn:disabled{opacity:.35;cursor:not-allowed}.frame-mini-btn-danger:hover:not(:disabled){background-color:var(--accent-pink);color:#fff}footer{text-align:center;margin-top:auto;padding-top:2rem;font-size:.9rem;font-weight:700}footer a{color:var(--text-main);text-decoration:underline}.footer-version{font-size:.7rem;font-weight:600;font-family:var(--font-mono);opacity:.45;margin-top:.35rem}