.image-filter-modal{background-color:var(--bg-overlay);z-index:var(--z-modal-overlay);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:var(--safe-area-top)var(--safe-area-right)var(--safe-area-bottom)var(--safe-area-left);box-sizing:border-box;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.image-filter-modal__content{width:min(90vw,1400px);max-width:100%;height:min(85vh,900px);max-height:calc(100vh - var(--safe-area-top) - var(--safe-area-bottom));background:var(--bg-primary);border-radius:var(--radius-xl);border:var(--border-width)solid var(--border-default);min-height:min(700px,100vh - 100px);box-shadow:var(--shadow-xl);flex-direction:column;display:flex;position:relative;overflow:hidden}.image-filter-modal__header{padding:var(--space-lg)var(--space-xl);border-bottom:var(--border-width)solid var(--border-default);background:#0003;flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.image-filter-modal__title{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--text-primary);text-transform:uppercase;letter-spacing:var(--letter-spacing-wide);margin:0}.image-filter-modal__close{border:var(--border-width)solid var(--border-default);border-radius:var(--radius-sm);color:var(--text-primary);width:var(--touch-target-min);height:var(--touch-target-min);min-width:var(--touch-target-min);min-height:var(--touch-target-min);cursor:pointer;transition:all var(--transition-base);-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:#ffffff14;justify-content:center;align-items:center;padding:0;display:flex}.image-filter-modal__close:hover{background:#ffffff26;border-color:#ffffff40;transform:scale(1.05)}.image-filter-modal__close-icon{stroke:currentColor;stroke-width:2px;stroke-linecap:round;width:20px;height:20px}.image-filter-modal__body{flex:1;min-height:0;display:flex;overflow:hidden}.image-filter-modal__canvas-section{background:#0000001a;flex:60%;justify-content:center;align-items:center;max-width:65%;padding:24px;display:flex}.image-filter-modal__canvas-container{background:linear-gradient(160deg,#0d101cf2,#181e34f2);border:1px solid #ffffff0d;border-radius:12px;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;display:flex;box-shadow:inset 0 4px 16px #0000004d}.image-filter-modal__canvas{background-color:#1b1d24;background-image:linear-gradient(45deg,#ffffff0d 25%,#0000 25% 75%,#ffffff0d 75%,#ffffff0d),linear-gradient(45deg,#ffffff0d 25%,#0000 25% 75%,#ffffff0d 75%,#ffffff0d);background-position:0 0,12px 12px;background-size:24px 24px;border-radius:8px;max-width:100%;max-height:100%;box-shadow:0 8px 32px #0006}.image-filter-modal__loading{color:#fff;flex-direction:column;justify-content:center;align-items:center;gap:16px;height:100%;display:flex}.image-filter-modal__spinner{border:4px solid #fff3;border-top-color:#22d5ff;border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}.image-filter-modal__loading-text{color:#e3e7ff;text-transform:uppercase;letter-spacing:.1em;font-size:.9rem}@keyframes spin{to{transform:rotate(360deg)}}.image-filter-modal__error{color:#fff;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:12px;height:100%;padding:20px;display:flex}.image-filter-modal__error-icon{color:#ff4757;stroke-width:2px;width:48px;height:48px}.image-filter-modal__error-text{color:#fff;text-transform:uppercase;letter-spacing:.1em;font-size:1rem;font-weight:600}.image-filter-modal__error-details{color:#ff6b8a;font-size:.85rem;line-height:1.4}.image-filter-modal__warning{color:#ffc107;background:#ffc1071a;border:1px solid #ffc1074d;border-radius:8px;align-items:center;gap:8px;padding:10px 12px;display:flex}.image-filter-modal__warning-icon{stroke-width:2px;flex-shrink:0;width:16px;height:16px}.image-filter-modal__warning-text{font-size:.75rem;font-weight:500;line-height:1.3}.image-filter-modal__controls{background:#0003;border-left:1px solid #ffffff0f;flex-direction:column;flex:0 0 40%;gap:18px;min-width:320px;max-width:50%;padding:20px;display:flex;overflow-y:auto}.image-filter-modal__section{flex-direction:column;gap:8px;display:flex}.image-filter-modal__section-title{color:#fff;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid #ffffff1a;margin:0;padding-bottom:6px;font-size:.9rem;font-weight:600}.image-filter-modal__presets{flex-wrap:wrap;gap:8px;display:flex}.image-filter-modal__preset{min-width:0;padding:var(--space-md)var(--space-sm);border:var(--border-width)solid var(--border-default);border-radius:var(--radius-sm);color:var(--text-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);text-transform:uppercase;letter-spacing:var(--letter-spacing-normal);cursor:pointer;transition:all var(--transition-base);text-align:center;white-space:nowrap;text-overflow:ellipsis;min-height:var(--touch-target-min);-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:#ffffff0f;flex:calc(50% - 4px);overflow:hidden}.image-filter-modal__preset:hover{background:#ffffff1f;border-color:#fff3;transform:translateY(-1px)}.image-filter-modal__preset.active{background:linear-gradient(135deg,#0f65ff,#22d5ff);border-color:#0f65ff;box-shadow:0 4px 15px #0f65ff4d}.image-filter-modal__slider-group{flex-direction:column;gap:8px;display:flex}.image-filter-modal__slider-label{justify-content:space-between;align-items:center;display:flex}.image-filter-modal__slider-name{color:#e3e7ff;text-transform:capitalize;font-size:.85rem;font-weight:500}.image-filter-modal__slider-value{color:#22d5ff;text-align:center;background:#22d5ff1a;border-radius:6px;min-width:35px;padding:2px 8px;font-size:.8rem;font-weight:600}.image-filter-modal__slider{cursor:pointer;appearance:none;background:#ffffff1a;border-radius:3px;outline:none;width:100%;height:6px}.image-filter-modal__slider::-webkit-slider-thumb{appearance:none;cursor:pointer;background:linear-gradient(135deg,#0f65ff,#22d5ff);border-radius:50%;width:18px;height:18px;transition:all .2s;box-shadow:0 2px 8px #0f65ff66}.image-filter-modal__slider::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:0 4px 12px #0f65ff99}.image-filter-modal__slider::-moz-range-thumb{cursor:pointer;background:linear-gradient(135deg,#0f65ff,#22d5ff);border:none;border-radius:50%;width:18px;height:18px;transition:all .2s;box-shadow:0 2px 8px #0f65ff66}.image-filter-modal__slider::-moz-range-thumb:hover{transform:scale(1.1);box-shadow:0 4px 12px #0f65ff99}.image-filter-modal__download{padding:var(--space-md)var(--space-xl);background:linear-gradient(135deg,var(--color-primary),var(--color-primary-hover));border-radius:var(--radius-md);color:var(--text-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:var(--letter-spacing-wide);cursor:pointer;transition:all var(--transition-base);box-shadow:var(--shadow-primary);text-align:center;min-height:var(--touch-target-comfortable);-webkit-tap-highlight-color:transparent;touch-action:manipulation;border:none;width:100%}.image-filter-modal__download:hover{background:linear-gradient(135deg,#1a75ff,#32e6ff);transform:translateY(-2px);box-shadow:0 6px 20px #0f65ff66}.image-filter-modal__download:active{transform:translateY(0)}@media (max-width:1024px){.image-filter-modal__content{width:95vw;height:90vh;max-height:calc(100vh - var(--safe-area-top) - var(--safe-area-bottom))}.image-filter-modal__canvas-section{max-width:60%;padding:var(--space-lg);flex:60%}.image-filter-modal__controls{min-width:280px;max-width:45%;padding:var(--space-lg);gap:var(--space-lg);-webkit-overflow-scrolling:touch;flex:0 0 40%;overflow-y:auto}.image-filter-modal__presets{gap:var(--space-xs);flex-wrap:wrap;display:flex}.image-filter-modal__preset{font-size:var(--font-size-xs);padding:var(--space-sm)var(--space-xs);min-height:var(--touch-target-min);flex:calc(50% - 3px)}}@media (max-width:768px){.image-filter-modal{align-items:stretch;padding:0}.image-filter-modal__content{border:none;border-radius:0;flex-direction:column;width:100vw;height:100vh;max-height:100vh;display:flex}.image-filter-modal__header{padding:var(--space-md)var(--space-lg);flex-shrink:0}.image-filter-modal__title{font-size:var(--font-size-lg)}.image-filter-modal__body{-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;min-height:0;overflow-y:auto}.image-filter-modal__canvas-section{max-width:100%;padding:var(--space-md);flex:45%;min-height:0}.image-filter-modal__controls{min-width:100%;max-width:100%;padding:var(--space-md);gap:var(--space-md);-webkit-overflow-scrolling:touch;flex:55%;overflow-y:auto}.image-filter-modal__presets{gap:var(--space-xs);flex-wrap:wrap;display:flex}.image-filter-modal__preset{font-size:var(--font-size-xs);padding:var(--space-sm)var(--space-xs);min-height:var(--touch-target-min);flex:calc(50% - 3px)}}