:root{--skin-primary:#8b5cf6;--skin-primary-light:#a78bfa;--skin-secondary:#ec4899;--skin-accent:#06b6d4;--skin-success:#10b981;--skin-warning:#f59e0b;--skin-glass:#ffffff14;--skin-glass-border:#ffffff1f;--skin-glow-purple:#8b5cf680;--skin-glow-pink:#ec489980;--skin-glow-cyan:#06b6d480}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes fadeInScale{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes slideInFromLeft{0%{opacity:0;transform:translate(-40px)}to{opacity:1;transform:translate(0)}}@keyframes slideInFromRight{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}@keyframes revealFromCenter{0%{opacity:0;filter:blur(10px);transform:scale(.5)rotate(-10deg)}to{opacity:1;filter:blur();transform:scale(1)rotate(0)}}.skin-animate-in{opacity:0;animation:.6s cubic-bezier(.16,1,.3,1) forwards fadeInUp}.skin-animate-in-scale{opacity:0;animation:.5s cubic-bezier(.34,1.56,.64,1) forwards fadeInScale}.skin-animate-in-left{opacity:0;animation:.5s cubic-bezier(.16,1,.3,1) forwards slideInFromLeft}.skin-animate-in-right{opacity:0;animation:.5s cubic-bezier(.16,1,.3,1) forwards slideInFromRight}.skin-animate-reveal{opacity:0;animation:.7s cubic-bezier(.34,1.56,.64,1) forwards revealFromCenter}.delay-100{animation-delay:.1s}.delay-150{animation-delay:.15s}.delay-200{animation-delay:.2s}.delay-250{animation-delay:.25s}.delay-300{animation-delay:.3s}.delay-400{animation-delay:.4s}.delay-500{animation-delay:.5s}.delay-600{animation-delay:.6s}.skin-glass-card{-webkit-backdrop-filter:blur(20px)saturate(180%);background:linear-gradient(135deg,#ffffff1a 0%,#ffffff0d 100%);border:1px solid #ffffff26;transition:all .4s cubic-bezier(.16,1,.3,1);box-shadow:0 8px 32px #0003,inset 0 1px #ffffff26,inset 0 -1px #0000001a}.skin-glass-card:hover{box-shadow:0 16px 48px #00000040,inset 0 1px 0 #fff3,0 0 30px var(--skin-glow-purple);background:linear-gradient(135deg,#ffffff26 0%,#ffffff14 100%);transform:translateY(-4px)}.skin-glass-panel{-webkit-backdrop-filter:blur(30px)saturate(150%);background:#0f0f19d9;border:1px solid #ffffff14;box-shadow:0 4px 24px #0000004d,inset 0 1px #ffffff1a}.skin-btn-premium{transform-origin:50%;transition:all .3s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}.skin-btn-premium:before{content:"";background:linear-gradient(135deg,#0000 0%,#ffffff1a 50%,#0000 100%);transition:transform .6s;position:absolute;inset:0;transform:translate(-100%)skew(-15deg)}.skin-btn-premium:hover:before{transform:translate(100%)skew(-15deg)}.skin-btn-premium:hover{transform:translateY(-3px)scale(1.02);box-shadow:0 10px 30px -5px,0 0 20px #ffffff1a}.skin-btn-premium:active{transition:transform .1s;transform:translateY(0)scale(.98)}.skin-tool-btn{transition:all .25s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}.skin-tool-btn:after{content:"";opacity:0;background:radial-gradient(circle,#fff3 0%,#0000 70%);transition:all .4s;position:absolute;inset:0;transform:scale(0)}.skin-tool-btn:hover{transform:translateY(-2px)scale(1.05);box-shadow:0 8px 20px -4px #0000004d}.skin-tool-btn:hover:after{opacity:1;transform:scale(1.5)}.skin-tool-btn:active{transform:translateY(0)scale(.95)}.skin-tool-btn-active{box-shadow:0 0 20px var(--skin-glow-purple),inset 0 1px 0 #ffffff4d;background:linear-gradient(135deg,var(--skin-primary),var(--skin-secondary))!important}.skin-color-btn{transform-style:preserve-3d;transition:all .2s cubic-bezier(.34,1.56,.64,1);position:relative}.skin-color-btn:before{content:"";border-radius:inherit;background:inherit;opacity:0;filter:blur(8px);z-index:-1;transition:opacity .3s;position:absolute;inset:-3px}.skin-color-btn:hover{z-index:10;transform:scale(1.3)translateY(-4px)rotateX(10deg)}.skin-color-btn:hover:before{opacity:.6}.skin-color-btn-selected{transform:scale(1.2);box-shadow:0 0 0 3px #fff,0 0 0 5px,0 8px 20px -4px #0006}.skin-color-btn-selected:before{opacity:.8}.skin-color-grid{gap:6px;display:grid}.skin-color-grid .skin-color-btn{transition-delay:calc(var(--index,0)*20ms)}.skin-canvas-container{transform-style:preserve-3d;transition:all .4s cubic-bezier(.16,1,.3,1);position:relative}.skin-canvas-container:before{content:"";background:radial-gradient(ellipse at 30% 30%,var(--skin-glow-purple)0%,transparent 50%),radial-gradient(ellipse at 70% 70%,var(--skin-glow-cyan)0%,transparent 50%);opacity:.3;filter:blur(40px);z-index:-1;pointer-events:none;transition:opacity .4s;position:absolute;inset:-20px}.skin-canvas-container:hover:before{opacity:.5}.skin-canvas-wrapper{border-radius:16px;transition:all .3s;position:relative;overflow:hidden;box-shadow:0 20px 60px -15px #0006,inset 0 1px #ffffff1a}.skin-canvas-wrapper:hover{box-shadow:0 25px 70px -15px #00000080,inset 0 1px 0 #ffffff26,0 0 40px var(--skin-glow-purple)}.skin-grid-overlay{pointer-events:none;opacity:.3;background-image:linear-gradient(#ffffff1a 1px,#0000 1px),linear-gradient(90deg,#ffffff1a 1px,#0000 1px);transition:opacity .3s;position:absolute;inset:0}.skin-canvas-wrapper:hover .skin-grid-overlay{opacity:.5}.skin-preview-3d-container{perspective:1000px;position:relative}.skin-preview-3d-container:before{content:"";background:conic-gradient(from 0deg at 50% 50%,var(--skin-glow-purple)0deg,var(--skin-glow-cyan)120deg,var(--skin-glow-pink)240deg,var(--skin-glow-purple)360deg);opacity:0;filter:blur(60px);z-index:-1;transition:opacity .5s;animation:8s linear infinite rotate-glow;position:absolute;inset:-30px}.skin-preview-3d-container:hover:before{opacity:.4}@keyframes rotate-glow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.skin-layer-item{transform-origin:0;transition:all .3s cubic-bezier(.16,1,.3,1);position:relative}.skin-layer-item:before{content:"";background:linear-gradient(180deg,var(--skin-primary),var(--skin-secondary));border-radius:2px;width:4px;height:0;transition:height .3s;position:absolute;top:50%;left:0;transform:translateY(-50%)}.skin-layer-item:hover{background:#ffffff0d;transform:translate(8px)}.skin-layer-item:hover:before{height:60%}.skin-layer-item-active{background:linear-gradient(90deg,#8b5cf633 0%,#0000 100%)!important}.skin-layer-item-active:before{height:80%!important}.skin-slider-premium{appearance:none;background:#ffffff1a;border-radius:3px;outline:none;height:6px;transition:all .2s}.skin-slider-premium:hover{background:#ffffff26}.skin-slider-premium::-webkit-slider-thumb{appearance:none;background:linear-gradient(135deg,var(--skin-primary),var(--skin-secondary));cursor:pointer;width:18px;height:18px;box-shadow:0 2px 10px var(--skin-glow-purple);border-radius:50%;transition:all .2s}.skin-slider-premium::-webkit-slider-thumb:hover{box-shadow:0 4px 15px var(--skin-glow-purple);transform:scale(1.2)}.skin-modal-overlay{animation:.3s forwards fadeIn}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.skin-modal-content{animation:.4s cubic-bezier(.34,1.56,.64,1) forwards modalSlideIn}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.9)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.skin-panel-slide{animation:.4s cubic-bezier(.16,1,.3,1) forwards panelSlide}@keyframes panelSlide{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.skin-tooltip{position:relative}.skin-tooltip:after{content:attr(data-tooltip);color:#fff;white-space:nowrap;opacity:0;pointer-events:none;z-index:100;background:#000000e6;border-radius:8px;padding:8px 12px;font-size:12px;font-weight:500;transition:all .2s cubic-bezier(.34,1.56,.64,1);position:absolute;bottom:100%;left:50%;transform:translate(-50%)translateY(-8px)scale(.8);box-shadow:0 4px 20px #0000004d}.skin-tooltip:hover:after{opacity:1;transform:translate(-50%)translateY(-8px)scale(1)}@keyframes float-slow{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-10px)rotate(2deg)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 20px var(--skin-glow-purple)}50%{box-shadow:0 0 40px var(--skin-glow-purple),0 0 60px var(--skin-glow-cyan)}}.skin-float{animation:4s ease-in-out infinite float-slow}.skin-pulse-glow{animation:2s ease-in-out infinite pulse-glow}.skin-download-btn{background:linear-gradient(135deg,#10b981 0%,#059669 100%);transition:all .4s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden}.skin-download-btn:before{content:"";background:linear-gradient(45deg,#0000 30%,#ffffff4d 50%,#0000 70%);width:200%;height:200%;transition:transform .6s;position:absolute;top:-50%;left:-50%;transform:rotate(45deg)translateY(-100%)}.skin-download-btn:hover{transform:translateY(-4px)scale(1.02);box-shadow:0 15px 40px -10px #10b98180,0 0 30px #10b9814d}.skin-download-btn:hover:before{transform:rotate(45deg)translateY(100%)}.skin-download-btn:active{transform:translateY(-2px)scale(.98)}.skin-template-btn{transform-style:preserve-3d;transition:all .3s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}.skin-template-btn:before{content:"";opacity:0;background:linear-gradient(135deg,#fff3 0%,#0000 60%);transition:opacity .3s;position:absolute;inset:0}.skin-template-btn:hover{transform:translateY(-3px)scale(1.05)rotateX(5deg);box-shadow:0 10px 25px -5px #0000004d,0 0 20px #8b5cf633}.skin-template-btn:hover:before{opacity:1}.skin-template-btn:active{transform:translateY(0)scale(.95)}.skin-ai-panel{background:linear-gradient(135deg,#8b5cf61a 0%,#ec48990d 100%);border:1px solid #8b5cf633;box-shadow:0 20px 60px -20px #8b5cf64d,inset 0 1px #ffffff1a}.skin-ai-input{background:#0000004d;border:2px solid #8b5cf64d;transition:all .3s}.skin-ai-input:focus{border-color:var(--skin-primary);box-shadow:0 0 0 4px #8b5cf61a,0 0 20px #8b5cf633}.skin-ai-generate-btn{background:linear-gradient(135deg,var(--skin-primary),var(--skin-secondary));position:relative;overflow:hidden}.skin-ai-generate-btn:after{content:"";opacity:0;background:radial-gradient(circle at 20%,#ffffff4d 0%,#0000 50%),radial-gradient(circle at 80%,#fff3 0%,#0000 50%);transition:opacity .3s;position:absolute;inset:0}.skin-ai-generate-btn:hover:after{opacity:1;animation:1s infinite sparkle-move}@keyframes sparkle-move{0%,to{background-position:0%,100%}50%{background-position:100%,0%}}.skin-achievement-toast{background:linear-gradient(135deg,#f59e0bf2 0%,#d97706f2 100%);animation:.5s cubic-bezier(.34,1.56,.64,1) forwards achievementPop;box-shadow:0 10px 40px -10px #f59e0b80,0 0 30px #f59e0b4d}@keyframes achievementPop{0%{opacity:0;transform:translateY(20px)scale(.8)}50%{transform:translateY(-10px)scale(1.05)}to{opacity:1;transform:translateY(0)scale(1)}}.skin-celebration{position:relative}.skin-celebration:before,.skin-celebration:after{content:"🎉";font-size:24px;animation:.6s infinite alternate celebration-bounce;position:absolute}.skin-celebration:before{top:50%;left:-30px;transform:translateY(-50%)}.skin-celebration:after{animation-delay:.3s;top:50%;right:-30px;transform:translateY(-50%)}@keyframes celebration-bounce{0%{transform:translateY(-50%)scale(1)}to{transform:translateY(-50%)scale(1.2)}}@media (max-width:768px){.skin-glass-card:hover{transform:translateY(-2px)}.skin-btn-premium:hover{transform:translateY(-2px)scale(1.01)}.skin-color-btn:hover{transform:scale(1.2)translateY(-2px)}.skin-template-btn:hover{transform:translateY(-2px)scale(1.02)}}@media (prefers-reduced-motion:reduce){.skin-animate-in,.skin-animate-in-scale,.skin-animate-in-left,.skin-animate-in-right,.skin-animate-reveal,.skin-float,.skin-pulse-glow{opacity:1!important;animation:none!important;transform:none!important}.skin-preview-3d-container:before{animation:none!important}.skin-btn-premium:hover,.skin-tool-btn:hover,.skin-color-btn:hover,.skin-template-btn:hover,.skin-download-btn:hover{transform:none!important}}.skin-loading{position:relative;overflow:hidden}.skin-loading:after{content:"";background:linear-gradient(90deg,#0000 0%,#ffffff1a 50%,#0000 100%);animation:1.5s infinite loading-shimmer;position:absolute;inset:0}@keyframes loading-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.skin-skeleton{background:linear-gradient(90deg,#ffffff0d 0%,#ffffff1a 50%,#ffffff0d 100%) 0 0/200% 100%;border-radius:8px;animation:1.5s ease-in-out infinite skeleton-pulse}@keyframes skeleton-pulse{0%{background-position:200% 0}to{background-position:-200% 0}}.skin-focus-ring:focus-visible{box-shadow:0 0 0 3px var(--skin-primary),0 0 20px var(--skin-glow-purple);outline:none}.skin-scrollbar::-webkit-scrollbar{width:6px;height:6px}.skin-scrollbar::-webkit-scrollbar-track{background:#ffffff0d;border-radius:3px}.skin-scrollbar::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--skin-primary),var(--skin-secondary));border-radius:3px;transition:background .3s}.skin-scrollbar::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--skin-primary-light),var(--skin-secondary))}@keyframes marching-ants{0%{stroke-dashoffset:0}to{stroke-dashoffset:-8px}}.selection-marching-ants{animation:.4s linear infinite marching-ants}@keyframes paste-pulse{0%,to{opacity:.7;box-shadow:0 0 8px #00ff0080}50%{opacity:.9;box-shadow:0 0 16px #0f0c}}.paste-preview-pulse{animation:1s ease-in-out infinite paste-pulse}.skin-mobile-toolbar{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:100;background:#fffffff2;border-radius:24px;gap:8px;padding:12px 16px;display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #00000026,0 0 0 1px #ffffff4d}.skin-mobile-toolbar-btn{-webkit-tap-highlight-color:transparent;background:linear-gradient(145deg,#f0f0f0,#fff);border:none;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:24px;transition:all .2s;display:flex;box-shadow:2px 2px 6px #0000001a,-2px -2px 6px #fffc}.skin-mobile-toolbar-btn:active{transform:scale(.95);box-shadow:1px 1px 3px #0000001a,-1px -1px 3px #fffc}.skin-mobile-toolbar-btn.active{background:linear-gradient(145deg,var(--skin-primary),var(--skin-primary-light));color:#fff;box-shadow:0 4px 15px var(--skin-glow-purple),inset 0 1px 0 #fff3}.skin-mobile-colors{background:#fff;border-radius:16px;grid-template-columns:repeat(6,1fr);gap:8px;padding:12px;display:grid;box-shadow:0 4px 20px #0000001a}.skin-mobile-color-btn{-webkit-tap-highlight-color:transparent;border:3px solid #0000;border-radius:12px;width:44px;height:44px;transition:all .2s}.skin-mobile-color-btn:active{transform:scale(.9)}.skin-mobile-color-btn.selected{border-color:var(--skin-primary);transform:scale(1.1);box-shadow:0 0 0 3px #8b5cf64d}.skin-mobile-canvas-container{touch-action:none;background:#1a1a2e;border-radius:16px;padding:8px;overflow:hidden}@media (max-width:768px){.skin-desktop-only{display:none!important}.skin-mobile-only{display:flex!important}.skin-tool-btn{min-width:44px;min-height:44px;font-size:20px}.skin-toolbar-mobile{background:#ffffffe6;border-radius:12px;flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:8px;padding:8px;display:flex}.skin-toolbar-mobile button{border-radius:10px;padding:10px 12px;font-size:18px}.skin-canvas-mobile{touch-action:none;max-width:100%}.skin-color-grid-mobile{grid-template-columns:repeat(8,1fr);gap:6px;padding:8px;display:grid}.skin-color-grid-mobile button{aspect-ratio:1;border-radius:8px;width:100%;min-height:36px}.skin-editor-layout{flex-direction:column!important}.skin-preview-mobile{max-width:150px;margin:0 auto 16px}.skin-secondary-controls{display:none}.skin-expandable-panel{z-index:90;background:#fff;border-radius:16px;padding:16px;transition:transform .3s;position:fixed;bottom:80px;left:8px;right:8px;transform:translateY(100%);box-shadow:0 -4px 20px #00000026}.skin-expandable-panel.open{transform:translateY(0)}button,a{-webkit-tap-highlight-color:transparent}input,select,textarea{font-size:16px!important}.skin-fab{background:linear-gradient(145deg,var(--skin-primary),var(--skin-secondary));color:#fff;width:56px;height:56px;box-shadow:0 4px 20px var(--skin-glow-purple);z-index:100;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:24px;display:flex;position:fixed;bottom:20px;right:20px}.skin-fab:active{transform:scale(.95)}}@media (max-width:480px){.skin-mobile-toolbar{gap:6px;padding:8px 12px;bottom:12px}.skin-mobile-toolbar-btn{width:42px;height:42px;font-size:20px}.skin-mobile-colors{grid-template-columns:repeat(8,1fr);gap:4px}.skin-mobile-color-btn{border-radius:8px;width:36px;height:36px}.skin-canvas-phone{border-radius:0;width:100vw;margin:0 -8px}}@media (max-width:768px) and (orientation:landscape){.skin-editor-layout{flex-direction:row!important}.skin-mobile-toolbar{flex-direction:column;padding:12px 8px;bottom:50%;left:auto;right:12px;transform:translateY(50%)}.skin-preview-mobile{max-width:120px;position:sticky;top:8px}}@supports (padding-bottom:env(safe-area-inset-bottom)){.skin-mobile-toolbar{padding-bottom:calc(12px + env(safe-area-inset-bottom))}}@keyframes touch-ripple{0%{opacity:.5;transform:scale(0)}to{opacity:0;transform:scale(2)}}.skin-touch-ripple{border-radius:inherit;pointer-events:none;background:#ffffff4d;width:100%;height:100%;animation:.4s ease-out touch-ripple;position:absolute}@media (orientation:landscape) and (max-height:600px){.min-h-screen{min-height:auto;padding-top:1rem!important;padding-bottom:1rem!important}.skin-main-layout{gap:1rem;flex-direction:row!important}.skin-header{margin-bottom:.5rem}.skin-header h1{font-size:1.5rem!important}.skin-header p{display:none}.skin-editor-container{align-items:flex-start;flex-direction:row!important}.skin-3d-preview{width:auto;max-height:200px}.skin-mobile-toolbar{gap:.5rem;padding:.5rem}.skin-mobile-toolbar button{padding:.5rem;font-size:.875rem}}@media (orientation:landscape) and (min-width:1024px){.skin-main-layout{justify-content:center;gap:2rem;flex-direction:row!important}}@media (max-width:480px){.skin-mobile-toolbar{gap:10px;padding:14px 20px;bottom:16px}.skin-mobile-toolbar-btn{width:52px;height:52px;font-size:26px}.skin-mobile-colors{grid-template-columns:repeat(5,1fr);gap:10px}.skin-mobile-color-btn{width:52px;height:52px}}.skin-mobile-3d-preview-modal{z-index:200;background:#000000e6;flex-direction:column;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.skin-mobile-3d-preview-modal canvas{border-radius:16px;box-shadow:0 20px 60px #8b5cf666;max-width:100%!important;max-height:70vh!important}.skin-mobile-toolbar-btn:active:after{content:"";background:#8b5cf633;border-radius:50%;animation:.3s ease-out haptic-pulse;position:absolute;inset:-4px}@keyframes haptic-pulse{0%{opacity:1;transform:scale(.8)}to{opacity:0;transform:scale(1.5)}}@media (max-height:700px) and (orientation:portrait){.skin-mobile-toolbar{bottom:12px}}.skin-brush-size-indicator{background:var(--skin-primary);color:#fff;white-space:nowrap;pointer-events:none;border-radius:12px;padding:4px 12px;font-size:12px;font-weight:700;animation:.2s fadeInUp;position:absolute;top:-30px;left:50%;transform:translate(-50%)}.skin-swipe-hint{color:#fff;background:#000000b3;border-radius:20px;align-items:center;gap:8px;padding:8px 16px;font-size:13px;animation:.3s fadeInUp,2s infinite pulse;display:flex;position:fixed;bottom:100px;left:50%;transform:translate(-50%)}.skin-swipe-hint:before{content:"👆";animation:1.5s infinite swipe-motion}@keyframes swipe-motion{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}