*,:before,:after{box-sizing:border-box}body{margin:0;padding:0}*{box-sizing:border-box}body{color:#e0e0e0;background:#0f0f0f;min-height:100vh;margin:0;font-family:Segoe UI,system-ui,sans-serif}#root{border:none;width:100%;max-width:1200px;margin:0 auto;padding:0 24px 60px}.app-header{text-align:center;border-bottom:1px solid #1e1e1e;margin-bottom:28px;padding:40px 0 28px}.app-header h1{color:#fff;margin:0 0 6px;font-size:1.8rem;font-weight:700}.app-header p{color:#555;margin:0;font-size:.85rem}.controls{flex-wrap:wrap;gap:16px;margin-bottom:24px;display:flex}.ctrl-section{background:#141414;border:1px solid #222;border-radius:10px;flex:260px;min-width:260px;padding:14px 18px 16px}.ctrl-section-title{text-transform:uppercase;letter-spacing:.1em;color:#444;margin-bottom:12px;font-size:.68rem}.ctrl-section-body{flex-direction:column;gap:10px;display:flex}.ctrl-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.ctrl-label{color:#777;white-space:nowrap;font-size:.78rem}.val{color:#555;font-size:.75rem}.toggle-group{border:1px solid #2a2a2a;border-radius:6px;display:flex;overflow:hidden}.toggle-btn{color:#555;cursor:pointer;background:0 0;border:none;padding:4px 12px;font-size:.78rem;transition:all .15s}.toggle-btn+.toggle-btn{border-left:1px solid #2a2a2a}.toggle-btn:hover{color:#aaa}.toggle-btn.active{color:#fff;background:#2a2a2a}.bg-toggle{gap:6px;display:flex}.bg-btn{color:#666;cursor:pointer;background:0 0;border:1px solid #2a2a2a;border-radius:6px;align-items:center;gap:5px;padding:4px 10px;font-size:.78rem;transition:all .15s;display:flex}.bg-btn:hover{color:#ccc;border-color:#444}.bg-btn.active{color:#fff;background:#222;border-color:#888}.swatch{border:1px solid #444;border-radius:2px;flex-shrink:0;width:12px;height:12px;display:inline-block}.swatch.white{background:#fff}.swatch.black{background:#000}.slider{accent-color:#888;cursor:pointer;height:3px}.font-select-group{flex-wrap:wrap;gap:5px;display:flex}.font-btn{color:#666;cursor:pointer;background:0 0;border:1px solid #2a2a2a;border-radius:5px;padding:4px 10px;font-size:.8rem;transition:all .15s}.font-btn:hover{color:#ccc}.font-btn.active{color:#fff;background:#222;border-color:#888}.dropzone{text-align:center;cursor:pointer;background:#0d0d0d;border:2px dashed #222;border-radius:10px;margin-bottom:32px;padding:44px 24px;transition:all .2s}.dropzone:hover,.dropzone.dragging{background:#131313;border-color:#444}.dropzone-inner{pointer-events:none}.drop-icon{margin-bottom:10px;font-size:2.2rem;display:block}.dropzone p{color:#888;margin:0 0 4px;font-size:.95rem}.dropzone small{color:#3a3a3a;font-size:.78rem}.processing{color:#555;justify-content:center;align-items:center;gap:12px;padding:40px;display:flex}.spinner{border:2px solid #2a2a2a;border-top-color:#888;border-radius:50%;width:18px;height:18px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.grid-section{margin-top:8px}.grid-header{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.grid-count{color:#444;font-size:.8rem}.grid-actions{gap:8px;display:flex}.zip-btn{color:#ccc;cursor:pointer;background:#141414;border:1px solid #2a2a2a;border-radius:7px;padding:7px 16px;font-size:.82rem;transition:all .15s}.zip-btn:hover{color:#fff;border-color:#666}.image-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;display:grid}.preview-card{background:#141414;border:1px solid #1e1e1e;border-radius:8px;overflow:hidden}.preview-wrap{width:100%;position:relative;overflow:hidden}.preview-hover{opacity:0;pointer-events:none;background:#00000073;justify-content:center;align-items:center;transition:opacity .2s;display:flex;position:absolute;inset:0}.preview-wrap:hover .preview-hover{opacity:1;pointer-events:auto}.dl-btn{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff14;border:1px solid #ffffff80;border-radius:6px;padding:7px 18px;font-size:.82rem;transition:all .15s}.dl-btn:hover:not(:disabled){background:#ffffff2e}.dl-btn:disabled{opacity:.6;cursor:wait}.card-meta{justify-content:space-between;align-items:center;padding:8px 12px;display:flex}.file-name{color:#444;text-overflow:ellipsis;white-space:nowrap;max-width:160px;font-size:.72rem;overflow:hidden}.img-size{color:#333;flex-shrink:0;font-size:.68rem}