:root{--background: 0 0% 100%;--foreground: 240 10% 3.9%;--card: 0 0% 100%;--card-foreground: 240 10% 3.9%;--popover: 0 0% 100%;--popover-foreground: 240 10% 3.9%;--primary: 240 5.9% 10%;--primary-foreground: 0 0% 98%;--secondary: 240 4.8% 95.9%;--secondary-foreground: 240 5.9% 10%;--muted: 240 4.8% 95.9%;--muted-foreground: 240 3.8% 46.1%;--accent: 240 4.8% 95.9%;--accent-foreground: 240 5.9% 10%;--destructive: 0 84.2% 60.2%;--destructive-foreground: 0 0% 98%;--border: 240 5.9% 90%;--input: 240 5.9% 90%;--ring: 240 5.9% 10%;--radius: .5rem;--text-xs: .6875rem;--text-sm: .75rem;--text-base: .875rem;--text-lg: 1.125rem}.dark{--background: 240 10% 3.9%;--foreground: 0 0% 98%;--card: 240 10% 3.9%;--card-foreground: 0 0% 98%;--popover: 240 10% 3.9%;--popover-foreground: 0 0% 98%;--primary: 0 0% 98%;--primary-foreground: 240 5.9% 10%;--secondary: 240 3.7% 15.9%;--secondary-foreground: 0 0% 98%;--muted: 240 3.7% 15.9%;--muted-foreground: 240 5% 64.9%;--accent: 240 3.7% 15.9%;--accent-foreground: 0 0% 98%;--destructive: 0 62.8% 30.6%;--destructive-foreground: 0 0% 98%;--border: 240 3.7% 15.9%;--input: 240 3.7% 15.9%;--ring: 240 4.9% 83.9%}*{box-sizing:border-box}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:hsl(var(--background));color:hsl(var(--foreground));line-height:1.5;margin:0;min-height:100vh;-webkit-font-smoothing:antialiased}#app{display:flex;flex-direction:column;min-height:100vh}.hidden{display:none!important}.top-bar{display:flex;justify-content:space-between;align-items:center;height:3.5rem;padding:0 1rem;border-bottom:1px solid hsl(var(--border));background-color:hsl(var(--background));flex-shrink:0}.top-bar-brand{display:flex;align-items:center;gap:.625rem;cursor:pointer;text-decoration:none;color:inherit;user-select:none;border:none;background:none;font:inherit;border-radius:calc(var(--radius) - 2px);padding:.25rem .5rem;margin:-.25rem -.5rem;transition:background-color .15s}.top-bar-brand:hover{background-color:hsl(var(--accent))}.brand-logo{width:1.5rem;height:1.5rem;flex-shrink:0}.brand-name{font-size:1rem;font-weight:600;color:hsl(var(--foreground));white-space:nowrap}.brand-tagline{font-size:var(--text-sm);color:hsl(var(--muted-foreground));white-space:nowrap}.file-name-bar{font-size:var(--text-base);font-weight:500;color:hsl(var(--muted-foreground));padding:0 .25rem .5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-bar-actions{display:flex;gap:.5rem;align-items:center}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:calc(var(--radius) - 2px);font-size:var(--text-base);font-weight:500;height:2.25rem;padding:0 .875rem;border:none;cursor:pointer;transition:background-color .15s,border-color .15s}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:focus-visible{outline:none;box-shadow:0 0 0 2px hsl(var(--background)),0 0 0 4px hsl(var(--ring))}.btn-primary{background-color:hsl(var(--primary));color:hsl(var(--primary-foreground))}.btn-primary:hover:not(:disabled){background-color:hsl(var(--primary) / .9)}.btn-secondary{background-color:hsl(var(--secondary));color:hsl(var(--secondary-foreground));border:1px solid hsl(var(--border))}.btn-secondary:hover:not(:disabled){background-color:hsl(var(--accent))}.btn-ghost{background-color:transparent;color:hsl(var(--foreground))}.btn-ghost:hover:not(:disabled){background-color:hsl(var(--accent))}.btn-icon{width:2.25rem;height:2.25rem;padding:0}.btn-sm{height:2rem;padding:0 .75rem;font-size:var(--text-base)}.btn-tool{width:100%;justify-content:flex-start;background-color:transparent;color:hsl(var(--foreground));border:none;height:2.25rem;padding:0 .75rem}.btn-tool:hover:not(:disabled){background-color:hsl(var(--accent))}.btn-tool.active{background-color:hsl(var(--accent));font-weight:500}.btn-tool-half{flex:1}.btn-group{display:flex;align-items:center;gap:.25rem}.btn-group-label{font-size:var(--text-base);color:hsl(var(--foreground));pointer-events:none;flex:1}.btn-icon .icon-moon{display:none}.btn-icon .icon-sun,.dark .btn-icon .icon-moon{display:block}.dark .btn-icon .icon-sun{display:none}.card{background-color:hsl(var(--card));color:hsl(var(--card-foreground));border:1px solid hsl(var(--border));border-radius:var(--radius)}.dropzone-view{flex:1;display:flex;justify-content:center;align-items:center;padding:2rem}.upload-section{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:600px;padding:5rem 2.5rem;border:2px dashed hsl(var(--border));border-radius:var(--radius);background-color:hsl(var(--card));transition:all .2s ease;cursor:pointer}.upload-section:hover,.upload-section.drag-over{background-color:hsl(var(--muted) / .5);border-color:hsl(var(--primary) / .5);transform:scale(1.01)}.upload-section.drag-over{border-style:solid;border-color:hsl(var(--primary));box-shadow:0 0 0 4px hsl(var(--primary) / .1)}.upload-icon{color:hsl(var(--muted-foreground));margin-bottom:1.5rem}.upload-title{margin:0;font-size:var(--text-lg);font-weight:600;color:hsl(var(--foreground))}.upload-subtitle{margin:.25rem 0 0;font-size:var(--text-base);color:hsl(var(--muted-foreground))}.upload-formats{margin-top:1rem;padding:.25rem .75rem;font-size:var(--text-sm);font-weight:500;color:hsl(var(--muted-foreground));background-color:hsl(var(--muted));border-radius:9999px}#file-picker{display:none}.result-view{flex:1;display:grid;grid-template-columns:1fr 320px;grid-template-rows:1fr;padding:1rem;gap:1rem;min-height:0}.main-content{display:flex;flex-direction:column;min-height:0;max-width:100%}.preview-area{display:flex;align-items:center;justify-content:center;padding:1rem;overflow:hidden;min-height:0;flex:1}.preview-card{display:flex;align-items:center;justify-content:center;max-width:100%;max-height:100%;border:none;box-shadow:none;background:transparent}.preview-wrapper{position:relative;display:inline-block;max-width:100%;max-height:100%}.preview-processing-indicator{position:absolute;top:1rem;right:1rem;width:1rem;height:1rem;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:preview-spin .6s linear infinite}@keyframes preview-spin{to{transform:rotate(360deg)}}#image-preview{max-width:100%;max-height:calc(100vh - 16rem);object-fit:contain;border-radius:var(--radius);display:block;box-shadow:0 4px 12px #00000026}.tool-sidebar{display:flex;flex-direction:column;border:1px solid hsl(var(--border));border-radius:var(--radius);background-color:hsl(var(--card));overflow:hidden}.tool-buttons{display:flex;flex-direction:column;gap:.125rem;padding:.75rem;border-bottom:1px solid hsl(var(--border))}.tool-panel{flex:1;overflow-y:auto;padding:0}.tool-panel-content{padding:.75rem}.tool-panel-content.hidden{display:none}.tool-panel-title{font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:hsl(var(--muted-foreground));margin:0 0 .75rem}.tool-panel-actions{display:flex;gap:.5rem;margin-top:.75rem;padding-top:.75rem;border-top:1px solid hsl(var(--border))}.sidebar-footer{display:flex;gap:.375rem;padding:.75rem;border-top:1px solid hsl(var(--border));margin-top:auto}.sidebar-footer .btn-primary{flex:1}.sidebar-footer .btn-secondary{flex:0 0 auto}.info-panel{display:flex;flex-direction:column;margin-top:.75rem;border:1px solid hsl(var(--border));border-radius:var(--radius);background-color:hsl(var(--card))}.info-bar{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem 1rem;font-size:var(--text-sm);font-variant-numeric:tabular-nums;color:hsl(var(--muted-foreground))}.info-bar-left{display:flex;align-items:center;gap:.5rem}.info-separator{color:hsl(var(--border))}.info-details.hidden{display:none}.info-details-content{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.25rem 1rem;padding:.75rem 1rem;font-size:var(--text-sm)}.metadata-item{display:flex;justify-content:space-between;align-items:center;padding:.25rem 0}.metadata-label{color:hsl(var(--muted-foreground))}.metadata-value{font-weight:500;color:hsl(var(--foreground));font-variant-numeric:tabular-nums;text-align:right}.crop-overlay{position:absolute;inset:0;background-color:#00000080;cursor:crosshair;border-radius:var(--radius);overflow:hidden;user-select:none;-webkit-user-select:none;-moz-user-select:none}.crop-selection{position:absolute;border:2px solid white;box-shadow:0 0 0 9999px #00000080;cursor:move;box-sizing:border-box}.crop-handle{position:absolute;width:10px;height:10px;background-color:#fff;border:1px solid #333;border-radius:2px}.crop-handle.nw{top:-5px;left:-5px;cursor:nw-resize}.crop-handle.ne{top:-5px;right:-5px;cursor:ne-resize}.crop-handle.sw{bottom:-5px;left:-5px;cursor:sw-resize}.crop-handle.se{bottom:-5px;right:-5px;cursor:se-resize}.crop-dimensions{position:absolute;top:-25px;left:50%;transform:translate(-50%);background-color:#000000bf;color:#fff;padding:2px 8px;border-radius:4px;font-size:var(--text-xs);font-weight:500;white-space:nowrap;pointer-events:none;font-variant-numeric:tabular-nums}.resize-input-group{display:flex;gap:.5rem}.resize-label{display:flex;flex-direction:column;gap:.25rem;font-size:var(--text-sm);font-weight:500;color:hsl(var(--foreground));flex:1}.resize-label input[type=number],.resize-label select{height:2rem;padding:0 .5rem;font-size:var(--text-base);border:1px solid hsl(var(--input));border-radius:calc(var(--radius) - 2px);background-color:hsl(var(--background));color:hsl(var(--foreground));font-variant-numeric:tabular-nums}.resize-label input[type=number]:focus,.resize-label select:focus{outline:none;border-color:hsl(var(--ring));box-shadow:0 0 0 2px hsl(var(--ring) / .2)}.resize-label input[type=number]{-moz-appearance:textfield}.resize-label input[type=number]::-webkit-inner-spin-button,.resize-label input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.checkbox-label{display:flex;align-items:center;gap:.5rem;font-size:var(--text-sm);font-weight:500;color:hsl(var(--foreground));cursor:pointer;margin-top:.5rem}.checkbox-label input[type=checkbox]{width:.875rem;height:.875rem;cursor:pointer;accent-color:hsl(var(--primary))}.adjust-group{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.75rem}.adjust-group:last-of-type{margin-bottom:0}.adjust-group-label{font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:hsl(var(--muted-foreground));margin-bottom:.25rem}.adjust-slider{display:grid;grid-template-columns:70px 1fr 32px;align-items:center;gap:.5rem;cursor:pointer}.adjust-slider-label{font-size:var(--text-sm);font-weight:500;color:hsl(var(--foreground))}.adjust-slider input[type=range]{width:100%;height:4px;border-radius:2px;background:hsl(var(--muted));outline:none;cursor:pointer;-webkit-appearance:none;appearance:none}.adjust-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:hsl(var(--primary));cursor:pointer;border:2px solid hsl(var(--background));box-shadow:0 1px 3px #0003;transition:transform .1s ease}.adjust-slider input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.1)}.adjust-slider input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:hsl(var(--primary));cursor:pointer;border:2px solid hsl(var(--background));box-shadow:0 1px 3px #0003;transition:transform .1s ease}.adjust-slider input[type=range]::-moz-range-thumb:hover{transform:scale(1.1)}.adjust-slider-value{font-size:var(--text-xs);font-weight:500;color:hsl(var(--muted-foreground));font-variant-numeric:tabular-nums;text-align:right}.tool-panel-title,.adjust-group-label,.adjust-slider-value,.adjust-slider-label{line-height:1.25}.export-presets{display:flex;flex-direction:column;gap:.125rem;margin-bottom:.75rem}.export-formats{display:flex;gap:.375rem;margin-bottom:.75rem}.export-quality{margin-bottom:.25rem}.export-estimate{font-size:var(--text-sm);opacity:.6;margin-left:auto}.export-too-large{font-size:var(--text-sm);margin-left:4px}.export-hint{font-size:var(--text-sm);opacity:.7;margin:4px 0}.export-custom-row{display:flex;gap:8px;align-items:center;margin-top:4px;padding-left:24px}.export-custom-label{font-size:var(--text-sm)}.export-custom-input{width:70px;margin-left:4px}@media(max-width:768px){.brand-tagline{display:none}.result-view{grid-template-columns:1fr;grid-template-rows:auto auto;padding:.75rem;gap:.75rem}.preview-area{padding:1rem;min-height:300px}#image-preview{max-height:50vh}.tool-sidebar{display:contents;border-left:none}.tool-buttons{grid-area:toolbar;flex-direction:row;justify-content:center;flex-wrap:wrap;border-left:none;border-bottom:1px solid hsl(var(--border));background-color:hsl(var(--card))}.tool-buttons .btn-tool{width:auto;flex:0 0 auto}.tool-buttons .btn-group{flex:0 0 auto}.tool-panel{grid-area:panel;background-color:hsl(var(--card));border-bottom:1px solid hsl(var(--border))}.tool-panel:empty,.tool-panel:not(:has(.tool-panel-content:not(.hidden))){display:none}.sidebar-footer{display:none}.adjust-slider{grid-template-columns:60px 1fr 28px}}@media(max-width:480px){.top-bar{padding:0 .75rem}.brand-name{font-size:var(--text-base)}.btn-primary svg{display:none}.tool-buttons .btn-tool span:not(.sr-only){display:none}.tool-buttons .btn-tool{padding:0 .5rem}}