:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";line-height:1.5;font-weight:400;color-scheme:dark;color:#ffffffeb;background:#0f1115;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0}.page{display:flex;flex-direction:column;min-height:100dvh;background:radial-gradient(1200px 600px at 10% -10%,rgba(100,108,255,.15),transparent),radial-gradient(1200px 600px at 110% 10%,rgba(97,218,251,.12),transparent),linear-gradient(180deg,#111114,#0e0e10);color:#e6e6e6}.header{display:flex;justify-content:space-between;align-items:center;padding:16px 16px 0}.brand{font-weight:700;letter-spacing:.5px;font-size:16px;color:#fff;display:flex;align-items:center;gap:10px}.logo-icon{flex:0 0 auto}.brand-text{font-weight:800;letter-spacing:.2px}.link{background:transparent;color:#8ea0ff;border:none;cursor:pointer}.count{color:#a9b0bf;font-size:14px}.container{width:100%;max-width:920px;margin:0 auto;padding:24px 16px 40px;text-align:center}.title{margin:8px 0;font-size:clamp(24px,5vw,40px);line-height:1.1;letter-spacing:-.02em}.subtitle{margin:0 0 20px;color:#b7b7b7}.dropzone{border:1px dashed rgba(142,160,255,.4);background:#ffffff05;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:16px;padding:28px;cursor:pointer;transition:border-color .2s ease,background .2s ease}.dropzone:hover{border-color:#8ea0ffe6;background:#8ea0ff0f}.dropzone-inner{display:grid;gap:8px;place-items:center}.icon{font-size:40px}.dz-title{font-weight:600}.dz-sub{color:#a9a9a9;font-size:14px}.preview{display:grid;gap:16px;margin-top:16px}.preview-img{max-width:100%;border-radius:12px;box-shadow:0 8px 24px #00000059}.actions{display:flex;gap:12px;justify-content:center}.primary,.ghost,.link{border-radius:12px;padding:10px 14px;font-weight:600;border:1px solid transparent;text-decoration:none}.primary{background:linear-gradient(135deg,#646cff,#61dafb);color:#0f1222}.primary:hover{filter:brightness(1.05)}.ghost{background:transparent;border-color:#2b2b36;color:#d7d7de}.ghost:hover{background:#1b1b21}.error{margin-top:12px;color:#ff8c8c}.footer{margin-top:28px;color:#9aa0a6;font-size:14px}.grid{margin-top:20px;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}.card{background:#ffffff08;border:1px solid #262632;border-radius:16px;padding:12px;display:grid;gap:10px}.thumb-wrap{position:relative;border-radius:12px;overflow:hidden;border:1px solid #2b2b36}.checker{position:absolute;inset:0;background-image:linear-gradient(45deg,#1d1f27 25%,transparent 25%),linear-gradient(-45deg,#1d1f27 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#1d1f27 75%),linear-gradient(-45deg,transparent 75%,#1d1f27 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px;opacity:.5}.thumb{display:block;width:100%;height:160px;object-fit:contain;background:transparent;position:relative}.filename{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;color:#cfd3dc}.meta{display:flex;gap:8px;color:#9aa0a6;font-size:12px}.row{display:flex;gap:10px;flex-wrap:wrap}.batch-actions{margin-top:16px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.compress-controls{display:flex;gap:12px;align-items:center;background:#ffffff05;border:1px solid #262632;border-radius:12px;padding:8px 12px;flex-wrap:wrap}.compress-controls label{display:grid;gap:4px;color:#cfd3dc;font-size:14px}.compress-controls select,.compress-controls input[type=range]{background:#14161c;border:1px solid #2b2b36;border-radius:8px;padding:6px 8px;color:#e6e6e6}.muted{color:#9aa0a6;font-size:14px}.seo-section{margin-top:40px;text-align:left;background:#ffffff05;border:1px solid #262632;border-radius:16px;padding:20px}.seo-section h2{margin:10px 0}.seo-section h3{margin:10px 0 6px}.features{margin:0 0 10px 18px}.features li{margin:4px 0}@media (min-width: 480px){.brand{font-size:18px}.primary,.ghost,.link{padding:12px 16px}}@media (min-width: 768px){.container{padding:32px 24px 56px}.grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}}@media (max-width: 400px){.thumb{height:130px}}