:root{--color-bg-primary: #f7fafc;--color-bg-secondary: #e2e8f0;--color-bg-tertiary: #cbd5e0;--color-bg-dark: #23272f;--color-bg-dark-secondary: #2d3748;--color-bg-dark-tertiary: #444b58;--color-bg-dark-hover: #5a6270;--color-bg-dark-hover-alt: #718096;--color-accent-primary: #6c5ce7;--color-accent-hover: #8e7ff7;--color-accent-dark: #4a5568;--scrollbar-width: 8px;--scrollbar-width-small: 7px;--scrollbar-radius: 8px;--scrollbar-radius-small: 4px;--scrollbar-radius-tiny: 3px;--layout-height-full: 100%;--layout-height-viewport: 100vh;--layout-width-viewport: 100vw}*,*:before,*:after{box-sizing:border-box}html{height:var(--layout-height-full);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-overflow-scrolling:touch}body{height:var(--layout-height-full);margin:0;padding:0;overflow-x:hidden;overflow-y:hidden}#root{min-height:var(--layout-height-viewport);width:var(--layout-width-viewport);overflow:hidden;contain:layout style paint}.react-colorful{width:190px!important;height:135px!important;min-width:0!important;min-height:0!important;border-radius:0!important;will-change:transform}.react-colorful__saturation{border-radius:6px 6px 0 0!important}.react-colorful__hue{height:16px!important;border-radius:0 0 6px 6px!important}.react-colorful__hue-pointer{width:15px!important;height:30px!important;border-radius:7px!important;transition:transform .1s ease}body:not(.dark-mode){scrollbar-width:thin;scrollbar-color:var(--color-bg-secondary) var(--color-bg-primary)}body:not(.dark-mode) ::-webkit-scrollbar{width:var(--scrollbar-width);background:var(--color-bg-primary)}body:not(.dark-mode) ::-webkit-scrollbar-thumb{background:var(--color-bg-secondary);border-radius:var(--scrollbar-radius);transition:background-color .2s ease}body:not(.dark-mode) ::-webkit-scrollbar-thumb:hover{background:var(--color-bg-tertiary)}body.dark-mode{scrollbar-width:thin;scrollbar-color:var(--color-bg-dark-tertiary) var(--color-bg-dark)}body.dark-mode ::-webkit-scrollbar{width:var(--scrollbar-width);background:var(--color-bg-dark)}body.dark-mode ::-webkit-scrollbar-thumb{background:var(--color-bg-dark-tertiary);border-radius:var(--scrollbar-radius);transition:background-color .2s ease}body.dark-mode ::-webkit-scrollbar-thumb:hover{background:var(--color-bg-dark-hover)}.custom-scrollbar{scrollbar-width:thin;scrollbar-color:var(--color-accent-dark) transparent}.custom-scrollbar::-webkit-scrollbar{width:var(--scrollbar-width-small);background:transparent!important}.custom-scrollbar::-webkit-scrollbar-track{background:transparent!important}.custom-scrollbar::-webkit-scrollbar-thumb{background:var(--color-accent-primary);border-radius:var(--scrollbar-radius-tiny);transition:background-color .2s ease}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--color-accent-hover)}.light-scrollbar{scrollbar-width:thin;scrollbar-color:var(--color-bg-secondary) var(--color-bg-primary)}.light-scrollbar::-webkit-scrollbar{width:var(--scrollbar-width);background:var(--color-bg-primary)}.light-scrollbar::-webkit-scrollbar-track{background:var(--color-bg-primary)}.light-scrollbar::-webkit-scrollbar-thumb{background:var(--color-bg-secondary);border-radius:var(--scrollbar-radius-small);transition:background-color .2s ease}.light-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--color-bg-tertiary)}.dark-scrollbar{scrollbar-width:thin;scrollbar-color:var(--color-accent-dark) var(--color-bg-dark-secondary)}.dark-scrollbar::-webkit-scrollbar{width:var(--scrollbar-width);background:var(--color-bg-dark-secondary)}.dark-scrollbar::-webkit-scrollbar-track{background:var(--color-bg-dark-secondary)}.dark-scrollbar::-webkit-scrollbar-thumb{background:var(--color-accent-dark);border-radius:var(--scrollbar-radius-small);transition:background-color .2s ease}.dark-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--color-bg-dark-hover-alt)}.custom-scrollbar,.light-scrollbar,.dark-scrollbar{transform:translateZ(0);backface-visibility:hidden;perspective:1000px}::-webkit-scrollbar-thumb{will-change:background-color}@media (prefers-reduced-motion: reduce){.react-colorful__hue-pointer,::-webkit-scrollbar-thumb,.custom-scrollbar::-webkit-scrollbar-thumb,.light-scrollbar::-webkit-scrollbar-thumb,.dark-scrollbar::-webkit-scrollbar-thumb{transition:none}}@media (prefers-contrast: high){:root{--color-bg-secondary: #000;--color-bg-tertiary: #333;--color-bg-dark-tertiary: #fff;--color-bg-dark-hover: #ccc}}@media print{.react-colorful,.custom-scrollbar,.light-scrollbar,.dark-scrollbar{display:none!important}body{overflow:visible!important}}