@supports (-webkit-appearance:none) and (not (-ms-ime-align:auto)){.backdrop-blur-sm{-webkit-backdrop-filter:blur(4px)}input[type=color]{-webkit-appearance:none}}@-moz-document url-prefix(){html{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.2) transparent}button{vertical-align:middle}}@supports (-ms-ime-align:auto){.grid{display:-ms-grid}}@media screen and (-webkit-min-device-pixel-ratio:0){.animate-pulse{-webkit-animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}}*{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter}.color-swatch{color-profile:sRGB;rendering-intent:auto}@media (hover:none) and (pointer:coarse){button{min-height:44px;min-width:44px}.hover\:scale-105:hover{transform:none}}@media print{.no-print{display:none!important}.color-palette{-moz-column-break-inside:avoid;break-inside:avoid}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media (prefers-contrast:high){.border-border{border-color:currentColor}button{border:2px solid}}@media (prefers-color-scheme:dark){.text-muted-foreground{opacity:.8}}@keyframes slideInFromTop{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInFromBottom{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes gentlePulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes colorShift{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(10deg)}}@keyframes successBounce{0%{transform:scale(0);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}.animate-slide-in-top{animation:slideInFromTop .3s ease-out}.animate-slide-in-bottom{animation:slideInFromBottom .3s ease-out}.animate-fade-in{animation:fadeIn .3s ease-out}.animate-scale-in{animation:scaleIn .3s ease-out}.animate-gentle-pulse{animation:gentlePulse 2s ease-in-out infinite}.animate-success{animation:successBounce .4s ease-out}.hover-lift{transition:transform .2s ease-out,box-shadow .2s ease-out}.hover-lift:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.08)}.hover-glow{transition:box-shadow .3s ease-out}.hover-glow:hover{box-shadow:0 0 20px rgba(var(--primary-rgb),.3)}.color-preview-pulse{position:relative}.color-preview-pulse:after{content:"";position:absolute;inset:-2px;border-radius:inherit;background:inherit;opacity:0;animation:pulse-ring 1.5s ease-out}@keyframes pulse-ring{0%{transform:scale(1);opacity:.5}to{transform:scale(1.2);opacity:0}}.color-transition{transition:background-color .3s ease-out,color .3s ease-out,border-color .3s ease-out}.focus-ring{position:relative;outline:none}.focus-ring:focus-visible:before{content:"";position:absolute;inset:-3px;border-radius:inherit;border:2px solid var(--primary);opacity:0;animation:focusRing .2s ease-out forwards}@keyframes focusRing{to{opacity:1}}.copy-success{position:relative}.copy-success:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);color:var(--success);font-weight:700;animation:copySuccess .3s ease-out forwards}@keyframes copySuccess{to{transform:translate(-50%,-50%) scale(1)}}.shimmer{position:relative;overflow:hidden}.shimmer:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:shimmer 2s infinite}.stagger-animation>*{opacity:0;animation:fadeIn .3s ease-out forwards}.stagger-animation>:first-child{animation-delay:.05s}.stagger-animation>:nth-child(2){animation-delay:.1s}.stagger-animation>:nth-child(3){animation-delay:.15s}.stagger-animation>:nth-child(4){animation-delay:.2s}.stagger-animation>:nth-child(5){animation-delay:.25s}.stagger-animation>:nth-child(6){animation-delay:.3s}.stagger-animation>:nth-child(7){animation-delay:.35s}.stagger-animation>:nth-child(8){animation-delay:.4s}.stagger-animation>:nth-child(9){animation-delay:.45s}.stagger-animation>:nth-child(10){animation-delay:.5s}.stagger-animation>:nth-child(11){animation-delay:.55s}.stagger-animation>:nth-child(12){animation-delay:.6s}@keyframes tutorial-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.9}}@keyframes tutorial-highlight{0%,to{box-shadow:0 0 0 0 rgba(59,130,246,.4)}50%{box-shadow:0 0 0 10px rgba(59,130,246,0)}}@keyframes tutorial-float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes tutorial-glow{0%,to{box-shadow:0 0 20px rgba(59,130,246,.5)}50%{box-shadow:0 0 40px rgba(59,130,246,.8)}}.tutorial-card-enter{animation:tutorial-pulse .3s ease-out}.tutorial-highlight-element{animation:tutorial-highlight 2s infinite}.tutorial-floating{animation:tutorial-float 3s ease-in-out infinite}.tutorial-glow{animation:tutorial-glow 2s ease-in-out infinite}.tutorial-backdrop{backdrop-filter:blur(4px);background:radial-gradient(circle at center,rgba(0,0,0,.4) 0,rgba(0,0,0,.7) 100%)}.tutorial-step-indicator{position:relative;overflow:hidden}.tutorial-step-indicator:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:shimmer 2s infinite}@keyframes shimmer{0%{left:-100%}to{left:100%}}.tutorial-tip-arrow{position:absolute;width:0;height:0;border-style:solid}.tutorial-tip-arrow.top{bottom:-10px;left:50%;transform:translateX(-50%);border-width:10px 10px 0;border-color:var(--border) transparent transparent transparent}.tutorial-tip-arrow.bottom{top:-10px;left:50%;transform:translateX(-50%);border-width:0 10px 10px;border-color:transparent transparent var(--border) transparent}.tutorial-tip-arrow.left{right:-10px;top:50%;transform:translateY(-50%);border-width:10px 0 10px 10px;border-color:transparent transparent transparent var(--border)}.tutorial-tip-arrow.right{left:-10px;top:50%;transform:translateY(-50%);border-width:10px 10px 10px 0;border-color:transparent var(--border) transparent transparent}