:root{--bg-primary: #f4f7fa;--bg-secondary: #ffffff;--bg-secondary-hover: #f9fafb;--text-primary: #1a202c;--text-secondary: #4a5568;--text-tertiary: #718096;--border-color: rgba(0, 0, 0, .07);--pdf-primary: #ef4444;--pdf-secondary: #f43f5e;--accent: #ef4444;--accent-gradient: linear-gradient(135deg, #ef4444, #ec4899);--shadow-color: rgba(99, 102, 241, .1);--shadow-color-darker: rgba(99, 102, 241, .2);--card-border-light: #cbd5e1;--card-border-dark: #334155;--btn-action-bg: #2563eb;--btn-action-text: #ffffff;--btn-action-hover: #1d4ed8;--btn-neutral-bg: #e5e7eb;--btn-neutral-text: #374151;--btn-neutral-hover: #d1d5db}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body.dark{--bg-primary: #0f172a;--bg-secondary: #1e293b;--bg-secondary-hover: #28364d;--text-primary: #e2e8f0;--text-secondary: #94a3b8;--text-tertiary: #64748b;--border-color: rgba(255, 255, 255, .1);--shadow-color: rgba(0, 0, 0, .2);--shadow-color-darker: rgba(0, 0, 0, .3);--btn-action-bg: #3b82f6;--btn-action-text: #ffffff;--btn-action-hover: #2563eb;--btn-neutral-bg: #334155;--btn-neutral-text: #e2e8f0;--btn-neutral-hover: #475569}main h1{color:var(--text-primary);font-weight:700;font-size:2.25rem}body.dark main h1{color:#fff}main>p{color:var(--text-secondary);font-size:1.125rem}.upload-card{background:var(--bg-secondary);border:3px dashed var(--card-border-light);border-radius:1.5rem;padding:3rem 2rem;text-align:center;cursor:pointer;transition:all .3s ease;box-shadow:0 10px 25px var(--shadow-color);position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px}body.dark .upload-card{background:var(--bg-secondary);border-color:var(--card-border-dark)}.upload-card:hover{transform:translateY(-5px) scale(1.02);box-shadow:0 15px 35px var(--shadow-color-darker);border-color:var(--pdf-primary)}body.dark .upload-card:hover{border-color:var(--pdf-primary)}.upload-card-icon{font-size:4rem;line-height:1;margin-bottom:1.5rem;filter:drop-shadow(0 5px 15px rgba(0,0,0,.1))}body.dark .upload-card-icon{filter:drop-shadow(0 5px 15px rgba(0,0,0,.2))}.upload-card-title{color:var(--text-primary);font-size:1.5rem;font-weight:700;margin-bottom:.5rem}.upload-card-desc{color:var(--text-secondary);font-size:1rem}.btn{padding:.75rem 1.5rem;border-radius:.5rem;cursor:pointer;transition:all .2s ease;font-weight:600;text-align:center;display:inline-flex;align-items:center;justify-content:center;border:none;font-size:.9rem}.btn-primary{background:var(--accent-gradient);color:#fff;box-shadow:0 4px 15px #ef444440}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #ef444459}.btn-success{background:#16a34a;color:#fff}.btn-success:hover:not(:disabled){background:#15803d}.btn-action{background-color:var(--btn-action-bg);color:var(--btn-action-text)}.btn-action:hover{background-color:var(--btn-action-hover)}.btn-neutral{background-color:var(--btn-neutral-bg);color:var(--btn-neutral-text)}.btn-neutral:hover{background-color:var(--btn-neutral-hover)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn.loading{position:relative;pointer-events:none}.btn.loading:after{content:"";position:absolute;width:16px;height:16px;top:50%;left:50%;margin-left:-8px;margin-top:-8px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:button-spin .6s linear infinite}@keyframes button-spin{to{transform:rotate(360deg)}}#compressModal{-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);animation:fadeIn .4s cubic-bezier(.4,0,.2,1);background:radial-gradient(circle at top right,rgba(239,68,68,.05),transparent 70%),radial-gradient(circle at bottom left,rgba(236,72,153,.05),transparent 70%)}@keyframes fadeIn{0%{opacity:0;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}to{opacity:1;-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%)}}.modal-content-wrapper{color:var(--text-primary);animation:slideUp .4s cubic-bezier(.34,1.56,.64,1),borderGlow 3s ease-in-out infinite}@keyframes slideUp{0%{transform:translateY(30px) scale(.95);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.modal-glass-bg{background:linear-gradient(135deg,#f4f7fae6,#ffffffd9);-webkit-backdrop-filter:blur(40px) saturate(200%);backdrop-filter:blur(40px) saturate(200%)}body.dark .modal-glass-bg{background:linear-gradient(135deg,#0f172ad9,#1e293be6);-webkit-backdrop-filter:blur(40px) saturate(150%);backdrop-filter:blur(40px) saturate(150%)}.modal-content-wrapper h3{color:#1a202c!important;text-shadow:none!important}.modal-content-wrapper p{color:#4a5568!important}body.dark .modal-content-wrapper h3{color:#fff!important}body.dark .modal-content-wrapper p{color:#d1d5db!important}.glass-column{background:var(--bg-secondary);border:1px solid var(--border-color)}body.dark .glass-column{background:var(--bg-primary)}.glass-column h4{color:var(--text-primary)}.glass-column label,.glass-column .font-semibold,.glass-column span.font-semibold{color:var(--text-primary)!important}body.dark .glass-column label,body.dark .glass-column .font-semibold,body.dark .glass-column span.font-semibold{color:#e2e8f0!important}span[id=compressFileCount]{color:#fff!important;font-weight:700}.glass-column input[type=range]{background:var(--border-color)}select.styled-select{background-color:var(--bg-primary);border:1px solid var(--border-color);color:var(--text-primary)}body.dark select.styled-select{background-color:var(--bg-secondary-hover);border-color:var(--border-color)}input[type=radio]:checked+div{border-width:2px}.file-list-item{background:var(--bg-secondary);transition:all .2s ease}.file-list-item:hover{background:var(--bg-secondary-hover);transform:translate(2px);box-shadow:0 2px 8px #ef444433}.file-list-item p{color:var(--text-secondary)}.file-list-item p.font-semibold{color:var(--text-primary)!important}#compressFileList{max-height:60vh;overflow-y:auto;padding-right:.5rem}.filename-text{word-break:break-all;white-space:normal;line-height:1.25}@keyframes borderGlow{0%,to{border-color:#ef444480}50%{border-color:#ec4899b3}}.sortable-ghost{opacity:.4!important;background:linear-gradient(135deg,#ef444433,#ec489933)!important;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important;transform:scale(.98)!important}.sortable-drag{transform:scale(1.08) rotate(2deg)!important;box-shadow:0 25px 50px -12px #ef444480,0 20px 25px -5px #0000004d!important;z-index:1000!important;opacity:1!important}.drag-over{transform:scale(1.02);border-color:var(--accent)!important;border-style:solid!important;background:#ef44440d}#compressFileList::-webkit-scrollbar{width:10px;height:10px}#compressFileList::-webkit-scrollbar-track{background:#0000000d;border-radius:10px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}#compressFileList::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#ef4444,#ec4899);border-radius:10px;box-shadow:0 0 10px #ef444480}#compressFileList::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#dc2626,#db2777)}body.dark #compressFileList::-webkit-scrollbar-track{background:#ffffff0d}.flex-shrink-0.px-6.py-4{background:var(--bg-primary);border-color:var(--border-color)}body.dark .flex-shrink-0.px-6.py-4{background:var(--bg-secondary)}.flex-shrink-0.px-6.py-4 span[id=compressStatusText]{color:var(--text-primary)!important;font-weight:600}body.modal-open{overflow:hidden}@media(max-width:640px){.glass-column label[class*=flex-1]{flex:1 1 100%!important}div[class*="flex gap-3"]:has(input[name=compressionMode]){flex-direction:column!important}.glass-column{padding:1rem!important}.btn{min-height:44px;padding:.75rem 1rem}.modal-content-wrapper>div:first-child{padding:.75rem!important}#compressFileList{max-height:250px}}
