*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0}body{color:#20242b;background:#f4f5f7;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.customer-studio{background:#f4f5f7;flex-direction:column;width:100%;height:100vh;display:flex;overflow:hidden}.customer-topbar{background:#fff;border-bottom:1px solid #e7e9ed;flex:0 0 64px;justify-content:space-between;align-items:center;height:64px;padding:0 20px;display:flex}.customer-brand{align-items:center;gap:12px;min-width:0;display:flex}.customer-brand strong{color:#20242b;font-size:16px;font-weight:700}.customer-brand span{color:#747b86;white-space:nowrap;text-overflow:ellipsis;min-width:0;max-width:360px;font-size:14px;overflow:hidden}.customer-topbar-actions{align-items:center;gap:8px;display:flex}.customer-topbar-actions button{color:#252a31;height:36px;font:inherit;cursor:pointer;background:#fff;border:1px solid #dfe2e7;border-radius:8px;padding:0 14px;font-size:14px;font-weight:500;transition:background .15s,border-color .15s}.customer-topbar-actions button:hover{background:#f7f8fa}.customer-topbar-actions button.primary{color:#fff;background:#252a31;border-color:#252a31}.customer-topbar-actions button.primary:hover{background:#171a1f}.customer-photo-toolbar{z-index:20;background:#fffffff7;border-bottom:1px solid #e7e9ed;flex:0 0 62px;justify-content:center;align-items:center;min-height:62px;padding:0 20px;animation:.22s cubic-bezier(.22,1,.36,1) both customer-toolbar-in;display:flex;box-shadow:0 4px 16px #14181e0f}@keyframes customer-toolbar-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.customer-photo-toolbar-inner{justify-content:center;align-items:center;gap:16px;width:auto;max-width:100%;display:flex}.customer-photo-control{align-items:center;gap:9px;display:flex}.customer-photo-control-label{color:#666d78;font-size:12px;font-weight:500}.customer-photo-zoom{align-items:center;gap:8px;width:190px;display:flex}.customer-photo-zoom input[type=range]{accent-color:#252a31;cursor:pointer;width:100%}.customer-slider-icon{color:#777e88;justify-content:center;align-items:center;width:14px;font-size:15px;line-height:1;display:flex}.customer-photo-action{color:#30353d;height:38px;font:inherit;cursor:pointer;background:#fff;border:1px solid #dfe2e7;border-radius:8px;justify-content:center;align-items:center;gap:7px;padding:0 13px;font-size:13px;font-weight:500;transition:background .15s,border-color .15s,transform .1s;display:inline-flex}.customer-photo-action:hover{background:#f6f7f9;border-color:#cfd3da}.customer-photo-action:active{transform:scale(.97)}.customer-photo-action-icon{font-size:17px;line-height:1}.customer-photo-action.delete{color:#a33b3b;border-color:#ead4d4}.customer-photo-action.delete:hover{background:#fff6f6;border-color:#dcb7b7}.customer-main{flex:1;min-height:0;display:flex;overflow:hidden}.customer-pages{background:#fff;border-right:1px solid #e7e9ed;flex-direction:column;flex:0 0 76px;align-items:center;gap:10px;width:76px;padding:16px 10px;display:flex;overflow-y:auto}.customer-page{cursor:pointer;background:#f7f8fa;border:1px solid #e1e4e9;border-radius:8px;flex:none;justify-content:center;align-items:flex-end;width:54px;height:68px;padding-bottom:7px;transition:border-color .15s,box-shadow .15s,background .15s;display:flex}.customer-page:hover{background:#f1f2f4;border-color:#cdd1d8}.customer-page.active{border-color:#252a31;box-shadow:0 0 0 1px #252a31}.customer-page span{color:#656b75;font-size:11px;font-weight:600}.customer-workspace{background:#f7f6f3;flex:1;justify-content:center;align-items:center;min-width:0;min-height:0;display:flex;position:relative;overflow:hidden}.customer-canvas-container{background:#fff;flex:none;justify-content:center;align-items:center;line-height:0;display:flex;position:relative;box-shadow:0 16px 45px #14181e29}.customer-canvas-container canvas{display:block}.customer-workspace-zoom{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:15;background:#fffffff5;border:1px solid #dfe2e7;border-radius:10px;align-items:center;gap:8px;height:42px;padding:0 10px;display:flex;position:absolute;bottom:18px;right:20px;box-shadow:0 6px 20px #14181e1a}.customer-workspace-zoom input[type=range]{accent-color:#252a31;cursor:pointer;width:120px}.customer-workspace-zoom-value{text-align:center;color:#555c66;width:42px;font-size:12px;font-weight:600}.customer-workspace-zoom-button{color:#4c535d;cursor:pointer;background:0 0;border:0;border-radius:6px;justify-content:center;align-items:center;width:24px;height:24px;padding:0;font-size:18px;line-height:1;display:flex}.customer-workspace-zoom-button:hover{background:#f0f1f3}.customer-pages::-webkit-scrollbar{width:5px}.customer-pages::-webkit-scrollbar-thumb{background:#d4d7dc;border-radius:10px}.customer-pages::-webkit-scrollbar-track{background:0 0}@media (width<=760px){.customer-brand span{display:none}.customer-photo-toolbar{padding:0 12px}.customer-photo-toolbar-inner{gap:8px}.customer-photo-toolbar-label{display:none}.customer-photo-control{flex:1;min-width:0}.customer-photo-zoom{width:100%}.customer-photo-action{padding:0 9px}.customer-photo-action span:last-child{display:none}.customer-workspace-zoom{bottom:12px;right:12px}}.customer-photo-action.active{background:#f1f2f4;border-color:#252a31}.customer-photo-toolbar{position:relative}.customer-filter-popover{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:50;background:#fffffffa;border:1px solid #dfe2e7;border-radius:14px;width:min(430px,100vw - 32px);padding:14px;animation:.16s cubic-bezier(.22,1,.36,1) both customer-filter-popover-in;position:absolute;top:calc(100% + 8px);left:50%;transform:translate(-50%);box-shadow:0 18px 45px #14181e29}@keyframes customer-filter-popover-in{0%{opacity:0;transform:translate(-50%)translateY(-6px)scale(.98)}to{opacity:1;transform:translate(-50%)translateY(0)scale(1)}}.customer-filter-popover-header{justify-content:space-between;align-items:flex-start;margin-bottom:12px;display:flex}.customer-filter-popover-header>div{flex-direction:column;gap:2px;display:flex}.customer-filter-popover-header strong{color:#252a31;font-size:13px;font-weight:650}.customer-filter-popover-header span{color:#7a818b;font-size:11px}.customer-filter-close{color:#656c76;cursor:pointer;background:0 0;border:0;border-radius:7px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;font-size:20px;line-height:1;display:flex}.customer-filter-close:hover{background:#f0f1f3}.customer-filter-options{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.customer-filter-option{color:#555c66;min-width:0;font:inherit;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:10px;flex-direction:column;align-items:center;gap:7px;padding:6px;font-size:11px;font-weight:500;transition:background .15s,border-color .15s,transform .1s;display:flex}.customer-filter-option:hover{background:#f5f6f8;border-color:#e1e4e9}.customer-filter-option:active{transform:scale(.98)}.customer-filter-option.active{background:#f2f3f5;border-color:#252a31}.customer-filter-preview{background:#eceef1;border-radius:7px;width:82px;height:62px;overflow:hidden}.customer-filter-preview img{object-fit:cover;width:100%;height:100%;display:block}.customer-filter-classic img{filter:grayscale()}.customer-filter-soft img{filter:grayscale()contrast(.82)}.customer-filter-highContrast img{filter:grayscale()contrast(1.45)}@media (width<=760px){.customer-filter-popover{width:min(360px,100vw - 24px)}.customer-filter-options{grid-template-columns:repeat(2,minmax(0,1fr))}.customer-filter-preview{width:100%;height:72px}}.customer-text-toolbar{background:#fff;border-bottom:1px solid #e5e7eb;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 20px;display:flex}.customer-text-toolbar textarea{min-width:220px;max-width:420px;font:inherit;resize:vertical;border:1px solid #d1d5db;border-radius:8px;flex:1;padding:9px 11px}.customer-text-align{gap:4px;display:flex}.customer-text-align button{cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:7px;padding:7px 12px}.customer-text-align button.active{background:#f1f2f4;border-color:#252a31}.customer-text-toolbar small{color:#6b7280}