:root{--color-primary: #7C3AED;--color-primary-dark: #6D28D9;--color-primary-light: #EDE9FE;--color-primary-lighter: #F5F3FF;--color-primary-subtle: #FAFAFF;--color-success: #10B981;--color-success-light: #ECFDF5;--color-error: #EF4444;--color-error-light: #FEF2F2;--color-text: #1a1a1a;--color-text-secondary: #555;--color-text-muted: #767676;--color-bg: #fff;--color-bg-alt: #F9FAFB;--color-border: #e5e7eb;--font-family: "Source Sans 3", "Segoe UI", Arial, sans-serif;--max-width: 800px;--max-width-wide: 1100px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px}@font-face{font-family:"Source Sans 3";src:url(/fonts/source-sans-3-regular-ext.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"Source Sans 3";src:url(/fonts/source-sans-3-regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Source Sans 3";src:url(/fonts/source-sans-3-semibold-ext.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"Source Sans 3";src:url(/fonts/source-sans-3-semibold.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Source Sans 3";src:url(/fonts/source-sans-3-bold-ext.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"Source Sans 3";src:url(/fonts/source-sans-3-bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);color:var(--color-text);background:var(--color-bg);line-height:1.6;-webkit-font-smoothing:antialiased}img{max-width:100%;height:auto;display:block}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.container{max-width:var(--max-width-wide);margin:0 auto;padding:0 1.5rem}.container--narrow{max-width:var(--max-width)}.section{padding:4rem 0}.section--alt{background:var(--color-bg-alt)}.section h2{text-align:center;font-size:2rem;font-weight:700;margin-bottom:2.5rem;color:var(--color-text)}.site-header{padding:1rem 1.5rem;text-align:center;border-bottom:1px solid var(--color-border);background:var(--color-bg)}.site-header a{text-decoration:none;color:var(--color-text);display:inline-flex;align-items:center;gap:.5rem}.logo-icon{width:32px;height:32px}.logo-text{font-size:1.25rem;font-weight:700;color:var(--color-primary)}.hero{max-width:var(--max-width);margin:0 auto;padding:3rem 1.5rem 2rem;text-align:center}.hero h1{font-size:2.5rem;font-weight:700;color:var(--color-text);margin-bottom:.75rem;line-height:1.2}.hero-subtitle{font-size:1.125rem;color:var(--color-text-secondary);max-width:600px;margin:0 auto 2rem}.upload-area{border:2px dashed #A78BFA;border-radius:var(--radius-lg);padding:3rem 2rem;cursor:pointer;transition:all .2s ease;min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--color-primary-subtle)}.upload-area:hover,.upload-area:focus-visible{border-color:var(--color-primary);background:var(--color-primary-light)}.upload-area.drag-over{border-color:var(--color-primary);border-style:solid;background:var(--color-primary-light);transform:scale(1.01)}.upload-icon{margin-bottom:1rem}.upload-text{font-size:1.125rem;font-weight:600;color:var(--color-text);margin-bottom:.25rem}.upload-subtext{font-size:.875rem;color:var(--color-text-secondary)}.upload-link{color:var(--color-primary);font-weight:600;text-decoration:underline;text-underline-offset:2px}.compression-options,.file-list-wrapper{margin-top:1.5rem;text-align:left}.batch-summary{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:var(--color-primary-light);border-radius:var(--radius-md) var(--radius-md) 0 0;font-size:.9375rem;color:var(--color-text);font-weight:600}.batch-summary-size{color:var(--color-text-secondary);font-weight:400}.file-list-container{max-height:300px;overflow-y:auto;border:1px solid var(--color-border);border-top:none;border-radius:0 0 var(--radius-md) var(--radius-md)}.file-list{list-style:none;margin:0;padding:0}.file-item{display:flex;align-items:center;gap:.75rem;padding:.625rem 1rem;border-bottom:1px solid var(--color-border);font-size:.875rem;transition:background .15s ease}.file-item:last-child{border-bottom:none}.file-item-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}.file-item-size{color:var(--color-text-muted);white-space:nowrap;font-size:.8125rem}.file-item-status{white-space:nowrap;font-size:.8125rem;font-weight:600;min-width:80px;text-align:right}.file-item[data-state=pending] .file-item-status{color:var(--color-text-muted)}.file-item[data-state=compressing]{background:var(--color-primary-lighter)}.file-item[data-state=compressing] .file-item-status{color:var(--color-primary)}.file-item[data-state=complete] .file-item-status{color:var(--color-success)}.file-item[data-state=error] .file-item-status{color:var(--color-error)}.file-item-actions{display:flex;align-items:center;gap:.25rem}.file-item-remove{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:none;background:none;cursor:pointer;color:var(--color-text-muted);border-radius:var(--radius-sm);font-size:1rem;line-height:1;transition:all .15s ease;padding:0}.file-item-remove:hover{color:var(--color-error);background:var(--color-error-light)}.file-item-download{display:none;align-items:center;justify-content:center;width:24px;height:24px;border:none;background:none;cursor:pointer;color:var(--color-success);border-radius:var(--radius-sm);font-size:.875rem;line-height:1;transition:all .15s ease;padding:0;text-decoration:none}.file-item[data-state=complete] .file-item-download{display:inline-flex}.file-item-download:hover{background:var(--color-success-light)}.level-selector{border:none;display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.25rem}.level-option{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;border:2px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all .15s ease}.level-option:hover{border-color:#c4b5fd}.level-option input[type=radio]{position:absolute;opacity:0;width:0;height:0}.level-check{flex-shrink:0;width:20px;height:20px;border-radius:50%;border:2px solid var(--color-border);transition:all .15s ease;position:relative}.level-option input[type=radio]:checked~.level-check{border-color:var(--color-primary);background:var(--color-primary)}.level-option input[type=radio]:checked~.level-check:after{content:"";position:absolute;top:4px;left:4px;width:8px;height:8px;border-radius:50%;background:#fff}.level-option:has(input:checked){border-color:var(--color-primary);background:var(--color-primary-lighter)}.level-option input[type=radio]:focus-visible~.level-check{outline:2px solid var(--color-primary);outline-offset:2px}.level-content{display:flex;flex-direction:column;gap:.125rem}.level-name{font-weight:600;font-size:1rem;color:var(--color-text)}.level-desc{font-size:.8125rem;color:var(--color-text-secondary)}.level-badge{display:inline-block;font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:.125rem .5rem;border-radius:999px;margin-top:.25rem}.level-badge--recommended{background:var(--color-success-light);color:var(--color-success)}.level-badge--warning{background:#fef3c7;color:#d97706}.btn-compress{width:100%;padding:.875rem 2rem;font-size:1.125rem;font-weight:700;font-family:var(--font-family);color:#fff;background:var(--color-primary);border:none;border-radius:var(--radius-md);cursor:pointer;transition:background .15s ease}.btn-compress:hover{background:var(--color-primary-dark)}.btn-compress:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.btn-download{display:inline-block;padding:.875rem 2.5rem;font-size:1.125rem;font-weight:700;font-family:var(--font-family);color:#fff;background:var(--color-success);border:none;border-radius:var(--radius-md);text-decoration:none;cursor:pointer;transition:background .15s ease}.btn-download:hover{background:#059669}.btn-new{display:inline-block;margin-top:.75rem;padding:.5rem 1.5rem;font-size:.9375rem;font-weight:600;font-family:var(--font-family);color:var(--color-primary);background:transparent;border:2px solid var(--color-primary);border-radius:var(--radius-md);cursor:pointer;transition:all .15s ease}.btn-new:hover{background:var(--color-primary-light)}.progress-area{margin-top:2rem;text-align:center}.progress-bar{width:100%;height:8px;background:var(--color-primary-light);border-radius:4px;overflow:hidden;margin-bottom:1rem}.progress-fill{height:100%;background:var(--color-primary);border-radius:4px;width:0%;transition:width .3s ease}.progress-fill--indeterminate{width:30%;animation:indeterminate 1.5s ease-in-out infinite}@keyframes indeterminate{0%{transform:translate(-100%)}to{transform:translate(400%)}}.progress-text{font-size:.9375rem;color:var(--color-text-secondary)}.batch-progress{margin-top:2rem;text-align:center}.batch-progress-label{font-size:1.125rem;font-weight:700;color:var(--color-text);margin-bottom:1rem}.batch-results{margin-top:2rem;text-align:center}.batch-results-summary{font-size:1.125rem;font-weight:600;color:var(--color-text);margin-bottom:1.5rem}.batch-results-actions{display:flex;flex-direction:column;align-items:center;gap:.75rem}.btn-download-all{display:inline-block;padding:.875rem 2.5rem;font-size:1.125rem;font-weight:700;font-family:var(--font-family);color:#fff;background:var(--color-success);border:none;border-radius:var(--radius-md);text-decoration:none;cursor:pointer;transition:background .15s ease}.btn-download-all:hover{background:#059669}.btn-download-all:focus-visible{outline:2px solid var(--color-success);outline-offset:2px}.results-notice{margin-top:1rem;padding:.75rem 1rem;background:#fef3c7;border-radius:var(--radius-md);font-size:.8125rem;color:#92400e;line-height:1.5}.error-area{margin-top:2rem;text-align:center;padding:1.5rem;background:var(--color-error-light);border-radius:var(--radius-md)}.error-text{color:var(--color-error);font-weight:600;margin-bottom:1rem}.steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;text-align:center}.step{padding:1.5rem 1rem}.step-number{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:var(--color-primary);color:#fff;font-size:1.25rem;font-weight:700;margin-bottom:1rem}.step h3{font-size:1.125rem;font-weight:700;margin-bottom:.5rem}.step p{font-size:.9375rem;color:var(--color-text-secondary)}.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}.feature-card{padding:1.5rem;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-bg);transition:box-shadow .2s ease}.feature-card:hover{box-shadow:0 4px 12px #00000014}.feature-icon{margin-bottom:1rem}.feature-card h3{font-size:1.0625rem;font-weight:700;margin-bottom:.5rem}.feature-card p{font-size:.9375rem;color:var(--color-text-secondary);line-height:1.5}.about-content p{font-size:1.0625rem;color:var(--color-text-secondary);margin-bottom:1.25rem;line-height:1.7}.about-content p:last-child{margin-bottom:0}.faq-list{display:flex;flex-direction:column;gap:0}.faq-item{border-bottom:1px solid var(--color-border)}.faq-item:first-child{border-top:1px solid var(--color-border)}.faq-question{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 0;font-size:1.0625rem;font-weight:600;cursor:pointer;list-style:none}.faq-question::-webkit-details-marker{display:none}.faq-question:after{content:"";flex-shrink:0;width:20px;height:20px;margin-left:1rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5l5 5 5-5' stroke='%23555' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;transition:transform .2s ease}.faq-item[open] .faq-question:after{transform:rotate(180deg)}.faq-answer{padding:0 0 1.25rem}.faq-answer p{font-size:.9375rem;color:var(--color-text-secondary);line-height:1.6}.site-footer{padding:2.5rem 1.5rem;text-align:center;border-top:1px solid var(--color-border);background:var(--color-bg)}.footer-brand{font-size:1.125rem;font-weight:700;color:var(--color-primary);margin-bottom:.5rem}.footer-privacy{font-size:.875rem;color:var(--color-text-secondary);margin-bottom:.25rem}.footer-copy{font-size:.8125rem;color:var(--color-text-muted)}.footer-links{font-size:.875rem;color:var(--color-text-secondary);margin:.5rem 0}.footer-links a{color:var(--color-text-secondary);text-decoration:none;margin:0 .35rem}.footer-links a:hover{color:var(--color-primary);text-decoration:underline}@media(max-width:768px){.hero h1{font-size:1.875rem}.hero-subtitle{font-size:1rem}.steps{grid-template-columns:1fr;gap:1rem}.features-grid{grid-template-columns:repeat(2,1fr);gap:1rem}.section{padding:3rem 0}.section h2{font-size:1.625rem}}@media(max-width:480px){.hero{padding:2rem 1rem 1.5rem}.hero h1{font-size:1.625rem}.upload-area{padding:2rem 1.25rem;min-height:160px}.features-grid{grid-template-columns:1fr}.level-option{padding:.875rem 1rem}.batch-summary{flex-direction:column;align-items:flex-start;gap:.25rem}.file-item{flex-wrap:wrap;gap:.25rem .5rem}.file-item-name{flex-basis:calc(100% - 40px)}.file-item-status{min-width:unset;text-align:left}.file-list-container{max-height:200px}}