.photo-editor-container{display:flex;flex-direction:column;gap:20px}.editor-section{background-color:hsl(var(--card));border-color:hsl(var(--border));border-radius:12px;border-width:1px;color:hsl(var(--card-foreground));padding:12px;position:relative}.editor-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:12px;padding:0 8px}.editor-title{color:hsl(var(--foreground));font-size:18px;font-weight:600;margin:0}.cropper-container{height:400px;margin:0 auto;position:relative;width:300px}.editor-canvas{border-color:hsl(var(--border));border-radius:8px;border-width:1px;cursor:pointer;height:100%;width:100%}.editor-canvas,.preview-section-editor{background-color:hsl(var(--card))}.preview-section-editor{border-color:hsl(var(--border));border-radius:12px;border-width:1px;color:hsl(var(--card-foreground));padding:12px}.preview-title{color:hsl(var(--foreground));font-size:18px;font-weight:600;margin-bottom:10px;text-align:center}.preview-container-editor{align-items:center;background-color:hsl(var(--background));border-color:hsl(var(--border));border-radius:8px;border-width:1px;display:flex;flex-direction:column;justify-content:space-between;margin:0 auto;overflow:hidden;padding:8px;width:300px}.preview-canvas{height:auto;-o-object-fit:contain;object-fit:contain;width:100%}.download-section{margin-top:8px;width:100%}.download-btn,.download-section{display:flex;justify-content:center}.download-btn{align-items:center;border:none;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;gap:8px;padding:8px 16px;text-decoration:none;transition:all .2s}.download-btn.primary{background:#3b82f6;border:none;border-radius:6px;color:#fff}.download-btn.primary,.download-btn.secondary{align-items:center;cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:6px;justify-content:center;padding:8px 16px;transition:all .2s ease;width:100%}.download-btn.secondary{background:#e2e8f0;border:1px solid #cbd5e1;border-radius:6px;color:#334155}.download-btn.compact{font-size:13px;padding:6px 12px;width:auto}.download-btn:hover{box-shadow:0 4px 8px #00000026;transform:translateY(-1px)}.download-btn.secondary:hover{background:#cbd5e1}.download-icon{font-size:1.25rem;opacity:.8}.id-photo-processor{background-color:hsl(var(--background));color:hsl(var(--foreground));font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;min-height:100vh;padding:10px 0}.container{margin:0 auto;max-width:1400px;padding:0 5px}.header{color:hsl(var(--foreground));margin-bottom:20px;text-align:center}.header h1{background:var(--gradient-hero);-webkit-background-clip:text;background-clip:text;font-size:2.5rem;font-weight:700;margin-bottom:10px;-webkit-text-fill-color:transparent;text-shadow:0 4px 8px rgba(99,102,241,.2)}.header p{color:hsl(15 23 42)!important;font-size:1.1rem;font-weight:600;margin:0 auto;max-width:600px}.main-content{align-items:start;display:grid;gap:20px;grid-template-columns:1fr 1fr}@media (max-width:768px){.main-content{gap:20px;grid-template-columns:1fr}.header h1{font-size:2rem}.container{padding:0 5px}.preview-section,.upload-section{padding:15px}}.upload-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:var(--gradient-card);background-clip:padding-box;border:2px solid transparent;border:1px solid hsla(0,0%,100%,.2);border-radius:20px;color:hsl(var(--card-foreground));padding:30px}.upload-area{align-items:center;background:hsl(255 255 255);border:3px dashed hsl(148 163 184);border-radius:1rem;box-shadow:0 4px 12px hsl(15 23 42/.15);cursor:pointer;display:flex;flex-direction:column;height:200px;justify-content:center;position:relative;transition:all .3s ease;width:100%}.upload-area:hover{background:hsl(30 58 138/.05);border:3px dashed hsl(30 58 138);box-shadow:0 8px 25px hsl(30 58 138/.2);transform:translateY(-2px)}.upload-area.dragover{background:hsl(30 58 138/.1);border:3px dashed hsl(30 58 138);box-shadow:0 12px 35px hsl(30 58 138/.25);transform:scale(1.02)}.upload-icon{color:hsl(30 58 138)!important;filter:drop-shadow(0 2px 4px hsl(30 58 138/.3));font-size:3rem;margin-bottom:15px}.upload-text{font-size:1.3rem!important;margin-bottom:12px}.upload-hint,.upload-text{color:hsl(15 23 42)!important;font-weight:700!important;text-align:center}.upload-hint{font-size:1.1rem!important;text-shadow:0 1px 2px hsla(0,0%,100%,.8)}.hidden-canvas{display:none}.controls{display:grid;gap:24px;margin-top:24px}.control-group{display:flex;flex-direction:column;gap:12px}.control-group label{color:hsl(15 23 42)!important;font-size:1.2rem!important;font-weight:800!important;text-shadow:0 1px 2px hsla(0,0%,100%,.8)}.aspect-ratio-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}.aspect-ratio-btn{align-items:center;background:hsl(255 255 255);border:3px solid hsl(71 85 105);border-radius:.75rem;box-shadow:0 4px 12px hsl(15 23 42/.15);color:hsl(15 23 42);cursor:pointer;display:flex;flex-direction:column;justify-content:center;padding:1.2rem;position:relative;transition:all .2s ease}.aspect-ratio-btn:hover{background:hsl(30 58 138/.08);border-color:hsl(30 58 138);box-shadow:0 6px 20px hsl(30 58 138/.2);transform:translateY(-1px)}.aspect-ratio-btn.active{background:hsl(30 58 138);border-color:hsl(30 58 138);box-shadow:0 8px 25px hsl(30 58 138/.5);color:#fff}.ratio-label{color:hsl(15 23 42)!important;font-size:1.1rem!important;font-weight:800!important;margin-bottom:4px}.ratio-subtitle{font-size:.9rem!important;margin-bottom:2px}.ratio-size,.ratio-subtitle{color:hsl(15 23 42)!important;font-weight:700!important}.ratio-size{font-size:.85rem!important}.aspect-ratio-btn.active .ratio-label{color:#fff!important;font-weight:800!important;text-shadow:0 1px 2px rgba(0,0,0,.5)!important}.aspect-ratio-btn.active .ratio-size,.aspect-ratio-btn.active .ratio-subtitle{color:#fff!important;font-weight:700!important;text-shadow:0 1px 2px rgba(0,0,0,.5)!important}.resolution-select{background:#fff;border:2px solid #e1e5e9;border-radius:10px;font-size:1rem;padding:12px;transition:border-color .3s ease}.resolution-select:focus{border-color:#667eea;outline:none}.preview-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:var(--gradient-card);border:1px solid hsla(0,0%,100%,.2);border-radius:20px;box-shadow:0 25px 50px -12px #6366f140,0 10px 20px -6px #a855f71a;color:hsl(var(--card-foreground));padding:30px}.preview-container,.preview-section{display:flex;flex-direction:column;gap:20px}.preview-container{align-items:center}.preview-title{color:hsl(var(--foreground));font-size:1.2rem;font-weight:600;text-align:center}.original-preview{display:inline-block;position:relative}.preview-canvas{border-color:hsl(var(--muted));border-radius:15px;border-width:1px;max-width:100%;--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.result-canvas{border-color:hsl(var(--primary));border-width:2px}.crop-overlay{background-color:hsl(var(--primary)/.1);border-color:hsl(var(--primary));border-style:dashed;border-width:2px;pointer-events:none;position:absolute;transition:all .3s ease;z-index:10}.crop-corners{height:100%;position:relative;width:100%}.corner{background-color:hsl(var(--primary));height:8px;position:absolute;width:8px}.corner.text-primary-foreground{text-shadow:0 1px 2px rgba(0,0,0,.3)}.corner{border-radius:50%}.corner.top-left{left:-4px;top:-4px}.corner.top-right{right:-4px;top:-4px}.corner.bottom-left{bottom:-4px;left:-4px}.corner.bottom-right{bottom:-4px;right:-4px}.crop-info{background-color:hsl(var(--primary));color:hsl(var(--primary-foreground));left:50%;position:absolute;top:-30px;transform:translate(-50%)}.bg-primary.crop-info,.crop-info.text-primary-foreground{text-shadow:0 1px 2px rgba(0,0,0,.3)}.crop-info{border-radius:4px;font-size:.8rem;font-weight:600;padding:4px 8px}.cropped-preview{background-color:hsl(var(--muted)/.5);border-radius:12px;margin-top:20px;padding:20px}.cropped-container{margin-bottom:20px;text-align:center}.download-section{display:flex;flex-direction:column;gap:15px}.download-info{text-align:center}.file-info{color:hsl(var(--muted-foreground));font-size:.9rem;gap:20px}.download-buttons,.file-info{display:flex;justify-content:center}.download-buttons{flex-wrap:wrap;gap:15px}.download-btn{background:var(--gradient-primary);--tw-text-opacity:1;align-items:center;border:none;border-radius:12px;box-shadow:0 4px 15px #6366f14d;color:rgb(255 255 255/var(--tw-text-opacity,1));cursor:pointer;display:inline-flex;font-size:1rem;font-weight:600;gap:8px;padding:12px 24px;text-decoration:none;transition:all .3s ease}.download-btn:hover{box-shadow:0 8px 25px #6366f166;color:#fff;filter:brightness(1.1);text-decoration:none;transform:translateY(-2px)}.download-btn.secondary{background:var(--gradient-secondary);box-shadow:0 4px 15px #fb923c4d}.download-btn.secondary:hover{box-shadow:0 8px 25px #fb923c66;filter:brightness(1.1)}.download-icon{font-size:1.1rem}.error-message,.success-message{align-items:center;border-radius:10px;display:flex;gap:10px;justify-content:space-between;margin:20px 0;padding:15px 20px}.error-message{background-color:hsl(var(--destructive)/.1);border-color:hsl(var(--destructive)/.2);border-width:1px;color:hsl(var(--destructive))}.success-message{background-color:#22c55e1a;border-color:#22c55e33;border-width:1px;--tw-text-opacity:1;color:rgb(22 163 74/var(--tw-text-opacity,1))}.close-btn,.error-icon,.success-icon{font-size:1.2rem}.close-btn{background:none;border:none;color:inherit;cursor:pointer;opacity:.7;transition:opacity .3s ease}.close-btn:hover{opacity:1}.progress-container{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:hsl(255 255 255/.98)!important;border:2px solid hsl(148 163 184)!important;border-radius:.75rem;bottom:20px;box-shadow:0 6px 16px hsl(15 23 42/.15);left:20px;padding:1.2rem;position:absolute;right:20px}.progress-text{color:hsl(15 23 42)!important;font-size:1rem!important;font-weight:600!important;margin-bottom:10px}.progress-bar{background:hsl(203 213 225)!important;border-radius:6px;box-shadow:inset 0 2px 4px hsl(15 23 42/.1);height:12px!important;margin-bottom:8px;overflow:hidden;width:100%}.progress-fill{background:var(--gradient-primary);border-radius:6px;height:100%;transition:width .3s ease}.progress-percentage{color:hsl(30 41 59)!important;font-size:.9rem!important;font-weight:600!important;text-align:right}.color-options{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}.color-option{border:4px solid hsl(71 85 105)!important;border-radius:8px;box-shadow:0 4px 8px hsl(15 23 42/.15);cursor:pointer;height:44px;position:relative;transition:all .2s ease;width:44px}.color-option:hover{border-color:hsl(30 58 138)!important;box-shadow:0 6px 16px hsl(15 23 42/.25);transform:scale(1.15)}.color-option.active{border-color:#1e3a8a!important;border-width:6px!important;box-shadow:0 0 0 4px #1e3a8a4d ! important,0 0 0 8px #1e3a8a26 ! important,0 8px 20px #1e3a8a66!important;transform:scale(1.15)}.custom-color-option{align-items:center;background:hsl(203 213 225)!important;display:flex;justify-content:center}.custom-color-option input[type=color]{cursor:pointer;height:100%;opacity:0;position:absolute;width:100%}.custom-icon{color:hsl(15 23 42)!important;font-size:1.3rem;font-weight:700;pointer-events:none}.process-btn{background-color:hsl(var(--primary));color:hsl(var(--primary-foreground))}.bg-primary.process-btn,.process-btn.text-primary-foreground{text-shadow:0 1px 2px rgba(0,0,0,.3)}.process-btn{align-items:center;border:2px solid transparent;border-radius:10px;box-shadow:0 4px 8px #6366f133,0 2px 4px #0000001a,inset 0 1px #ffffff4d,inset 0 -1px #0003;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:8px;justify-content:center;padding:12px 24px;position:relative;transition:all .3s ease;width:100%}.process-btn:before{background:linear-gradient(135deg,#6366f180,#a855f780);border-radius:12px;bottom:-2px;content:"";left:-2px;position:absolute;right:-2px;top:-2px;z-index:-1}.process-btn:hover:not(:disabled){box-shadow:0 8px 16px #6366f14d,0 4px 8px #00000026,inset 0 1px #fff6,inset 0 -1px #0003;transform:translateY(-2px)}.process-btn:active:not(:disabled){box-shadow:0 2px 4px #6366f133,0 1px 2px #0000001a,inset 0 1px #fff3,inset 0 -1px #0000004d;transform:translateY(0)}.process-btn:disabled{background-color:hsl(var(--muted));color:hsl(var(--muted-foreground));cursor:not-allowed;opacity:.5}.loading-spinner{animation:spin 1s linear infinite;border:2px solid transparent;border-radius:50%;border-top-color:currentcolor;height:20px;width:20px}@media (max-width:768px){.main-content{gap:20px;grid-template-columns:1fr}.header h1{font-size:2rem}.container{padding:0 5px}.preview-section,.upload-section{padding:15px}.aspect-ratio-grid{grid-template-columns:repeat(2,1fr)}.color-options{justify-content:center}.file-info{gap:5px}.download-buttons,.file-info{flex-direction:column}}@media (max-width:480px){.upload-area{padding:20px}.upload-icon{font-size:2rem}.upload-text{font-size:1rem}.header h1{font-size:1.8rem}.aspect-ratio-grid{grid-template-columns:1fr}}@keyframes spin{to{transform:rotate(1turn)}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.9;transform:scale(1.05)}}.dark .id-photo-processor .header p{color:hsl(248 250 252)!important;font-weight:600}.dark .id-photo-processor .control-group label{color:hsl(248 250 252)!important;font-weight:800!important;text-shadow:0 1px 2px rgba(0,0,0,.5)}.dark .id-photo-processor .aspect-ratio-btn{background:hsl(30 41 59)!important;border:3px solid hsl(71 85 105)!important;color:hsl(248 250 252)!important}.dark .id-photo-processor .aspect-ratio-btn:hover{background:hsl(96 165 250/.15)!important;border-color:hsl(96 165 250)!important}.dark .id-photo-processor .aspect-ratio-btn.active{background:#60a5fa!important;border-color:#60a5fa!important;box-shadow:0 8px 25px hsl(96 165 250/.5);color:#0f172a!important}.dark .id-photo-processor .ratio-label,.dark .id-photo-processor .ratio-size,.dark .id-photo-processor .ratio-subtitle{color:hsl(248 250 252)!important}.dark .id-photo-processor .aspect-ratio-btn.active .ratio-label,.dark .id-photo-processor .aspect-ratio-btn.active .ratio-size,.dark .id-photo-processor .aspect-ratio-btn.active .ratio-subtitle{color:#0f172a!important;font-weight:700!important;text-shadow:none!important}.dark .id-photo-processor .upload-hint{color:hsl(248 250 252)!important;text-shadow:0 1px 2px rgba(0,0,0,.5)}.dark .id-photo-processor .color-option{border:4px solid hsl(148 163 184)!important}.dark .id-photo-processor .color-option:hover{border-color:hsl(96 165 250)!important}.dark .id-photo-processor .color-option.active{border-color:#60a5fa!important;border-width:6px!important;box-shadow:0 0 0 4px #60a5fa66 ! important,0 0 0 8px #60a5fa33 ! important,0 8px 20px #60a5fa80!important;transform:scale(1.15)}.dark .id-photo-processor .custom-icon{color:hsl(248 250 252)!important}