:root{--bg-color:#0f172a;--bg-gradient:radial-gradient(circle at top right, #1e293b, #0f172a);--surface-color:#1e293bb3;--surface-border:#ffffff1a;--text-primary:#f8fafc;--text-secondary:#94a3b8;--primary-color:#3b82f6;--primary-hover:#2563eb;--secondary-color:#475569;--secondary-hover:#334155;--success-color:#10b981;--error-color:#ef4444;--accent-color:#8b5cf6;--radius-lg:16px;--radius-md:8px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-color);background-image:var(--bg-gradient);color:var(--text-primary);min-height:100vh;padding:var(--spacing-lg);justify-content:center;align-items:center;font-family:Inter,sans-serif;line-height:1.5;display:flex}.app-container{background:var(--surface-color);-webkit-backdrop-filter:blur(12px);border:1px solid var(--surface-border);border-radius:var(--radius-lg);padding:var(--spacing-xl);gap:var(--spacing-xl);flex-direction:column;width:100%;max-width:600px;display:flex;box-shadow:0 25px 50px -12px #00000080}.header{text-align:center}.logo{justify-content:center;align-items:center;gap:var(--spacing-sm);color:var(--primary-color);margin-bottom:var(--spacing-sm);display:flex}.logo h1{color:var(--text-primary);font-size:1.5rem;font-weight:600}.subtitle{color:var(--text-secondary);font-size:.9rem;font-weight:400}.drop-zone{border:2px dashed var(--surface-border);border-radius:var(--radius-lg);padding:var(--spacing-xl);text-align:center;cursor:pointer;background:#ffffff05;transition:all .3s;position:relative}.drop-zone:hover,.drop-zone.dragover{border-color:var(--primary-color);background:#3b82f60d}.drop-zone.dragover{transform:scale(1.02)}.drop-zone-content{align-items:center;gap:var(--spacing-md);pointer-events:none;flex-direction:column;display:flex}.upload-icon{color:var(--primary-color);transition:transform .3s}.drop-zone:hover .upload-icon{transform:translateY(-5px)}.drop-zone h2{font-size:1.1rem;font-weight:500}.drop-zone p{color:var(--text-secondary);font-size:.85rem}.hidden-input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;top:0;left:0}.file-list{border-radius:var(--radius-md);padding:var(--spacing-md);background:#0003}.file-list h3{color:var(--text-secondary);margin-bottom:var(--spacing-sm);font-size:.9rem;font-weight:500}.file-list ul{gap:var(--spacing-sm);flex-direction:column;max-height:150px;list-style:none;display:flex;overflow-y:auto}.file-list li{align-items:center;gap:8px;font-size:.85rem;display:flex}.file-list li:before{content:"";background:var(--accent-color);border-radius:50%;width:6px;height:6px;display:inline-block}.actions{gap:var(--spacing-md);display:flex}.btn{padding:12px var(--spacing-md);border-radius:var(--radius-md);cursor:pointer;border:none;flex:1;justify-content:center;align-items:center;gap:8px;font-family:inherit;font-size:.95rem;font-weight:500;transition:all .2s;display:flex}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn-primary{background:var(--primary-color);color:#fff;flex:2}.btn-primary:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-2px);box-shadow:0 4px 12px #3b82f64d}.btn-secondary{background:var(--secondary-color);color:#fff}.btn-secondary:hover:not(:disabled){background:var(--secondary-hover)}.status-message{border-radius:var(--radius-md);align-items:center;gap:8px;padding:10px;font-size:.9rem;display:flex}.status-message.success{color:var(--success-color);background:#10b9811a;border:1px solid #10b98133}.status-message.error{color:var(--error-color);background:#ef44441a;border:1px solid #ef444433}.status-message.processing{color:var(--primary-color);background:#3b82f61a;border:1px solid #3b82f633}.hidden{display:none!important}.footer{text-align:center;color:var(--text-secondary);border-top:1px solid var(--surface-border);padding-top:var(--spacing-lg);font-size:.75rem}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#0000001a;border-radius:4px}::-webkit-scrollbar-thumb{background:var(--secondary-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--secondary-hover)}