.face-editor-shell{display:flex;flex:1;min-width:0;min-height:0;flex-direction:column;padding:10px 12px 8px;border-radius:var(--radius-xl);background:var(--color-surface-primary);overflow:hidden}
.face-editor-header{flex:0 0 auto;padding:0 0 12px}.face-editor-title{display:flex;align-items:center;gap:12px}.face-editor-title h1{margin:0}.face-editor-title span{color:var(--color-text-secondary);font-weight:400;font-size:12px}
.face-actions{display:flex;align-items:center;gap:8px}.face-upload-button,.face-secondary-button{display:flex;min-height:36px;align-items:center;padding:8px 13px;border:1px solid var(--color-surface-secondary);border-radius:var(--radius-md);background:var(--color-surface-primary);color:var(--color-text-primary);cursor:pointer;font-size:13px;white-space:nowrap}.face-upload-button input{display:none}.face-secondary-button:disabled,.face-save-button:disabled{opacity:.35;cursor:not-allowed}.face-save-button{width:auto;min-height:36px;padding:8px 14px;white-space:nowrap}
.face-compare-toggle{gap:9px}.face-toggle-track{position:relative;width:28px;height:16px;border-radius:var(--radius-pill);background:var(--color-surface-tertiary);transition:background .16s}.face-toggle-track span{position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:#fff;transition:transform .16s}.face-compare-toggle[aria-pressed=true] .face-toggle-track{background:var(--color-status-positive)}.face-compare-toggle[aria-pressed=true] .face-toggle-track span{transform:translateX(12px)}
.face-workspace{display:flex;flex:1;min-height:0;flex-direction:row;gap:10px}.face-canvas-shell{position:relative;display:grid;flex:1;min-width:0;min-height:260px;place-items:center;padding:10px;overflow:hidden;border-radius:var(--radius-xl);background:rgba(255,255,255,.035)}.face-empty-icon{font-size:30px}.face-pick-button{padding:10px 14px;border:1px solid var(--color-surface-secondary);border-radius:var(--radius-md);background:var(--color-surface-primary);color:var(--color-text-primary);cursor:pointer}
.face-compare{position:relative;flex:none;max-width:100%;max-height:100%;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 14px 38px rgba(0,0,0,.32);isolation:isolate;user-select:none;-webkit-user-select:none;touch-action:none}.face-compare img{user-select:none;-webkit-user-select:none;-webkit-user-drag:none;pointer-events:none;transform:translate(var(--face-pan-x,0),var(--face-pan-y,0)) scale(var(--face-zoom,1));transform-origin:50% 50%;image-rendering:auto}.face-compare>img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:fill;z-index:0}.face-compare__before{position:absolute;inset:0 50% 0 0;overflow:hidden;z-index:1}.face-compare__before img{position:absolute;top:0;left:0;width:var(--image-width);height:var(--image-height);max-width:none;object-fit:fill}.face-compare__line{position:absolute;top:0;bottom:0;left:50%;width:2px;background:#fff;transform:translateX(-1px);z-index:2}.face-compare__line span{position:absolute;top:50%;left:50%;display:grid;width:34px;height:34px;place-items:center;border-radius:50%;background:#fff;color:#111;transform:translate(-50%,-50%);box-shadow:0 3px 12px rgba(0,0,0,.45)}.face-compare.is-pan-ready,.face-compare.is-zoomed:not(.is-tool-mode){cursor:grab}.face-compare.is-pan-ready:active,.face-compare.is-zoomed:not(.is-tool-mode):active{cursor:grabbing}
.face-compare.is-comparison-off .face-compare__before,.face-compare.is-comparison-off .face-compare__line,.face-compare.is-comparison-off .face-badge{display:none}
.face-badge{position:absolute;top:12px;padding:5px 8px;border-radius:var(--radius-sm);background:rgba(8,8,8,.72);font-size:11px}.face-badge--before{left:12px}.face-badge--after{right:12px}.face-loading{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;background:rgba(8,8,8,.78);z-index:5}.face-loading p{margin:12px 0 0;color:var(--color-text-secondary);font-size:12px}
.face-retouch-feedback{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}.face-compare.is-retouch-processing .face-tool-cursor{animation:face-retouch-pulse .75s ease-in-out infinite alternate}.face-compare.is-retouch-processing .face-tool-hint::after{content:" · применяю…"}.face-tool-overlay{overscroll-behavior:contain}
@keyframes face-retouch-pulse{to{opacity:.55}}
.face-tool-overlay{position:absolute;inset:0;cursor:crosshair;z-index:4;touch-action:none}.face-tool-editor-bar{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:linear-gradient(rgba(0,0,0,.72),transparent);z-index:3;pointer-events:none}.face-tool-editor-bar button{padding:6px 9px;border:0;border-radius:9px;background:rgba(18,18,18,.62);color:#fff;cursor:pointer;font-size:12px;pointer-events:auto}.face-tool-editor-bar button:last-child{font-weight:700}.face-tool-editor-bar strong{font-size:13px;text-shadow:0 1px 4px #000}.face-tool-cursor{position:absolute;top:0;left:0;display:block;width:var(--tool-width,120px);height:var(--tool-height,120px);border:1.5px solid #fff;border-radius:18px;transform:translate(var(--tool-x,0),var(--tool-y,0)) translate(-50%,-50%);box-shadow:0 0 0 1px rgba(0,0,0,.42),inset 0 0 18px rgba(255,255,255,.08);contain:layout style paint;will-change:transform;cursor:move;pointer-events:auto}.face-tool-cursor::before,.face-tool-cursor::after{position:absolute;background:rgba(255,255,255,.82);content:"";pointer-events:none}.face-tool-cursor::before{top:50%;left:9px;right:9px;height:1px}.face-tool-cursor::after{top:9px;bottom:9px;left:50%;width:1px}.face-tool-cursor i{position:absolute;width:13px;height:13px;border:2px solid #fff;border-radius:50%;background:#252525;box-shadow:0 1px 4px rgba(0,0,0,.55)}.face-tool-cursor i[data-handle=nw]{top:-7px;left:-7px;cursor:nwse-resize}.face-tool-cursor i[data-handle=ne]{top:-7px;right:-7px;cursor:nesw-resize}.face-tool-cursor i[data-handle=sw]{bottom:-7px;left:-7px;cursor:nesw-resize}.face-tool-cursor i[data-handle=se]{right:-7px;bottom:-7px;cursor:nwse-resize}.face-tool-cursor.is-brush{border-radius:50%;background:rgba(255,255,255,.1);cursor:crosshair;pointer-events:none}.face-tool-cursor.is-brush i{display:none}.face-tool-cursor.is-retouch{background:rgba(255,255,255,.48);box-shadow:0 0 0 1px rgba(0,0,0,.52)}.face-tool-cursor.is-retouch::before,.face-tool-cursor.is-retouch::after{display:none}.face-tool-cursor.is-reshape{border-radius:50%;border-style:dashed;cursor:grab;pointer-events:none}.face-tool-cursor.is-reshape i{display:none}.face-tool-hint{position:absolute;bottom:14px;left:50%;max-width:calc(100% - 32px);padding:7px 10px;border-radius:var(--radius-pill);background:rgba(8,8,8,.76);font-size:11px;text-align:center;white-space:nowrap;transform:translateX(-50%);pointer-events:none}
.face-zoom-controls{position:absolute;top:48px;right:10px;display:flex;align-items:center;gap:2px;padding:3px;border:1px solid rgba(255,255,255,.16);border-radius:12px;background:rgba(16,16,16,.78);box-shadow:0 4px 16px rgba(0,0,0,.28);z-index:7}.face-zoom-controls button{display:grid;width:28px;height:28px;place-items:center;padding:0;border:0;border-radius:8px;background:transparent;color:#fff;cursor:pointer;font-size:18px}.face-zoom-controls button:hover{background:rgba(255,255,255,.12)}.face-zoom-controls button:disabled{opacity:.3;cursor:default}.face-zoom-controls output{min-width:42px;color:var(--color-text-secondary);font-size:10px;text-align:center}
.face-dock{display:grid;width:338px;min-width:338px;min-height:0;grid-template-areas:"top top" "tiles control";grid-template-columns:minmax(0,1fr) 58px;grid-template-rows:auto minmax(0,1fr);gap:0 9px;padding:10px;border:1px solid var(--color-border-dark);border-radius:var(--radius-xl);background:#191919}.face-dock__top{grid-area:top;display:flex;flex-direction:column;gap:9px;margin-bottom:9px}.face-category-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}.face-category-tab{padding:8px 7px;border:0;border-radius:var(--radius-md);background:transparent;color:var(--color-text-secondary);cursor:pointer;font-size:12px}.face-category-tab[aria-selected=true]{background:var(--color-surface-secondary);color:var(--color-text-primary)}.face-dock__meta{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--color-text-secondary);font-size:11px;white-space:nowrap}.face-dock__meta button{padding:0;border:0;background:transparent;color:var(--color-text-primary);cursor:pointer;font-size:11px}.face-dock__meta button:disabled{opacity:.35}
.face-effect-tiles{grid-area:tiles;display:grid;min-height:0;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:7px;padding-right:3px;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin}.face-effect-tile{position:relative;display:flex;width:100%;min-width:0;aspect-ratio:1;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:5px;border:1px solid transparent;border-radius:var(--radius-md);background:var(--color-surface-primary);color:var(--color-text-secondary);cursor:pointer}.face-effect-tile:hover{background:var(--color-surface-hover)}.face-effect-tile[aria-pressed=true]{border-color:rgba(255,255,255,.75);background:var(--color-surface-secondary);color:var(--color-text-primary)}.face-effect-tile__icon{display:grid;min-height:23px;place-items:center;font-size:19px;line-height:22px}.face-effect-tile__label{width:100%;min-width:0;overflow:hidden;font-size:10px;line-height:12px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.face-effect-tile.is-active::after{position:absolute;top:6px;right:7px;width:6px;height:6px;border-radius:50%;background:var(--color-status-positive);content:""}
.face-active-control{grid-area:control;display:flex;min-width:0;align-items:center;flex-direction:column;gap:9px;padding:4px 0 2px;border-left:1px solid var(--color-border-dark)}.face-active-control__name{display:flex;width:100%;min-width:0;align-items:center;flex-direction:column;gap:3px;padding:0 3px;text-align:center}.face-active-control__name span{font-size:17px}.face-active-control__name strong{width:100%;overflow:hidden;font-size:8px;line-height:10px;letter-spacing:-.2px;text-overflow:ellipsis;white-space:nowrap}.face-slider-rail{position:relative;width:32px;height:clamp(120px,36vh,250px);margin:2px 0}.face-active-control input[type=range]{position:absolute;top:50%;left:50%;width:clamp(120px,36vh,250px);height:4px;margin:0;appearance:none;-webkit-appearance:none;border-radius:var(--radius-pill);background:var(--color-surface-tertiary);cursor:pointer;transform:translate(-50%,-50%) rotate(-90deg)}.face-active-control output{color:var(--color-text-secondary);font-size:11px;text-align:center}.face-active-control>button{padding:0;border:0;background:transparent;color:var(--color-text-secondary);cursor:pointer;font-size:16px}.face-active-control>button:disabled{opacity:.3;cursor:default}.face-history-button{display:none}.face-active-control input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:var(--radius-pill);background:var(--color-surface-tertiary)}.face-active-control input[type=range]::-webkit-slider-thumb{width:18px;height:18px;margin-top:-7px;-webkit-appearance:none;border:2px solid #fff;border-radius:50%;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.35)}.face-active-control input[type=range]::-moz-range-track{height:4px;border:0;border-radius:var(--radius-pill);background:var(--color-surface-tertiary)}.face-active-control input[type=range]::-moz-range-thumb{width:16px;height:16px;border:2px solid #fff;border-radius:50%;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.35)}
.face-workspace.is-tool-workspace{flex-direction:column}.face-workspace.is-tool-workspace .face-canvas-shell{min-height:0}.face-dock.is-tool-dock{display:grid;width:auto;min-width:0;grid-template-areas:"tiles" "control";grid-template-columns:1fr;grid-template-rows:auto auto;padding:8px 10px}.face-dock.is-tool-dock .face-dock__top{display:none}.face-dock.is-tool-dock .face-effect-tiles{display:flex;overflow-x:auto;overflow-y:hidden;padding:0 0 7px}.face-dock.is-tool-dock .face-effect-tile{width:76px;min-width:76px;height:62px;min-height:62px;aspect-ratio:auto;flex:0 0 76px}.face-dock.is-tool-dock .face-active-control{display:grid;grid-template-columns:minmax(110px,auto) minmax(160px,1fr) 42px 28px 28px 28px;align-items:center;gap:10px;padding:8px 4px 0;border-top:1px solid var(--color-border-dark);border-left:0}.face-dock.is-tool-dock .face-active-control__name{flex-direction:row;gap:8px;text-align:left}.face-dock.is-tool-dock .face-active-control__name strong{font-size:12px;line-height:normal}.face-dock.is-tool-dock .face-color-picker{display:none}.face-dock.is-tool-dock .face-slider-rail{width:100%;height:18px;margin:0}.face-dock.is-tool-dock .face-active-control input[type=range]{position:absolute;top:50%;left:0;width:100%;min-width:120px;height:4px;transform:translateY(-50%)}.face-dock.is-tool-dock .face-history-button{display:block}
.face-dock.is-tool-dock .face-active-control.is-direct-retouch{grid-template-columns:minmax(180px,1fr) 28px 28px 28px}.face-active-control.is-direct-retouch .face-slider-rail,.face-active-control.is-direct-retouch output{display:none}.face-active-control.is-direct-retouch .face-active-control__name span{font-size:14px}.face-active-control.is-direct-retouch .face-active-control__name strong{white-space:normal}
.face-color-picker{position:relative;grid-area:color;width:28px;height:28px}.face-color-picker.is-inactive{visibility:hidden;pointer-events:none}.face-color-trigger{display:grid;width:28px;height:28px;place-items:center;padding:3px;border:1px solid rgba(255,255,255,.24);border-radius:50%;background:#252525;cursor:pointer}.face-color-trigger span{display:block;width:20px;height:20px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}.face-color-trigger[aria-expanded=true]{border-color:#fff}
.face-color-popover{position:absolute;right:38px;bottom:-8px;width:244px;padding:12px;border:1px solid rgba(255,255,255,.14);border-radius:14px;background:#272727;box-shadow:0 14px 34px rgba(0,0,0,.48);z-index:20}.face-color-popover::after{position:absolute;right:-6px;bottom:15px;width:10px;height:10px;border-top:1px solid rgba(255,255,255,.14);border-right:1px solid rgba(255,255,255,.14);background:#272727;content:"";transform:rotate(45deg)}.face-color-popover__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.face-color-popover__header strong{font-size:12px}.face-color-popover__header button{padding:0;border:0;background:transparent;color:var(--color-text-secondary);cursor:pointer;font-size:20px;line-height:18px}.face-color-swatches{display:grid;grid-template-columns:repeat(7,1fr);gap:7px}.face-color-swatch{width:25px;height:25px;padding:0;border:1px solid rgba(255,255,255,.18);border-radius:50%;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}.face-color-swatch[aria-pressed=true]{outline:2px solid #fff;outline-offset:2px}.face-color-wheel{position:relative;display:flex;align-items:center;gap:8px;margin-top:12px;padding-top:10px;border-top:1px solid rgba(255,255,255,.1);color:var(--color-text-secondary);cursor:pointer;font-size:11px}.face-color-wheel input{position:absolute;width:30px;height:30px;opacity:0;cursor:pointer}.face-color-wheel__icon{display:block;width:25px;height:25px;border:2px solid #fff;border-radius:50%;background:conic-gradient(#f44,#fc3,#4c6,#3cf,#65f,#d4f,#f44)}
.face-footer{display:flex;flex:0 0 auto;align-items:center;gap:10px;padding:7px 2px 0;color:var(--color-text-secondary);font-size:11px}.face-footer__right{margin-left:auto}.hidden{display:none!important}
@media(max-width:1100px){.face-actions{gap:5px}.face-upload-button,.face-secondary-button{padding-inline:9px}.face-dock{width:300px;min-width:300px;grid-template-columns:minmax(0,1fr) 54px}.face-effect-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.face-workspace{flex-direction:column}.face-canvas-shell{min-height:360px}.face-dock{display:block;width:auto;min-width:0}.face-dock__top{display:flex;flex-direction:row;align-items:center;justify-content:space-between}.face-category-tabs{display:flex}.face-effect-tiles{display:flex;flex-direction:row;overflow-x:auto;overflow-y:hidden}.face-effect-tile{width:76px;min-width:76px;height:68px;min-height:68px;aspect-ratio:auto;flex:0 0 76px;flex-direction:column;justify-content:center;gap:5px;padding:5px}.face-effect-tile__label{text-align:center}.face-active-control{display:grid;grid-template-areas:"name color slider value reset";grid-template-columns:minmax(110px,auto) 28px minmax(140px,1fr) 34px 24px;align-items:center;gap:10px;padding:8px 4px 0;border-top:1px solid var(--color-border-dark);border-left:0}.face-active-control__name{grid-area:name;flex-direction:row;gap:8px;padding:0;text-align:left}.face-active-control__name strong{font-size:12px;line-height:normal}.face-slider-rail{grid-area:slider;width:100%;height:18px;margin:0}.face-active-control input[type=range]{position:absolute;top:50%;left:0;width:100%;min-width:120px;height:4px;transform:translateY(-50%)}.face-active-control output{grid-area:value;text-align:right}.face-active-control>button{grid-area:reset}.face-color-popover{right:auto;bottom:38px;left:-8px}.face-color-popover::after{right:auto;bottom:-6px;left:15px;border-top:0;border-right:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14)}}
@media(max-width:720px){.face-editor-shell{min-height:calc(100vh - 80px)}.face-editor-header{display:block}.face-editor-title{display:none}.face-actions{width:100%;flex-wrap:nowrap;justify-content:space-between}.face-upload-button{display:none}.face-canvas-shell{min-height:320px}.face-category-tabs{max-width:100%;overflow-x:auto}.face-dock__top{display:block}.face-dock__meta{justify-content:space-between;margin-top:8px}.face-active-control{grid-template-areas:"name name name name" "color slider value reset";grid-template-columns:28px minmax(120px,1fr) 44px 26px}.face-color-popover{right:auto;left:-4px}.face-footer__right{display:none}.face-tool-hint{bottom:12px;max-width:calc(100% - 24px);white-space:normal}.face-dock.is-tool-dock .face-active-control{grid-template-areas:"name name name name name" "slider value undo redo reset";grid-template-columns:minmax(120px,1fr) 40px 28px 28px 28px;gap:8px}.face-dock.is-tool-dock .face-active-control__name{grid-area:name}.face-dock.is-tool-dock .face-slider-rail{grid-area:slider}.face-dock.is-tool-dock .face-active-control output{grid-area:value}.face-dock.is-tool-dock #undo-tool{grid-area:undo}.face-dock.is-tool-dock #redo-tool{grid-area:redo}.face-dock.is-tool-dock #reset-effect{grid-area:reset}.face-dock.is-tool-dock .face-active-control.is-direct-retouch{grid-template-areas:"name undo redo reset";grid-template-columns:minmax(150px,1fr) 28px 28px 28px}.face-zoom-controls{top:46px;right:8px}.face-zoom-controls output{display:none}}