:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Segoe UI,Roboto,sans-serif;background:#f8f9fa;min-height:100vh;color:#1a1a1a;margin:0;padding:0}.app{display:flex;min-height:100vh;width:100vw;height:100vh;background:#fff;overflow:hidden;position:fixed;top:0;left:0}.sidebar{width:280px;background:#f8f9fa;border-right:1px solid rgba(0,0,0,.1);padding:32px 0;height:100vh;overflow-y:auto}.logo{padding:0 32px 40px;border-bottom:1px solid rgba(0,0,0,.06);margin-bottom:32px}.logo h2{font-size:24px;font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:8px;letter-spacing:-.02em}.logo p{font-size:14px;color:#6b7280;font-weight:500}.nav-menu{padding:0 20px}.nav-item{display:flex;align-items:center;padding:16px 20px;margin:4px 0;border-radius:16px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none;position:relative;color:#374151}.nav-item:hover{background:#0000000a;transform:translate(4px)}.nav-item.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 8px 24px #667eea4d;transform:translate(8px)}.nav-item.active:before{content:"";position:absolute;left:-20px;top:50%;transform:translateY(-50%);width:4px;height:24px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:2px}.language-switcher-container{margin-top:auto;padding:20px;border-top:1px solid rgba(255,255,255,.1)}.nav-icon{font-size:20px;margin-right:16px;width:24px;text-align:center;transition:transform .3s ease}.nav-item.active .nav-icon{transform:scale(1.1)}.nav-text{font-size:15px;font-weight:600;letter-spacing:-.01em}.main-content{flex:1;overflow-y:auto;background:#fff;height:100vh}.main-content.home-page{padding:48px 64px}.home-content h1{font-size:56px;font-weight:800;background:linear-gradient(135deg,#1a1a1a,#374151);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:16px;text-align:center;letter-spacing:-.03em;line-height:1.1}.home-content>p{font-size:20px;color:#6b7280;text-align:center;margin-bottom:64px;font-weight:500;line-height:1.4}.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:32px;max-width:1200px;margin:0 auto}.feature-card{background:#fff;border-radius:24px;padding:32px;text-align:center;box-shadow:0 8px 32px #00000014;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);border:1px solid rgba(0,0,0,.05);position:relative;overflow:hidden}.feature-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(135deg,#667eea,#764ba2);transform:scaleX(0);transition:transform .4s ease}.feature-card:hover{transform:translateY(-8px);box-shadow:0 20px 60px #00000026;border-color:#667eea33}.feature-card:hover:before{transform:scaleX(1)}.feature-icon{font-size:48px;margin-bottom:24px;filter:grayscale(.2);transition:all .3s ease}.feature-card:hover .feature-icon{transform:scale(1.1);filter:grayscale(0)}.feature-card h3{font-size:22px;font-weight:700;color:#1a1a1a;margin-bottom:12px;letter-spacing:-.02em}.feature-card p{font-size:16px;color:#6b7280;line-height:1.5;font-weight:500}.module-content{max-width:800px;margin:0 auto;text-align:center;padding:80px 20px}.module-content h2{font-size:42px;font-weight:800;background:linear-gradient(135deg,#1a1a1a,#374151);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:24px;letter-spacing:-.02em;line-height:1.2}.module-content p{font-size:20px;color:#6b7280;margin-bottom:40px;font-weight:500;line-height:1.4}.module-content button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:16px 32px;border-radius:16px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 8px 24px #667eea4d;letter-spacing:-.01em}.module-content button:hover{transform:translateY(-3px);box-shadow:0 12px 36px #667eea66}@media (max-width: 1024px){.main-content.home-page{padding:32px 40px}.home-content h1{font-size:48px}.feature-grid{gap:24px}}@media (max-width: 768px){.app{flex-direction:column;min-height:100vh;position:relative}.sidebar{width:100%;order:2;padding:24px 0;border-right:none;border-top:1px solid rgba(0,0,0,.1);height:auto;background:#f8f9fa}.nav-menu{display:flex;overflow-x:auto;padding:0 20px;gap:8px}.nav-item{flex-shrink:0;margin:0;min-width:fit-content;padding:12px 16px;border-radius:12px}.nav-item.active:before{display:none}.main-content{order:1;flex:1;height:auto;min-height:calc(100vh - 200px)}.main-content.home-page{padding:24px 20px}.home-content h1{font-size:36px}.home-content>p{font-size:18px;margin-bottom:48px}.feature-grid{grid-template-columns:1fr;gap:20px}.logo{padding:0 20px 24px;margin-bottom:20px}}.image-compress{width:100%;height:100%;display:flex;flex-direction:column;padding:0}.compress-header{text-align:center;margin-bottom:32px;padding:0 32px}.compress-header h2{font-size:42px;font-weight:800;background:linear-gradient(135deg,#1a1a1a,#374151);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:16px;letter-spacing:-.02em;line-height:1.2}.compress-header p{color:#6b7280;font-size:18px;font-weight:500;line-height:1.4}.compress-layout{display:flex;gap:32px;flex:1;min-height:0;padding:0 32px}.compress-left{flex:0 0 45%;display:flex;flex-direction:column;gap:24px}.compress-right{flex:1;display:flex;flex-direction:column;gap:24px;overflow-y:auto}.compression-settings{background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:32px;box-shadow:0 8px 32px #00000014;border:1px solid rgba(255,255,255,.2)}.compression-settings h3{color:#333;margin-bottom:20px;font-size:18px}.settings-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-bottom:24px}.setting-item{display:flex;flex-direction:column;gap:8px}.setting-item label{font-size:14px;font-weight:500;color:#333}.setting-item input,.setting-item select{padding:8px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;transition:border-color .3s ease}.setting-item input:focus,.setting-item select:focus{outline:none;border-color:#667eea}.setting-item input[type=range]{padding:0}.setting-item span{font-size:12px;color:#666;text-align:center}.compress-btn{width:100%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:16px 32px;border-radius:16px;font-size:18px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);letter-spacing:-.01em;box-shadow:0 8px 24px #667eea4d}.compress-btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 12px 36px #667eea66}.compress-btn:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:0 4px 12px #667eea33}.image-info p{color:#666;font-size:14px;margin:0}.compression-result{background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:24px;box-shadow:0 8px 32px #00000014;border:1px solid rgba(255,255,255,.2)}.compression-result h3{color:#333;margin-bottom:16px;font-size:18px}.compressed-preview{text-align:center;margin-bottom:20px}.file-comparison{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px;padding:20px;background:#f8f9fa;border-radius:8px}.original-info,.compressed-info{flex:1;text-align:center}.original-info h4,.compressed-info h4{color:#333;margin-bottom:8px;font-size:14px}.original-info p,.compressed-info p{color:#666;font-size:13px;margin:4px 0}.ratio{color:#22c55e!important;font-weight:600!important}@media (max-width: 1024px){.compress-layout{flex-direction:column;gap:24px}.compress-left,.compress-right{flex:none}}@media (max-width: 768px){.image-compress{padding:16px}.compress-layout{padding:0}.upload-area{padding:32px 16px}.settings-grid{grid-template-columns:1fr}.file-comparison{flex-direction:column;gap:16px}.arrow{transform:rotate(90deg)}}.image-resize{width:100%;height:100%;display:flex;flex-direction:column;padding:0}.resize-header{text-align:center;margin-bottom:32px;padding:0 32px}.resize-header h2{font-size:42px;font-weight:800;background:linear-gradient(135deg,#1a1a1a,#374151);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:16px;letter-spacing:-.02em;line-height:1.2}.resize-header p{color:#6b7280;font-size:18px;font-weight:500;line-height:1.4}.resize-layout{display:flex;gap:32px;flex:1;min-height:0;padding:0 32px}.resize-left{flex:0 0 45%;display:flex;flex-direction:column;gap:24px}.resize-right{flex:1;display:flex;flex-direction:column;gap:24px;overflow-y:auto}.file-info{display:flex;align-items:center;gap:10px;background:#fff;padding:15px 20px;border-radius:8px;box-shadow:0 2px 8px #0000001a}.file-icon{font-size:24px}.file-name{font-weight:500;color:#333}.file-size{color:#666;font-size:14px}.size-presets{background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:32px;box-shadow:0 8px 32px #00000014;border:1px solid rgba(255,255,255,.2)}.size-presets h3{color:#333;margin-bottom:20px;font-size:18px}.presets-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.preset-btn{background:#fffc;border:1px solid rgba(102,126,234,.2);border-radius:12px;padding:12px 16px;text-align:center;cursor:pointer;transition:all .3s ease;font-size:14px;font-weight:500;color:#333}.preset-btn:hover{background:#667eea1a;border-color:#667eea66;transform:translateY(-2px)}.preset-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-color:#667eea;box-shadow:0 4px 12px #667eea4d}.preset-btn small{display:block;font-size:12px;opacity:.8;margin-top:4px}.resize-settings{background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:32px;box-shadow:0 8px 32px #00000014;border:1px solid rgba(255,255,255,.2)}.resize-settings h3{color:#333;margin-bottom:20px;font-size:18px}.size-inputs{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}.input-group{display:flex;flex-direction:column;gap:8px}.input-group label{font-size:14px;font-weight:500;color:#333}.input-group input{padding:8px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;transition:border-color .3s ease}.input-group input:focus{outline:none;border-color:#667eea}.resize-options{margin-bottom:24px}.checkbox-label{display:flex;align-items:center;gap:8px;font-size:14px;color:#333;margin-bottom:16px;cursor:pointer}.checkbox-label input[type=checkbox]{margin:0}.quality-setting{display:flex;flex-direction:column;gap:8px}.quality-setting label{font-size:14px;font-weight:500;color:#333}.resize-btn{width:100%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:16px 32px;border-radius:16px;font-size:18px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);letter-spacing:-.01em;box-shadow:0 8px 24px #667eea4d}.resize-btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 12px 36px #667eea66}.resize-btn:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:0 4px 12px #667eea33}.image-preview{text-align:center}.image-info{margin-top:12px;padding:8px;background:#0000000d;border-radius:8px}.image-info p{color:#666;font-size:14px;margin:4px 0}.resize-result{background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:24px;box-shadow:0 8px 32px #00000014;border:1px solid rgba(255,255,255,.2)}.resize-result h3{color:#333;margin-bottom:16px;font-size:18px}.resized-preview{text-align:center;margin-bottom:20px}.size-comparison{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px;padding:20px;background:#f8f9fa;border-radius:8px}.original-info,.resized-info{flex:1;text-align:center}.original-info h4,.resized-info h4{color:#333;margin-bottom:8px;font-size:14px}.original-info p,.resized-info p{color:#666;font-size:13px;margin:4px 0}.arrow{font-size:24px;color:#667eea;font-weight:700}.download-btn{width:100%;background:linear-gradient(145deg,#22c55e,#16a34a);color:#fff;border:none;padding:16px 32px;border-radius:16px;font-size:18px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);letter-spacing:-.01em;box-shadow:0 8px 24px #22c55e4d}@media (max-width: 1024px){.resize-layout{flex-direction:column;gap:24px}.resize-left,.resize-right{flex:none}}@media (max-width: 768px){.image-resize{padding:16px}.resize-layout{padding:0}.upload-area{padding:32px 16px}.presets-grid,.size-inputs{grid-template-columns:1fr}.size-comparison{flex-direction:column;gap:16px}.arrow{transform:rotate(90deg)}}.image-convert{width:100%;height:100%;display:flex;flex-direction:column;padding:0}.convert-header{text-align:center;margin-bottom:32px;padding:0 32px}.convert-header h2{font-size:42px;font-weight:800;background:linear-gradient(135deg,#1a1a1a,#374151);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:16px;letter-spacing:-.02em;line-height:1.2}.convert-header p{color:#6b7280;font-size:18px;font-weight:500;line-height:1.4}.convert-layout{display:flex;gap:32px;flex:1;min-height:0;padding:0 32px}.convert-left{flex:0 0 45%;display:flex;flex-direction:column;gap:24px}.convert-right{flex:1;display:flex;flex-direction:column;gap:24px;overflow-y:auto}.upload-area{border:2px dashed rgba(102,126,234,.3);border-radius:24px;padding:48px 32px;text-align:center;background:#fff9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1)}.upload-area:hover{border-color:#667eea99;background:#fffc;transform:translateY(-4px);box-shadow:0 12px 40px #667eea26}.upload-area.dragover{border-color:#667eea;background:#f0f4ff}.upload-content{display:flex;flex-direction:column;align-items:center;gap:10px}.upload-icon{font-size:48px;opacity:.6}.upload-content p{font-size:16px;color:#333;margin:0}.upload-content small{color:#666;font-size:12px}.files-info{background:#fff;padding:20px;border-radius:12px;box-shadow:0 2px 8px #0000001a;text-align:left}.files-icon{font-size:24px;margin-bottom:8px}.files-list{margin-top:12px;display:flex;flex-direction:column;gap:8px}.file-item{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:#f8f9fa;border-radius:8px;font-size:14px}.file-format{background:#667eea;color:#fff;padding:2px 8px;border-radius:4px;font-size:12px;font-weight:500}.more-files{text-align:center;color:#666;font-size:14px;padding:8px;background:#f0f0f0;border-radius:8px}.convert-settings{background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:32px;box-shadow:0 8px 32px #00000014;border:1px solid rgba(255,255,255,.2)}.convert-settings h3{color:#333;margin-bottom:20px;font-size:18px}.format-selection{margin-bottom:24px}.format-selection label{display:block;font-size:16px;font-weight:500;color:#333;margin-bottom:12px}.format-options{display:flex;flex-direction:column;gap:12px}.format-option{display:flex;align-items:center;gap:12px;padding:16px;background:#fffc;border:1px solid rgba(102,126,234,.2);border-radius:12px;cursor:pointer;transition:all .3s ease}.format-option:hover{background:#667eea1a;border-color:#667eea66}.format-option input[type=radio]{margin:0;accent-color:#667eea}.format-info{flex:1}.format-info strong{display:block;color:#333;font-size:14px;margin-bottom:4px}.format-info small{color:#666;font-size:12px}.quality-setting{margin-bottom:24px}.quality-setting label{display:block;font-size:14px;font-weight:500;color:#333;margin-bottom:8px}.quality-setting input[type=range]{width:100%}.background-setting{margin-bottom:24px}.background-setting label{display:block;font-size:14px;font-weight:500;color:#333;margin-bottom:8px}.background-setting input[type=color]{width:100%;height:40px;border:1px solid #ddd;border-radius:8px;cursor:pointer}.convert-btn{width:100%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:16px 32px;border-radius:16px;font-size:18px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);letter-spacing:-.01em;box-shadow:0 8px 24px #667eea4d}.convert-btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 12px 36px #667eea66}.convert-btn:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:0 4px 12px #667eea33}.preview-section{background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:24px;box-shadow:0 8px 32px #00000014;border:1px solid rgba(255,255,255,.2)}.preview-section h3{color:#333;margin-bottom:16px;font-size:18px}.files-preview{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.file-preview{text-align:center}.file-details{margin-top:8px}.file-details .file-name{font-size:12px;color:#333;margin:0 0 4px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-details .file-info{font-size:11px;color:#666;margin:0}.more-preview{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#667eea1a;border-radius:8px;padding:20px;border:2px dashed rgba(102,126,234,.3)}.more-count{font-size:24px;font-weight:600;color:#667eea;margin-bottom:8px}.more-preview p{color:#667eea;font-size:14px;margin:0}.convert-result{background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:24px;box-shadow:0 8px 32px #00000014;border:1px solid rgba(255,255,255,.2)}.convert-result h3{color:#333;margin-bottom:20px;font-size:18px}.results-list{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.result-item{display:flex;align-items:center;gap:16px;padding:16px;background:#f8f9fa;border-radius:12px;transition:all .3s ease}.result-item:hover{background:#f0f0f0;transform:translateY(-1px)}.result-preview{flex-shrink:0}.result-info{flex:1}.result-name{font-size:14px;font-weight:500;color:#333;margin:0 0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.size-comparison{display:flex;align-items:center;gap:8px;font-size:12px;color:#666}.size-comparison .arrow{color:#667eea;font-weight:700}.download-single-btn{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;border:none;padding:8px 16px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease;flex-shrink:0}.download-single-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #22c55e4d}.download-all-btn{width:100%;background:linear-gradient(145deg,#22c55e,#16a34a);color:#fff;border:none;padding:16px 32px;border-radius:16px;font-size:18px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);letter-spacing:-.01em;box-shadow:0 8px 24px #22c55e4d}.download-all-btn:hover{transform:translateY(-3px);box-shadow:0 12px 36px #22c55e66}.placeholder-content{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:80px 20px;background:#fff9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:24px;border:2px dashed rgba(102,126,234,.2);color:#6b7280;flex:1}.placeholder-icon{font-size:64px;opacity:.5;margin-bottom:16px}.placeholder-content p{font-size:16px;margin:0}@media (max-width: 1024px){.convert-layout{flex-direction:column;gap:24px}.convert-left,.convert-right{flex:none}.files-preview{grid-template-columns:1fr}}@media (max-width: 768px){.image-convert{padding:16px}.convert-layout{padding:0}.upload-area{padding:32px 16px}.format-options{gap:8px}.format-option{padding:12px}.files-preview{grid-template-columns:1fr}.result-item{flex-direction:column;text-align:center;gap:12px}.result-info{text-align:center}}.text-card{width:100%;height:100%;padding:32px}.card-header{text-align:center;margin-bottom:48px}.card-header h2{font-size:42px;font-weight:800;background:linear-gradient(135deg,#1a1a1a,#374151);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:16px;letter-spacing:-.02em;line-height:1.2}.card-header p{color:#6b7280;font-size:18px;font-weight:500;line-height:1.4}.card-workspace{display:grid;grid-template-columns:400px 1fr;gap:48px;align-items:start}.setting-group h3{color:#1a1a1a;font-size:16px;font-weight:600;margin-bottom:12px;letter-spacing:-.01em}.setting-group label{display:block;color:#374151;font-size:14px;font-weight:500;margin-bottom:8px}.setting-group textarea{width:100%;min-height:100px;padding:16px;border:1px solid rgba(0,0,0,.1);border-radius:12px;font-size:14px;font-family:inherit;resize:vertical;background:#fffc;transition:all .3s ease}.setting-group textarea:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.setting-group select,.setting-group input[type=color]{width:100%;padding:12px 16px;border:1px solid rgba(0,0,0,.1);border-radius:12px;font-size:14px;background:#fffc;transition:all .3s ease}.setting-group input[type=color]{height:48px;cursor:pointer;padding:4px}.setting-group input[type=range]{width:100%;margin:8px 0}.setting-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px}.preset-backgrounds{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.preset-bg{width:100%;height:48px;border-radius:12px;cursor:pointer;transition:all .3s ease;border:3px solid transparent}.preset-bg:hover{transform:scale(1.05);border-color:#667eea4d;box-shadow:0 4px 16px #0000001a}.preview-container{margin-bottom:24px;min-height:400px;display:flex;align-items:center;justify-content:center;background:#00000005;border-radius:16px;padding:24px}.card-preview{max-width:100%;max-height:500px;border-radius:12px;box-shadow:0 12px 40px #00000026;transition:transform .3s ease}.card-preview:hover{transform:scale(1.02)}.download-btn{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;border:none;padding:16px 32px;border-radius:16px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 8px 24px #22c55e4d;letter-spacing:-.01em}@media (max-width: 1024px){.card-workspace{grid-template-columns:1fr;gap:32px}.settings-panel{order:2}.preview-panel{order:1}}@media (max-width: 768px){.text-card{padding:0}.card-header h2{font-size:36px}.card-workspace{gap:24px}.settings-panel,.preview-panel{padding:24px;border-radius:20px}.setting-row{grid-template-columns:1fr;gap:12px}.preset-backgrounds{grid-template-columns:repeat(3,1fr)}.preview-container{min-height:300px;padding:16px}}.logo-designer{width:100%;height:100%;padding:32px}.designer-header{text-align:center;margin-bottom:48px}.designer-header h2{font-size:42px;font-weight:800;background:linear-gradient(135deg,#1a1a1a,#374151);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:16px;letter-spacing:-.02em;line-height:1.2}.designer-header p{color:#6b7280;font-size:18px;font-weight:500;line-height:1.4}.designer-workspace{display:grid;grid-template-columns:400px 1fr;gap:48px;align-items:start}.settings-panel{background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:32px;box-shadow:0 8px 32px #00000014;border:1px solid rgba(255,255,255,.2);height:fit-content}.setting-group{margin-bottom:32px}.setting-group h3{color:#1a1a1a;font-size:16px;font-weight:600;margin-bottom:16px;letter-spacing:-.01em}.setting-group input[type=text]{width:100%;padding:12px 16px;border:1px solid rgba(0,0,0,.1);border-radius:12px;font-size:14px;background:#fffc;transition:all .3s ease;margin-bottom:16px}.setting-group input[type=text]:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.setting-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.setting-item{display:flex;flex-direction:column}.setting-item label{color:#374151;font-size:14px;font-weight:500;margin-bottom:8px}.setting-item select,.setting-item input[type=color]{padding:12px 16px;border:1px solid rgba(0,0,0,.1);border-radius:12px;font-size:14px;background:#fffc;transition:all .3s ease}.setting-item input[type=color]{height:48px;cursor:pointer;padding:4px}.setting-item input[type=range]{margin:8px 0}.icon-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}.icon-btn{display:flex;align-items:center;justify-content:center;width:100%;height:48px;background:#fffc;border:2px solid rgba(0,0,0,.1);border-radius:12px;cursor:pointer;transition:all .3s ease;font-size:12px;font-weight:500;color:#374151}.icon-btn:hover{background:#667eea1a;border-color:#667eea4d;transform:translateY(-2px)}.icon-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);border-color:transparent;color:#fff;box-shadow:0 4px 16px #667eea4d}.layout-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:16px}.layout-btn{padding:12px 16px;background:#fffc;border:2px solid rgba(0,0,0,.1);border-radius:12px;cursor:pointer;transition:all .3s ease;font-size:14px;font-weight:500;color:#374151}.layout-btn:hover{background:#667eea1a;border-color:#667eea4d;transform:translateY(-2px)}.layout-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);border-color:transparent;color:#fff;box-shadow:0 4px 16px #667eea4d}.color-schemes{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:16px}.color-scheme{display:flex;align-items:center;gap:8px;padding:12px;background:#fffc;border:1px solid rgba(0,0,0,.1);border-radius:12px;cursor:pointer;transition:all .3s ease;font-size:12px;font-weight:500;color:#374151}.color-scheme:hover{background:#667eea1a;border-color:#667eea4d;transform:translateY(-2px)}.scheme-colors{display:flex;gap:4px}.color-sample{width:20px;height:20px;border-radius:6px;border:1px solid rgba(0,0,0,.1)}.generate-btn{width:100%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:16px 32px;border-radius:16px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);letter-spacing:-.01em;box-shadow:0 8px 24px #667eea4d}.generate-btn:hover{transform:translateY(-3px);box-shadow:0 12px 36px #667eea66}.preview-panel{background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:32px;box-shadow:0 8px 32px #00000014;border:1px solid rgba(255,255,255,.2);text-align:center}.preview-panel h3{color:#1a1a1a;font-size:18px;font-weight:600;margin-bottom:24px;letter-spacing:-.01em}.preview-container{margin-bottom:24px;min-height:300px;display:flex;align-items:center;justify-content:center;background:#00000005;border-radius:16px;padding:32px;border:2px dashed rgba(0,0,0,.1)}.logo-preview{max-width:100%;max-height:400px;filter:drop-shadow(0 8px 24px rgba(0,0,0,.1));transition:transform .3s ease}.logo-preview:hover{transform:scale(1.05)}.download-btn{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;border:none;padding:16px 32px;border-radius:16px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 8px 24px #22c55e4d;letter-spacing:-.01em;margin-bottom:24px}.download-btn:hover{transform:translateY(-3px);box-shadow:0 12px 36px #22c55e66}.preview-info{background:#00000005;border-radius:12px;padding:16px;font-size:14px;color:#6b7280}.preview-info p{margin:4px 0;font-weight:500}@media (max-width: 1024px){.designer-workspace{grid-template-columns:1fr;gap:32px}.settings-panel{order:2}.preview-panel{order:1}}@media (max-width: 768px){.logo-designer{padding:0}.designer-header h2{font-size:36px}.designer-workspace{gap:24px}.settings-panel,.preview-panel{padding:24px;border-radius:20px}.setting-row{grid-template-columns:1fr;gap:12px}.icon-grid{grid-template-columns:repeat(3,1fr)}.layout-grid,.color-schemes{grid-template-columns:1fr}.preview-container{min-height:200px;padding:24px}}.svg-editor{height:100vh;display:flex;flex-direction:column}.editor-header{text-align:center;padding:24px;background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid rgba(0,0,0,.1)}.editor-header h2{font-size:32px;font-weight:800;background:linear-gradient(135deg,#1a1a1a,#374151);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:8px;letter-spacing:-.02em}.editor-header p{color:#6b7280;font-size:16px;font-weight:500}.editor-workspace{flex:1;display:grid;grid-template-columns:300px 1fr auto;gap:0;overflow:hidden}.tools-panel{background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-right:1px solid rgba(0,0,0,.1);padding:24px;overflow-y:auto}.tool-group{margin-bottom:32px}.tool-group h3{color:#1a1a1a;font-size:14px;font-weight:600;margin-bottom:16px;letter-spacing:-.01em;text-transform:uppercase}.tools-grid{display:grid;grid-template-columns:1fr;gap:8px}.tool-btn{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#fffc;border:2px solid rgba(0,0,0,.1);border-radius:12px;cursor:pointer;transition:all .3s ease;font-size:14px;font-weight:500;color:#374151}.tool-btn:hover{background:#667eea1a;border-color:#667eea4d;transform:translateY(-2px)}.tool-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);border-color:transparent;color:#fff;box-shadow:0 4px 16px #667eea4d}.tool-icon{font-size:18px}.tool-name{flex:1}.color-controls{display:flex;flex-direction:column;gap:16px}.control-item{display:flex;flex-direction:column;gap:8px}.control-item label{color:#374151;font-size:14px;font-weight:500}.control-item input[type=color]{width:100%;height:40px;border:1px solid rgba(0,0,0,.1);border-radius:8px;cursor:pointer;padding:4px}.control-item input[type=range]{width:100%}.color-input-group{display:flex;flex-direction:column;gap:12px}.preset-colors{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.color-preset{width:100%;height:32px;border-radius:8px;cursor:pointer;border:2px solid rgba(0,0,0,.1);transition:all .3s ease}.color-preset:hover{transform:scale(1.1);box-shadow:0 4px 12px #0003}.templates-grid{display:grid;grid-template-columns:1fr;gap:8px}.template-btn{padding:12px 16px;background:#fffc;border:1px solid rgba(0,0,0,.1);border-radius:8px;cursor:pointer;transition:all .3s ease;font-size:14px;font-weight:500;color:#374151}.template-btn:hover{background:#667eea1a;border-color:#667eea4d;transform:translateY(-2px)}.action-buttons{display:flex;flex-direction:column;gap:8px}.action-buttons button{padding:12px 16px;background:#fffc;border:1px solid rgba(0,0,0,.1);border-radius:8px;cursor:pointer;transition:all .3s ease;font-size:14px;font-weight:500;color:#374151}.action-buttons button:hover:not(:disabled){background:#667eea1a;border-color:#667eea4d;transform:translateY(-2px)}.action-buttons button:disabled{opacity:.5;cursor:not-allowed}.canvas-area{flex:1;display:flex;flex-direction:column;background:#f8fafc;overflow:hidden}.canvas-controls{padding:16px 24px;background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid rgba(0,0,0,.1);display:flex;align-items:center;gap:16px}.canvas-size{display:flex;align-items:center;gap:8px}.canvas-size label{color:#374151;font-size:14px;font-weight:500}.canvas-size input{width:80px;padding:8px 12px;border:1px solid rgba(0,0,0,.1);border-radius:8px;font-size:14px;text-align:center}.canvas-size span{color:#6b7280;font-weight:500}.canvas-container{flex:1;display:flex;align-items:center;justify-content:center;padding:24px;overflow:auto}.svg-canvas{background:#fff;border-radius:12px;box-shadow:0 8px 32px #0000001a;cursor:crosshair;max-width:100%;max-height:100%}.svg-canvas .selected{stroke:#667eea!important;stroke-width:3!important;stroke-dasharray:5,5!important;filter:drop-shadow(0 0 8px rgba(102,126,234,.3))}.properties-panel{width:280px;background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-left:1px solid rgba(0,0,0,.1);padding:24px;overflow-y:auto}.properties-panel h3{color:#1a1a1a;font-size:16px;font-weight:600;margin-bottom:20px;letter-spacing:-.01em}.property-item{margin-bottom:16px}.property-item label{display:block;color:#374151;font-size:14px;font-weight:500;margin-bottom:8px}.property-item input{width:100%;padding:12px 16px;border:1px solid rgba(0,0,0,.1);border-radius:8px;font-size:14px;background:#fffc;transition:all .3s ease}.property-item input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.property-item span{display:inline-block;padding:8px 12px;background:#0000000d;border-radius:6px;font-size:14px;color:#6b7280;font-weight:500}@media (max-width: 1200px){.editor-workspace{grid-template-columns:280px 1fr}.properties-panel{display:none}}@media (max-width: 768px){.editor-header{padding:16px}.editor-header h2{font-size:28px}.editor-workspace{grid-template-columns:1fr;grid-template-rows:auto 1fr}.tools-panel{padding:16px;border-right:none;border-bottom:1px solid rgba(0,0,0,.1);overflow-x:auto;overflow-y:visible}.tools-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.tool-group{margin-bottom:20px}.canvas-container{padding:16px}.canvas-controls{padding:12px 16px;flex-wrap:wrap}}.social-templates{width:100%;height:100%;padding:32px}.templates-header{text-align:center;margin-bottom:32px}.templates-header h2{font-size:2rem;font-weight:700;margin-bottom:8px;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.templates-header p{color:var(--text-secondary);font-size:1.1rem}.templates-workspace{display:flex;flex-direction:column;gap:32px}.upload-area{border:2px dashed rgba(102,126,234,.3);border-radius:16px;padding:48px 24px;text-align:center;cursor:pointer;transition:all .3s ease;background:#ffffff05;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.upload-area:hover{border-color:#667eea99;background:#667eea0d;transform:translateY(-2px)}.templates-section{background:#ffffff05;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;padding:24px;border:1px solid rgba(255,255,255,.1)}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.section-header h3{font-size:1.2rem;font-weight:600;color:var(--text-primary)}.process-all-btn{padding:12px 24px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease;font-weight:500;box-shadow:0 4px 16px #667eea4d}.process-all-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 24px #667eea66}.process-all-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.templates-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.template-card{background:#ffffff08;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;position:relative}.template-card:hover{transform:translateY(-4px);border-color:#667eea80;box-shadow:0 8px 32px #667eea33}.template-card.selected{border-color:#667eea;background:#667eea1a}.template-icon{font-size:2rem;margin-bottom:12px}.template-info h4{font-size:1.1rem;font-weight:600;margin-bottom:4px;color:var(--text-primary)}.template-platform{font-size:.9rem;color:#667eea;margin-bottom:4px;font-weight:500}.template-size{font-size:.9rem;color:var(--text-secondary);margin-bottom:8px;font-family:SF Mono,Monaco,Inconsolata,monospace}.template-desc{font-size:.85rem;color:var(--text-muted);margin-bottom:16px}.template-process-btn{width:100%;padding:10px;background:#667eea1a;color:#667eea;border:1px solid rgba(102,126,234,.3);border-radius:8px;cursor:pointer;transition:all .2s ease;font-size:.9rem;font-weight:500}.template-process-btn:hover:not(:disabled){background:#667eea33;border-color:#667eea80}.template-process-btn:disabled{opacity:.5;cursor:not-allowed}.result-preview{margin-bottom:12px}.result-preview img{width:100%;height:120px;object-fit:cover;border-radius:8px;background:#ffffff0d}.result-info p{font-size:.85rem;color:var(--text-secondary);margin-bottom:12px;font-family:SF Mono,Monaco,Inconsolata,monospace}@media (max-width: 768px){.social-templates{padding:16px}.templates-grid{grid-template-columns:1fr}.results-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.section-header{flex-direction:column;gap:16px;align-items:stretch}.preview-header{flex-direction:column;gap:12px;align-items:stretch}.results-header{flex-direction:column;gap:16px;align-items:stretch}}.watermark-tool{width:100%;height:100%;padding:32px}.watermark-header{text-align:center;margin-bottom:32px}.watermark-header h2{font-size:2rem;font-weight:700;margin-bottom:8px;background:linear-gradient(135deg,#06b6d4,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.watermark-header p{color:var(--text-secondary);font-size:1.1rem}.watermark-workspace{display:flex;flex-direction:column;gap:32px}.upload-area{border:2px dashed rgba(6,182,212,.3);border-radius:16px;padding:48px 24px;text-align:center;cursor:pointer;transition:all .3s ease;background:#ffffff05;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.upload-area:hover{border-color:#06b6d499;background:#06b6d40d;transform:translateY(-2px)}.watermark-content{display:grid;grid-template-columns:1fr 400px;gap:32px}.preview-container{display:flex;justify-content:center;margin-bottom:24px}.download-section{text-align:center}.settings-section{background:#ffffff05;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;padding:24px;border:1px solid rgba(255,255,255,.1);height:fit-content}.setting-group{margin-bottom:20px}.setting-group label{display:block;font-size:.9rem;font-weight:500;color:var(--text-secondary);margin-bottom:8px}.type-selector{display:grid;grid-template-columns:1fr 1fr;gap:8px}.type-btn{padding:12px;background:#ffffff08;color:var(--text-secondary);border:1px solid rgba(255,255,255,.1);border-radius:8px;cursor:pointer;transition:all .2s ease;font-size:.9rem}.type-btn:hover{background:#ffffff0d;border-color:#fff3}.type-btn.active{background:#06b6d41a;color:#06b6d4;border-color:#06b6d44d}.text-input,.select-input{width:100%;padding:10px 12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:var(--text-primary);font-size:.9rem;transition:all .2s ease}.text-input:focus,.select-input:focus{outline:none;border-color:#06b6d480;background:#ffffff14}.color-input{width:60px;height:40px;padding:0;border:none;border-radius:8px;cursor:pointer;background:none}.range-input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;background:#06b6d4;border-radius:50%;cursor:pointer;box-shadow:0 2px 8px #06b6d466}.range-input::-moz-range-thumb{width:18px;height:18px;background:#06b6d4;border-radius:50%;cursor:pointer;border:none;box-shadow:0 2px 8px #06b6d466}.watermark-upload{text-align:center}.upload-watermark-btn{padding:12px 24px;background:#06b6d41a;color:#06b6d4;border:1px solid rgba(6,182,212,.3);border-radius:8px;cursor:pointer;transition:all .2s ease;font-size:.9rem}.upload-watermark-btn:hover{background:#06b6d433;border-color:#06b6d480}.watermark-preview{position:relative;display:inline-block}.watermark-preview img{max-width:100px;max-height:100px;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.remove-watermark-btn{position:absolute;top:-8px;right:-8px;width:24px;height:24px;background:#ef4444;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.8rem;transition:all .2s ease}.remove-watermark-btn:hover{background:#dc2626;transform:scale(1.1)}.position-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.position-btn{padding:12px;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:8px;cursor:pointer;transition:all .2s ease;font-size:1.2rem;display:flex;align-items:center;justify-content:center}.position-btn:hover{background:#ffffff0d;border-color:#fff3}.position-btn.active{background:#06b6d41a;border-color:#06b6d44d}.process-btn{width:100%;padding:14px;background:linear-gradient(135deg,#06b6d4,#3b82f6);color:#fff;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease;font-weight:500;font-size:1rem;box-shadow:0 4px 16px #06b6d44d;margin-top:8px}.process-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 24px #06b6d466}.process-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.setting-group label input[type=checkbox]{margin-right:8px;accent-color:#06b6d4}@media (max-width: 1024px){.watermark-content{grid-template-columns:1fr;gap:24px}.settings-section{order:-1}}@media (max-width: 768px){.watermark-tool{padding:16px}.type-selector{grid-template-columns:1fr}.position-grid{gap:6px}.position-btn{padding:10px;font-size:1rem}}.image-collage{width:100%;height:100%;padding:32px}.collage-header{text-align:center;margin-bottom:32px}.collage-header h2{font-size:2rem;font-weight:700;margin-bottom:8px;background:linear-gradient(135deg,#f59e0b,#d97706);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.collage-header p{color:var(--text-secondary);font-size:1.1rem}.collage-workspace{display:flex;flex-direction:column;gap:32px}.upload-section{background:#ffffff05;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;padding:24px;border:1px solid rgba(255,255,255,.1)}.upload-area{border:2px dashed rgba(245,158,11,.3);border-radius:16px;padding:48px 24px;text-align:center;cursor:pointer;transition:all .3s ease;background:#ffffff05;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);margin-bottom:24px}.upload-area:hover{border-color:#f59e0b99;background:#f59e0b0d;transform:translateY(-2px)}.images-grid{border-top:1px solid rgba(255,255,255,.1);padding-top:24px}.grid-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.grid-header h3{font-size:1.2rem;font-weight:600;color:var(--text-primary)}.clear-all-btn{padding:8px 16px;background:#ef44441a;color:#ef4444;border:1px solid rgba(239,68,68,.3);border-radius:8px;cursor:pointer;transition:all .2s ease;font-size:.9rem}.clear-all-btn:hover{background:#ef444433;border-color:#ef444480}.images-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}.image-item{position:relative;aspect-ratio:1;border-radius:8px;overflow:hidden;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);transition:all .2s ease}.image-item:hover{transform:scale(1.05);border-color:#f59e0b80}.image-item img{width:100%;height:100%;object-fit:cover}.remove-image-btn{position:absolute;top:4px;right:4px;width:24px;height:24px;background:#ef4444e6;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;transition:all .2s ease}.remove-image-btn:hover{background:#ef4444;transform:scale(1.1)}.layout-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}.layout-btn{padding:16px 12px;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:8px;cursor:pointer;transition:all .2s ease;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}.layout-btn:hover{background:#ffffff0d;border-color:#fff3}.layout-btn.active{background:#f59e0b1a;border-color:#f59e0b4d;color:#f59e0b}.layout-icon{font-size:1.5rem}.layout-btn span{font-size:.9rem;font-weight:500}.preset-sizes{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin-bottom:16px}.preset-btn{padding:10px 12px;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:8px;cursor:pointer;transition:all .2s ease;font-size:.85rem;color:var(--text-secondary)}.preset-btn:hover{background:#ffffff0d;border-color:#fff3;color:var(--text-primary)}.size-inputs{display:grid;grid-template-columns:1fr 1fr;gap:16px}.size-input-group{display:flex;flex-direction:column;gap:6px}.size-input-group label{font-size:.9rem;margin-bottom:0}.size-input{padding:10px 12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:var(--text-primary);font-size:.9rem;transition:all .2s ease}.size-input:focus{outline:none;border-color:#f59e0b80;background:#ffffff14}.range-input{width:100%;height:6px;background:#ffffff1a;border-radius:3px;outline:none;cursor:pointer}.range-input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;background:#f59e0b;border-radius:50%;cursor:pointer;box-shadow:0 2px 8px #f59e0b66}.range-input::-moz-range-thumb{width:18px;height:18px;background:#f59e0b;border-radius:50%;cursor:pointer;border:none;box-shadow:0 2px 8px #f59e0b66}.color-input{width:60px;height:40px;padding:0;border:1px solid rgba(255,255,255,.1);border-radius:8px;cursor:pointer;background:none}.generate-btn{width:100%;padding:14px;background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease;font-weight:500;font-size:1rem;box-shadow:0 4px 16px #f59e0b4d}.generate-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 24px #f59e0b66}.generate-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.preview-section{background:#ffffff05;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;padding:24px;border:1px solid rgba(255,255,255,.1)}.download-btn{padding:12px 24px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease;font-weight:500;box-shadow:0 4px 16px #10b9814d}.download-btn:hover{transform:translateY(-2px);box-shadow:0 6px 24px #10b98166}.preview-container{text-align:center}.preview-image{max-width:100%;max-height:500px;border-radius:12px;box-shadow:0 8px 32px #0003}@media (max-width: 768px){.image-collage{padding:16px}.layout-grid{grid-template-columns:repeat(2,1fr)}.preset-sizes,.size-inputs{grid-template-columns:1fr}.images-list{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}.grid-header{flex-direction:column;gap:12px;align-items:stretch}}.id-photo-maker{width:100%;height:100%;padding:32px}.id-header{text-align:center;margin-bottom:32px}.id-header h2{font-size:2rem;font-weight:700;margin-bottom:8px;background:linear-gradient(135deg,#8b5cf6,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.id-header p{color:var(--text-secondary);font-size:1.1rem}.id-workspace{display:flex;flex-direction:column;gap:32px}.upload-area{border:2px dashed rgba(139,92,246,.3);border-radius:16px;padding:48px 24px;text-align:center;cursor:pointer;transition:all .3s ease;background:#ffffff05;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.upload-area:hover{border-color:#8b5cf699;background:#8b5cf60d;transform:translateY(-2px)}.upload-content{max-width:400px;margin:0 auto}.upload-icon{font-size:3rem;margin-bottom:16px}.upload-content h3{font-size:1.5rem;font-weight:600;margin-bottom:8px;color:var(--text-primary)}.upload-content p{color:var(--text-secondary);margin-bottom:8px}.upload-tip{font-size:.9rem;color:var(--text-muted)}.uploaded-preview{background:#ffffff05;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;padding:24px;border:1px solid rgba(255,255,255,.1)}.preview-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.preview-header h3{font-size:1.2rem;font-weight:600;color:var(--text-primary)}.preview-info{display:flex;align-items:center;gap:16px}.preview-info span{color:var(--text-secondary);font-size:.9rem}.clear-btn{padding:8px 16px;background:#ef44441a;color:#ef4444;border:1px solid rgba(239,68,68,.3);border-radius:8px;cursor:pointer;transition:all .2s ease;font-size:.9rem}.clear-btn:hover{background:#ef444433;border-color:#ef444480}.preview-container{display:flex;justify-content:center}.preview-image{max-width:100%;max-height:300px;border-radius:12px;box-shadow:0 8px 32px #0003}.settings-section{background:#ffffff05;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;padding:24px;border:1px solid rgba(255,255,255,.1)}.settings-section h3{font-size:1.2rem;font-weight:600;color:var(--text-primary);margin-bottom:24px}.setting-group{margin-bottom:24px}.setting-group label{display:block;font-size:1rem;font-weight:500;color:var(--text-secondary);margin-bottom:12px}.color-options{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.color-option{width:40px;height:40px;border-radius:8px;border:2px solid rgba(255,255,255,.1);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);position:relative}.color-option:hover{transform:scale(1.1);border-color:#ffffff4d}.color-option.active{border-color:#8b5cf6;transform:scale(1.1)}.color-option.popular:after{content:"🔥";position:absolute;top:-8px;right:-8px;font-size:.8rem}.custom-color-input{width:40px;height:40px;border-radius:8px;border:2px solid rgba(255,255,255,.1);cursor:pointer;background:none;padding:0}.specs-container{max-height:600px;overflow-y:auto;padding-right:8px}.specs-container::-webkit-scrollbar{width:6px}.specs-container::-webkit-scrollbar-track{background:#ffffff1a;border-radius:3px}.specs-container::-webkit-scrollbar-thumb{background:#8b5cf680;border-radius:3px}.spec-category{margin-bottom:24px}.category-title{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.1)}.specs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}.spec-card{background:#ffffff08;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:16px;cursor:pointer;transition:all .3s ease;position:relative}.spec-card:hover{transform:translateY(-2px);border-color:#8b5cf680;box-shadow:0 8px 32px #8b5cf633}.spec-card.selected{border-color:#8b5cf6;background:#8b5cf61a}.spec-info h5{font-size:1rem;font-weight:600;margin-bottom:4px;color:var(--text-primary)}.spec-size{font-size:.9rem;color:#8b5cf6;margin-bottom:2px;font-weight:500}.spec-pixels{font-size:.8rem;color:var(--text-secondary);margin-bottom:8px;font-family:SF Mono,Monaco,Inconsolata,monospace}.spec-desc{font-size:.85rem;color:var(--text-muted);margin-bottom:12px;line-height:1.4}.spec-generate-btn{width:100%;padding:8px;background:#8b5cf61a;color:#8b5cf6;border:1px solid rgba(139,92,246,.3);border-radius:8px;cursor:pointer;transition:all .2s ease;font-size:.9rem;font-weight:500}.spec-generate-btn:hover:not(:disabled){background:#8b5cf633;border-color:#8b5cf680}.spec-generate-btn:disabled{opacity:.5;cursor:not-allowed}.action-buttons{text-align:center}.generate-all-btn{padding:14px 32px;background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease;font-weight:500;font-size:1rem;box-shadow:0 4px 16px #8b5cf64d}.generate-all-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 24px #8b5cf666}.generate-all-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.results-section{background:#ffffff05;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;padding:24px;border:1px solid rgba(255,255,255,.1)}.results-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.results-header h3{font-size:1.2rem;font-weight:600;color:var(--text-primary)}.download-all-btn{padding:12px 24px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease;font-weight:500;box-shadow:0 4px 16px #10b9814d}.download-all-btn:hover{transform:translateY(-2px);box-shadow:0 6px 24px #10b98166}.results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}.result-card{background:#ffffff08;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:16px;transition:all .3s ease}.result-card:hover{transform:translateY(-2px);box-shadow:0 8px 32px #0003}.result-preview{margin-bottom:12px;text-align:center}.result-preview img{width:auto;height:120px;border-radius:8px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1)}.result-info h4{font-size:.95rem;font-weight:600;margin-bottom:4px;color:var(--text-primary)}.result-size{font-size:.85rem;color:#8b5cf6;margin-bottom:2px;font-weight:500}.result-pixels{font-size:.8rem;color:var(--text-secondary);margin-bottom:12px;font-family:SF Mono,Monaco,Inconsolata,monospace}.download-btn{width:100%;padding:8px;background:#10b9811a;color:#10b981;border:1px solid rgba(16,185,129,.3);border-radius:8px;cursor:pointer;transition:all .2s ease;font-size:.9rem;font-weight:500}.download-btn:hover{background:#10b98133;border-color:#10b98180}@media (max-width: 1024px){.specs-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}}@media (max-width: 768px){.id-photo-maker{padding:16px}.specs-grid{grid-template-columns:1fr}.results-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.color-options{justify-content:center}.preview-header{flex-direction:column;gap:12px;align-items:stretch}.results-header{flex-direction:column;gap:16px;align-items:stretch}.specs-container{max-height:400px}}.language-switcher{position:relative;display:inline-block}.language-button{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#374151;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease;min-width:120px}.language-button:hover{background:#fff3;border-color:#ffffff4d;transform:translateY(-1px)}.language-flag{font-size:16px}.language-name{flex:1;text-align:left}.dropdown-arrow{font-size:10px;color:#6b7280;transition:transform .3s ease}.language-button:hover .dropdown-arrow{transform:rotate(180deg)}.language-dropdown{position:absolute;top:100%;left:0;right:0;margin-top:4px;background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(0,0,0,.1);border-radius:12px;box-shadow:0 8px 32px #0000001a;z-index:1000;overflow:hidden;animation:fadeInDown .3s ease}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.language-option{display:flex;align-items:center;gap:12px;width:100%;padding:12px 16px;background:none;border:none;text-align:left;cursor:pointer;transition:all .2s ease;font-size:14px;font-weight:500;color:#374151}.language-option:hover{background:#667eea1a}.language-option.active{background:#667eea26;color:#667eea;font-weight:600}.option-flag{font-size:16px;width:20px;text-align:center}.option-name{flex:1}.check-mark{color:#667eea;font-weight:700;font-size:16px}.language-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:999;background:transparent}@media (max-width: 768px){.language-button{min-width:100px;padding:6px 10px;font-size:13px}.language-dropdown{left:auto;right:0;min-width:150px}.language-option{padding:10px 14px;font-size:13px}}@media (prefers-color-scheme: dark){.language-button{color:#e5e7eb;background:#0000004d;border-color:#ffffff1a}.language-button:hover{background:#0006}.language-dropdown{background:#000000e6;border-color:#ffffff1a}.language-option{color:#e5e7eb}.language-option:hover{background:#667eea33}}
