:root{--bg-primary: #0a0a0b;--bg-secondary: #141416;--bg-tertiary: #1c1c1f;--border: #2a2a2e;--text-primary: #f5f5f7;--text-secondary: #8e8e93;--accent: #00d4aa;--accent-dim: #00d4aa22;--warning: #ff6b4a;--success: #00d4aa}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Space Grotesk,sans-serif;background:var(--bg-primary);color:var(--text-primary);min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:40px 20px;background-image:radial-gradient(circle at 20% 80%,var(--accent-dim) 0%,transparent 40%),radial-gradient(circle at 80% 20%,rgba(255,107,74,.05) 0%,transparent 40%)}.container{max-width:800px;width:100%}header{text-align:center;margin-bottom:48px}h1{font-size:2.5rem;font-weight:700;letter-spacing:-.02em;margin-bottom:12px;background:linear-gradient(135deg,var(--text-primary) 0%,var(--accent) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.subtitle{font-family:JetBrains Mono,monospace;font-size:.875rem;color:var(--text-secondary);letter-spacing:.05em}.drop-zone{background:var(--bg-secondary);border:2px dashed var(--border);border-radius:16px;padding:64px 32px;text-align:center;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.drop-zone:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--accent-dim) 0%,transparent 50%);opacity:0;transition:opacity .3s ease}.drop-zone:hover,.drop-zone.dragover{border-color:var(--accent);background:var(--bg-tertiary)}.drop-zone:hover:before,.drop-zone.dragover:before{opacity:1}.drop-zone-icon{width:64px;height:64px;margin:0 auto 20px;opacity:.6}.drop-zone-text{font-size:1.125rem;font-weight:500;margin-bottom:8px}.drop-zone-hint{font-family:JetBrains Mono,monospace;font-size:.75rem;color:var(--text-secondary)}#file-input{display:none}.processing{display:none;text-align:center;padding:48px}.processing.active{display:block}.spinner{width:48px;height:48px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 20px}@keyframes spin{to{transform:rotate(360deg)}}.processing-text{font-family:JetBrains Mono,monospace;font-size:.875rem;color:var(--text-secondary)}.results{display:none;margin-top:32px}.results.active{display:block;animation:fadeIn .4s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.stats-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;margin-bottom:24px}.stat-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:24px;text-align:center}.stat-label{font-family:JetBrains Mono,monospace;font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-secondary);margin-bottom:8px}.stat-value{font-size:1.75rem;font-weight:700}.stat-value.original{color:var(--text-secondary)}.stat-value.converted{color:var(--accent)}.stat-value.reduction{color:var(--success)}.stat-unit{font-size:.875rem;font-weight:500;opacity:.7}.file-list{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-bottom:24px}.file-list-header{padding:16px 20px;border-bottom:1px solid var(--border);font-family:JetBrains Mono,monospace;font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-secondary);display:flex;justify-content:space-between;align-items:center}.file-count{background:var(--accent-dim);color:var(--accent);padding:4px 10px;border-radius:12px;font-size:.7rem}.file-item{border-bottom:1px solid var(--border)}.file-item:last-child{border-bottom:none}.file-item-header{display:grid;grid-template-columns:1fr auto auto auto;gap:16px;align-items:center;padding:16px 20px;font-family:JetBrains Mono,monospace;font-size:.8rem;cursor:pointer;transition:background .2s ease}.file-item-header:hover{background:var(--bg-tertiary)}.file-name{color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:8px}.chevron{width:16px;height:16px;flex-shrink:0;transition:transform .2s ease;opacity:.5}.file-item.expanded .chevron{transform:rotate(90deg)}.file-original{color:var(--text-secondary);text-align:right}.file-converted{color:var(--accent);text-align:right}.file-reduction{color:var(--success);text-align:right;min-width:60px}.texture-details{display:none;background:var(--bg-primary);border-top:1px solid var(--border)}.file-item.expanded .texture-details{display:block}.texture-item{display:grid;grid-template-columns:1fr auto auto auto;gap:16px;align-items:center;padding:12px 20px 12px 44px;font-family:JetBrains Mono,monospace;font-size:.75rem;border-bottom:1px solid var(--border)}.texture-item:last-child{border-bottom:none}.texture-name{color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.texture-original{color:var(--text-secondary);text-align:right;opacity:.7}.texture-converted{color:var(--accent);text-align:right;opacity:.8}.texture-reduction{color:var(--success);text-align:right;min-width:60px;opacity:.8}.no-textures{padding:12px 20px 12px 44px;font-family:JetBrains Mono,monospace;font-size:.75rem;color:var(--text-secondary);opacity:.6}.download-btn{width:100%;padding:18px 32px;background:var(--accent);color:var(--bg-primary);border:none;border-radius:12px;font-family:Space Grotesk,sans-serif;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:10px}.download-btn:hover{background:#00e6b8;transform:translateY(-2px);box-shadow:0 8px 24px var(--accent-dim)}.download-btn:active{transform:translateY(0)}.download-btn svg{width:20px;height:20px}.reset-btn{width:100%;padding:14px 32px;background:transparent;color:var(--text-secondary);border:1px solid var(--border);border-radius:12px;font-family:Space Grotesk,sans-serif;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;margin-top:12px}.reset-btn:hover{border-color:var(--text-secondary);color:var(--text-primary)}.error{display:none;background:#ff6b4a1a;border:1px solid var(--warning);border-radius:12px;padding:16px 20px;margin-top:16px;font-family:JetBrains Mono,monospace;font-size:.8rem;color:var(--warning)}.error.active{display:block}@media (max-width: 600px){.stats-grid{grid-template-columns:1fr}.texture-item{grid-template-columns:1fr 1fr;gap:8px}.texture-name{grid-column:1 / -1}}