.color-family-page-container{max-width:1200px;margin:10px auto 15px;padding:20px;background-color:#fff;width:100%}.updating-components{margin-top:20px}.changing-recipe{height:400px;width:100%;justify-content:center;align-items:center;display:flex;font-size:50px}.color-family-description{margin-bottom:40px}.color-family-description h2{color:#4c0070;font-size:2rem;margin-bottom:10px;font-weight:600}.color-family-description p{color:#666;font-size:1.1rem;margin-bottom:20px}.color-gradient-bar{height:10px;width:100%;border-radius:5px;border:1px solid grey}.color-family-list h3{color:#666;font-size:1.5rem;margin-bottom:20px;font-weight:500}.family-colors-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.family-color-box{height:120px;width:100%;max-width:250px;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:5px;transition:transform .3s ease;color:#fff;font-size:.9rem;border:1px solid gray}.family-color-box:hover{transform:scale(1.02)}.shade-name{font:bold;margin-bottom:5px;mix-blend-mode:difference}.shade-hex,.shade-rgb{font-size:.9rem}.hex-rgb{display:flex;flex-direction:column;align-items:center;justify-content:center;height:80px;width:100%;max-width:240px;border-top-left-radius:50px;border-top-right-radius:50px;background-color:#fff;border:1px solid gray;color:#666}.shade-hex,.shade-rgb{font-weight:700;text-align:center}.family-color-box[style*="background-color: #ffffff"],.family-color-box[style*="background-color: #ffdab9"],.family-color-box[style*="background-color: #ffff00"],.family-color-box[style*="background-color: #d2b48c"],.family-color-box[style*="background-color: #ffd700"],.family-color-box[style*="background-color: #c0c0c0"],.family-color-box[style*="background-color: #f5f5dc"],.family-color-box[style*="background-color: #ee82ee"],.family-color-box[style*="background-color: #40e0d0"]{color:#4c0070;text-shadow:none}.back-button{display:block;margin:20px auto 0;background-color:gray;border:none;padding:10px 20px;border-radius:10px;font-size:1rem;color:#fff;cursor:pointer;transition:background-color .5s ease}.back-button:hover{background-color:#ff8c5a}@media (max-width: 1024px){.family-colors-grid{grid-template-columns:repeat(3,1fr);gap:15px}.family-color-box{max-width:100%;height:110px}.hex-rgb{max-width:100%;height:70px}}@media (max-width: 768px){.family-colors-grid{grid-template-columns:repeat(2,1fr);gap:10px}.family-color-box{height:100px}.hex-rgb{height:60px}}@media (max-width: 480px){.family-colors-grid{grid-template-columns:1fr;gap:10px}.family-color-box{height:100px;max-width:none}.hex-rgb{height:55px;max-width:none}}@media (max-width: 360px){.family-color-box{height:80px}.hex-rgb{height:50px}}.navbar{background-color:#fdd5b1;padding:15px 20px;box-shadow:0 2px 5px #0000001a;position:sticky;top:0;z-index:1000;width:100%}.navbar.scrolled{background-color:#fdd5b1;box-shadow:0 4px 10px #00000026}.navbar-container{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center}.navbar-logo .nav-logo-image{height:65px;width:auto;transition:transform .3s ease}.navbar-logo:hover .nav-logo-image{transform:scale(1.05)}.navbar-menu{display:flex;list-style:none;margin:0;padding:0;align-items:center;gap:20px}.navbar-item{position:relative}.navbar-link{text-decoration:none;color:#333;font-weight:500;font-size:1.3rem;padding:8px 12px;border-radius:4px;transition:all .3s ease;display:block}.navbar-link:hover{color:#8a2be2;background-color:#ff8c5a;border-radius:50px}.navbar-link.active{color:#8a2be2;font-weight:600}.navbar-item.dropdown{position:relative;cursor:pointer}@media (min-width: 769px){.hover-dropdown:hover .dropdown-menu{display:block;opacity:1;visibility:visible;transform:translateY(0)}}.dropdown-menu{position:absolute;top:100%;left:0;min-width:200px;background:#fdd5b1;border-radius:20px;padding:10px 0;margin:0;list-style:none;display:none;opacity:0;visibility:hidden;transform:translateY(10px);transition:all .3s ease;z-index:1000}.dropdown-item{display:block;padding:8px 20px;color:#000;text-decoration:none;transition:all .2s ease}.dropdown-item:hover{background:#ff8c5a;border-radius:25px;color:#000}.navbar-link.no-pointer{cursor:pointer}.navbar-toggle{display:none;flex-direction:column;cursor:pointer;z-index:1001;padding:10px}.bar{width:25px;height:3px;background-color:#4c0070;margin:3px 0;transition:all .3s ease;border-radius:3px}.navbar-toggle.active .bar:nth-child(1){transform:translateY(8px) rotate(45deg)}.navbar-toggle.active .bar:nth-child(2){opacity:0}.navbar-toggle.active .bar:nth-child(3){transform:translateY(-8px) rotate(-45deg)}@media (max-width: 768px){.navbar{padding:10px 15px}.navbar-logo .nav-logo-image{height:50px}.navbar-toggle{display:flex}.navbar-menu{display:flex;flex-direction:column;position:fixed;top:0;right:-100%;width:70%;max-width:300px;height:100vh;background-color:#fdd5b1;padding:80px 20px 20px;box-shadow:-5px 0 15px #0000001a;z-index:998;transition:right .3s ease-out;gap:8px}.navbar-menu.active{right:0}.navbar-item{margin:2px 0;text-align:left;width:100%}.navbar-link{padding:12px 15px;font-size:1.2rem;border-radius:6px}.navbar-item.dropdown .dropdown-menu{position:static;display:none;opacity:1;visibility:visible;transform:translateY(0);background:#ffe6cc;border-radius:10px;padding:5px 0;margin:5px 0 5px 15px;width:calc(100% - 15px);box-shadow:none;transition:none}.navbar-item.dropdown.active .dropdown-menu{display:block}.dropdown-item{padding:8px 15px;font-size:1.1rem}.navbar-menu.active:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:-1;opacity:1;transition:opacity .3s ease}.navbar-menu:not(.active):before{opacity:0}}@media (max-width: 480px){.navbar{height:90px}.navbar-logo .nav-logo-image{height:60px}.navbar-menu{width:80%;max-width:250px;padding-top:70px;gap:6px}.navbar-link{font-size:1.1rem;padding:10px 12px}.dropdown-item{padding:6px 12px;font-size:1rem}.navbar-item.dropdown .dropdown-menu{margin:4px 0 4px 10px;width:calc(100% - 10px)}.bar{width:22px;height:2.5px}}@media (max-width: 360px){.navbar-logo .nav-logo-image{height:35px}.navbar-menu{width:85%;max-width:200px;padding-top:60px}.navbar-link{font-size:1rem;padding:8px 10px}.dropdown-item{padding:5px 10px;font-size:.9rem}.navbar-item.dropdown .dropdown-menu{margin:3px 0 3px 8px;width:calc(100% - 8px)}.bar{width:20px;height:2px}}.color-picker{width:100%;display:flex;align-items:center;justify-content:center}.color-preview-box{width:100%;height:315px;position:relative;border:1px solid #ddd;border-radius:5px;box-shadow:0 2px 5px #0000001a;cursor:pointer}.color-input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;border:none;padding:0}.pick-color-h3{display:flex;align-items:center;justify-content:center;font-size:25px}@media (max-width: 1024px){.color-preview-box{height:280px}.pick-color-h3{font-size:22px}}@media (max-width: 768px){.color-preview-box{height:250px}.pick-color-h3{font-size:20px}}@media (max-width: 480px){.color-preview-box{height:220px;width:350px;justify-content:center;align-items:center;display:flex;border-radius:4px}.pick-color-h3{font-size:18px}}@media (max-width: 375px){.color-preview-box{height:200px;width:300px}.pick-color-h3{font-size:17px}}@media (max-width: 320px){.color-preview-box{height:180px;width:270px}.pick-color-h3{font-size:16px}}@media (max-height: 480px) and (orientation: landscape){.color-preview-box{height:150px}.pick-color-h3{font-size:16px;margin:10px 0}}@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait){.color-preview-box{height:300px}}.color-info{flex:1;margin-top:0}.color-details{font-size:1rem;color:#4c0070}.color-details p{margin:5px 0;display:flex;align-items:center}.hex-rgb-hsl-strong{font-size:18px}.color-details strong{margin-right:5px}.copy-icon{margin-left:8px;cursor:pointer;position:relative;display:inline-flex;align-items:center;color:#4c0070;transition:color .3s ease}.copy-icon:hover{color:#8a2be2}.copy-icon svg{font-size:1rem}.copied-text{margin-left:5px;font-size:.8rem;color:green;position:absolute;left:20px;background-color:#fff;padding:2px 5px;border-radius:3px;box-shadow:0 1px 3px #0000001a}@media (max-width: 1024px){.color-info{flex:1 1 60%}.hex-rgb-hsl-strong{font-size:16px}.color-details{font-size:.95rem}}@media (max-width: 768px){.color-info{flex:1 1 100%;margin-top:15px}.color-details p{flex-wrap:wrap}.copy-icon{margin-left:5px}.copied-text{position:static;margin-left:8px;display:inline-block}}@media (max-width: 480px){.hex-rgb-hsl-strong{font-size:15px}.color-details{font-size:.9rem}.copy-icon svg{font-size:.9rem}.copied-text{font-size:.7rem;padding:1px 4px}}@media (max-width: 375px){.hex-rgb-hsl-strong{font-size:14px}.color-details{font-size:.85rem}.color-details p{margin:3px 0}.copy-icon{margin-left:3px}}@media (max-width: 320px){.hex-rgb-hsl-strong{font-size:13px}.color-details{font-size:.8rem}.copied-text{font-size:.65rem}}@media (max-height: 480px) and (orientation: landscape){.color-info{margin-top:5px}.color-details p{margin:2px 0}}@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait){.color-info{flex:1 1 70%}}@media (min-width: 2000px){.hex-rgb-hsl-strong{font-size:20px}.color-details{font-size:1.1rem}.copy-icon svg{font-size:1.1rem}.copied-text{font-size:.9rem;padding:3px 6px}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.color-details,.hex-rgb-hsl-strong{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}}@media print{.color-info{break-inside:avoid}.copy-icon,.copied-text{display:none}.color-details,.hex-rgb-hsl-strong{color:#000!important}}._homeContainer_jjmnr_2{max-width:1250px;margin:0 auto;padding:20px;background-color:#fff;width:100%;box-sizing:border-box}._title_jjmnr_12{text-align:center;color:#4c0070;font-size:2.5rem;margin-bottom:20px;font-weight:600}._colorTools_jjmnr_21{margin:20px 0}._colorPickerContainer_jjmnr_25{display:flex;gap:20px;align-items:stretch;justify-content:center}._colorPickerBox_jjmnr_32{flex:0 0 30%;min-width:200px;background-color:#fff;padding:20px;border-radius:10px;box-shadow:0 2px 5px #0000001a}._colorInfoBox_jjmnr_41{flex:1;background-color:#fff;padding:20px;border-radius:10px;box-shadow:0 2px 5px #0000001a;display:flex;flex-direction:column;gap:15px}._colorPickerDescription_jjmnr_52 h3{color:#4c0070;font-size:1.3rem;margin-bottom:10px;text-align:center}._colorPickerDescription_jjmnr_52 p{color:#666;font-size:1rem;margin:0;text-align:left;line-height:1.5}._colorToolDivider_jjmnr_68{margin:25px auto;border:0;border-top:1px solid #ccc;width:90%}._colorCardsSection_jjmnr_76 h2{color:#4c0070;font-size:1.8rem;margin-bottom:25px;text-align:center}._colorGrid_jjmnr_83{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;justify-items:center}._colorCard_jjmnr_76{width:100%;max-width:220px;height:200px;display:flex;flex-direction:column;border-radius:10px;box-shadow:0 2px 5px #0000001a;transition:transform .3s ease,box-shadow .3s ease;background-color:#fff;overflow:hidden;border:1px solid grey}._colorCard_jjmnr_76:hover{transform:translateY(-5px);box-shadow:0 4px 15px #0003}._colorHeader_jjmnr_111{border-bottom:1px solid grey;width:100%;height:120px;display:flex;align-items:center;justify-content:center;border-top-left-radius:10px;border-top-right-radius:10px}._colorName_jjmnr_122{color:#fff;font-weight:500;font-size:1.2rem;text-align:center;padding:10px;text-shadow:1px 1px 2px rgba(0,0,0,.5);width:100%}._colorButtons_jjmnr_132{flex:1;display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center;padding:10px}._colorListBtn_jjmnr_142,._colorChartBtn_jjmnr_143{background-color:#f0f0f0;border:none;padding:6px 12px;border-radius:6px;font-size:.9rem;cursor:pointer;color:#4c0070;transition:background-color .3s ease;width:80%;text-align:center;border:1px solid grey}._colorListBtn_jjmnr_142:hover,._colorChartBtn_jjmnr_143:hover{background-color:#ff8c5a;color:#fff}._colorHeader_jjmnr_111[style*="background-color: #ffffff"],._colorHeader_jjmnr_111[style*="background-color: #ffdab9"],._colorHeader_jjmnr_111[style*="background-color: #ffff00"],._colorHeader_jjmnr_111[style*="background-color: #d2b48c"],._colorHeader_jjmnr_111[style*="background-color: #ffd700"],._colorHeader_jjmnr_111[style*="background-color: #c0c0c0"],._colorHeader_jjmnr_111[style*="background-color: #00ffff"],._colorHeader_jjmnr_111[style*="background-color: #ffc0cb"]{color:#4c0070;text-shadow:none}@media (max-width: 1200px){._homeContainer_jjmnr_2{max-width:1000px;padding:15px}._colorPickerBox_jjmnr_32{flex:0 0 35%}._colorGrid_jjmnr_83{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:15px}._colorCard_jjmnr_76{max-width:200px;height:180px}._colorHeader_jjmnr_111{height:100px}._colorName_jjmnr_122{font-size:1.1rem}}@media (max-width: 1024px){._homeContainer_jjmnr_2{max-width:900px}._colorPickerBox_jjmnr_32{flex:0 0 40%}._colorGrid_jjmnr_83{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}._colorCard_jjmnr_76{max-width:180px;height:160px}._colorHeader_jjmnr_111{height:90px}._colorName_jjmnr_122{font-size:1rem}}@media (max-width: 768px){._homeContainer_jjmnr_2{padding:10px}._title_jjmnr_12{font-size:2rem}._colorTools_jjmnr_21{margin:15px 0}._colorPickerContainer_jjmnr_25{flex-direction:column;gap:15px}._colorPickerBox_jjmnr_32,._colorInfoBox_jjmnr_41{width:100%;max-width:none;padding:15px}._colorCardsSection_jjmnr_76 h2{font-size:1.5rem}._colorGrid_jjmnr_83{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}._colorCard_jjmnr_76{max-width:160px;height:150px}._colorHeader_jjmnr_111{height:80px}._colorName_jjmnr_122{font-size:.95rem}._colorListBtn_jjmnr_142,._colorChartBtn_jjmnr_143{font-size:.85rem;padding:5px 10px}}@media (max-width: 600px){._title_jjmnr_12{font-size:1.8rem}._colorCardsSection_jjmnr_76 h2{font-size:1.3rem}._colorGrid_jjmnr_83{grid-template-columns:1fr;gap:12px}._colorCard_jjmnr_76{max-width:250px;height:140px;margin:0 auto}._colorHeader_jjmnr_111{height:80px}._colorName_jjmnr_122{font-size:.9rem}._colorListBtn_jjmnr_142,._colorChartBtn_jjmnr_143{font-size:.8rem;padding:4px 8px}._colorToolDivider_jjmnr_68{width:95%}}@media (max-width: 480px){._homeContainer_jjmnr_2{padding:8px}._title_jjmnr_12{font-size:1.6rem}._colorPickerBox_jjmnr_32,._colorInfoBox_jjmnr_41{padding:12px}._colorPickerDescription_jjmnr_52 h3{font-size:1.1rem}._colorPickerDescription_jjmnr_52 p{font-size:.9rem}._colorCardsSection_jjmnr_76 h2{font-size:1.2rem}._colorCard_jjmnr_76{max-width:220px;height:130px}._colorHeader_jjmnr_111{height:70px}._colorName_jjmnr_122{font-size:.85rem}._colorListBtn_jjmnr_142,._colorChartBtn_jjmnr_143{font-size:.75rem}}@media (max-width: 360px){._homeContainer_jjmnr_2{padding:5px}._title_jjmnr_12{font-size:1.4rem}._colorPickerBox_jjmnr_32,._colorInfoBox_jjmnr_41{padding:10px}._colorPickerDescription_jjmnr_52 h3{font-size:1rem}._colorPickerDescription_jjmnr_52 p{font-size:.85rem}._colorCardsSection_jjmnr_76 h2{font-size:1.1rem}._colorCard_jjmnr_76{max-width:200px;height:120px}._colorHeader_jjmnr_111{height:60px}._colorName_jjmnr_122{font-size:.8rem}._colorListBtn_jjmnr_142,._colorChartBtn_jjmnr_143{font-size:.7rem;padding:3px 6px}}.color-desc-container{max-width:1200px;margin:10px auto 0;color:#333;line-height:1.6}.color-desc-header{text-align:center}.color-desc-header h2{font-size:2.5rem;color:#2c3e50;margin-bottom:.5rem}.color-desc-subtitle{font-size:1.2rem;color:#7f8c8d;font-weight:300}.color-desc-section{margin-bottom:3rem;background:#fff;border-radius:12px;overflow:hidden}.desc-header{display:flex;align-items:center;padding:1rem}.desc-header h3{margin:0;font-size:1.5rem;color:#2c3e50}.section-icon{font-size:1.8rem;margin-right:1rem}.section-content{padding:1.5rem}.section-content p{font-size:20px}.theory-concepts{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-top:1.5rem}.concept-card{background:#fff;border:1px solid #FF8C5A;border-radius:10px;padding:1.5rem;display:grid;grid-template-rows:auto 1fr auto;min-height:200px;transition:transform .3s ease;box-shadow:0 2px 8px #0000000d}.color-examples{align-self:end}.concept-card:hover{transform:translateY(-5px)}.concept-card h4{color:#3498db;margin-top:0}.color-examples{display:flex;gap:.5rem;margin-top:1rem}.color-dot{width:30px;height:30px;border-radius:50%;border:1px solid rgba(0,0,0,.1);cursor:pointer;transition:transform .2s ease}.color-dot:hover{transform:scale(1.2)}.tips-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem}.tip-card{border:1px solid #FF8C5A;display:flex;align-items:flex-start;background:#fff;padding:1.5rem;border-radius:8px;box-shadow:0 2px 8px #0000000d}.tip-icon{font-size:1.5rem;margin-right:1rem;color:#e74c3c}.tip-card h4{margin-top:0;margin-bottom:.5rem;color:#2c3e50}.color-codes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;margin-top:1.5rem}.color-code-card{border:1px solid #FF8C5A;display:flex;align-items:center;gap:1rem;padding:.75rem;background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000000d}.color-swatch{width:40px;height:40px;border-radius:6px;border:1px solid rgba(0,0,0,.1);flex-shrink:0}.color-info-grid h4{margin:0 0 .25rem;font-size:1rem;color:#2c3e50}.color-info-grid p{margin:0;font-size:15px;color:#7f8c8d}.schemes-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem}.scheme-card{border:2px solid #FF8C5A;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px #0000000d;transition:transform .3s ease}.scheme-card:hover{transform:translateY(-5px)}.scheme-card h4{padding:1rem 1.5rem 0;margin:0;color:#2c3e50}.scheme-desc{padding:0 1.5rem;color:#7f8c8d;font-size:.9rem}.scheme-colors{display:flex;margin-top:1rem}.scheme-color{flex:1;height:80px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:.5rem;position:relative;transition:flex .3s ease}.color-code{background:#000000b3;color:#fff;padding:.2rem .5rem;border-radius:4px;font-size:.8rem;opacity:0;transition:opacity .3s ease}.scheme-color:hover .color-code{opacity:1}@media (max-width: 768px){.color-desc-header h2{font-size:2rem}.desc-header{flex-direction:column;text-align:center}.section-icon{margin-right:0;margin-bottom:.5rem}}@media (max-width: 479px){hr{margin:.5rem 0;border:1px solid grey}.color-desc-container{padding:0 15px;margin-top:5px}.color-desc-header h2{font-size:1.8rem}.color-desc-subtitle{font-size:1rem}.desc-header h3{font-size:1.3rem}.section-content p{font-size:16px}.theory-concepts,.tips-grid,.color-codes-grid,.schemes-container{grid-template-columns:1fr}.concept-card{min-height:auto}.color-dot{width:25px;height:25px}.color-swatch{width:30px;height:30px}}@media (min-width: 480px) and (max-width: 599px){.color-desc-container{padding:0 20px}hr{width:100%;border:1px solid grey}.theory-concepts,.tips-grid,.color-codes-grid,.schemes-container{grid-template-columns:repeat(2,1fr)}.color-desc-header h2{font-size:2rem}}@media (min-width: 600px) and (max-width: 767px){.color-desc-container{padding:0 25px}.theory-concepts,.tips-grid,.schemes-container{grid-template-columns:repeat(2,1fr)}.color-codes-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width: 768px) and (max-width: 991px){.color-desc-container{padding:0 30px}.theory-concepts,.tips-grid,.schemes-container{grid-template-columns:repeat(3,1fr)}.color-codes-grid{grid-template-columns:repeat(4,1fr)}}@media (min-width: 992px) and (max-width: 1199px){.color-desc-container{padding:0 40px}}@media (min-width: 1200px){.color-desc-container{padding:0 50px}}@media (min-width: 1800px){.color-desc-container{max-width:1400px}.theory-concepts,.tips-grid,.schemes-container{grid-template-columns:repeat(4,1fr)}.color-codes-grid{grid-template-columns:repeat(6,1fr)}}@media (max-height: 700px) and (orientation: portrait){.color-desc-header h2{font-size:1.6rem;margin-bottom:.3rem}.color-desc-subtitle{font-size:.9rem}.section-content{padding:1rem}}@media (max-width: 900px) and (orientation: landscape){.theory-concepts,.tips-grid,.schemes-container{grid-template-columns:repeat(2,1fr)}.color-codes-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width: 2000px){.color-desc-container{max-width:1600px}.color-desc-header h2{font-size:3rem}.color-desc-subtitle{font-size:1.4rem}.desc-header h3{font-size:2rem}.section-content p{font-size:1.2rem}.concept-card,.tip-card,.scheme-card{padding:2rem}}@media (max-width: 600px) and (max-height: 500px){.color-desc-container{padding:0 10px}.theory-concepts,.tips-grid,.color-codes-grid,.schemes-container{grid-template-columns:1fr;gap:.8rem}}@media print{.color-desc-container{padding:0;max-width:100%}.theory-concepts,.tips-grid,.schemes-container{grid-template-columns:repeat(2,1fr)}.color-codes-grid{grid-template-columns:repeat(4,1fr)}.scheme-color:hover .color-code{opacity:1!important}}.color-tools-container{max-width:1200px;margin:25px auto 0}.color-tools-title{font-size:28px;color:#333;margin-bottom:30px;text-transform:uppercase;text-align:center}.color-tools-grid{display:flex;justify-content:center;align-items:stretch;gap:20px;flex-wrap:wrap}.color-tools-card{background-color:#fff;border:1px solid #ddd;border-radius:10px;padding:20px;text-align:center;transition:transform .3s,box-shadow .3s;width:300px;display:flex;flex-direction:column;justify-content:space-between;min-height:200px}.color-tools-card:hover{box-shadow:0 5px 15px #0000001a}.color-tools-card-header{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:15px}.color-tools-icon{font-size:24px;color:#666}.color-tools-card-title{font-size:20px;color:#333;margin:0}.color-tools-card-description{font-size:16px;color:#666;margin-bottom:20px;flex-grow:1}.color-tools-btn{display:block;width:200px;height:40px;line-height:20px;padding:10px 20px;background-color:#6c757d;color:#fff;border-radius:15px;text-decoration:none;transition:background-color .3s;box-sizing:border-box;margin:0 auto}.color-tools-btn:hover{background-color:#ff8c5a}@media (max-width: 1000px){.color-tools-card{width:100%;max-width:300px}.color-tools-grid{flex-direction:column;align-items:center}}@media (max-width: 1000px) and (min-width: 801px){.color-tools-grid{gap:15px}.color-tools-card{width:calc(50% - 20px);max-width:none}}@media (max-width: 800px){.color-tools-container{padding:0 15px}.color-tools-title{font-size:24px;margin-bottom:25px}.color-tools-card{width:calc(50% - 15px);padding:15px}.color-tools-card-title{font-size:18px}.color-tools-card-description{font-size:15px}}@media (max-width: 600px){.color-tools-title{font-size:22px;margin-bottom:20px}.color-tools-grid{gap:15px}.color-tools-card{width:100%;max-width:350px;min-height:180px}.color-tools-btn{width:200px}}@media (max-width: 480px){.color-tools-container{margin-top:15px;padding:10px}.color-tools-title{font-size:20px}.color-tools-card-header{margin-bottom:10px}.color-tools-icon{font-size:20px}.color-tools-card-title{font-size:17px}.color-tools-card-description{font-size:14px;margin-bottom:15px}.color-tools-btn{width:200px;height:36px;font-size:14px}}@media (max-width: 375px){.color-tools-title{font-size:18px}.color-tools-card{padding:12px;min-height:160px}.color-tools-card-title{font-size:16px}.color-tools-card-description{font-size:13px}.color-tools-btn{width:200px;height:34px;padding:8px 15px}}@media (max-width: 320px){.color-tools-container{padding:0 10px;margin-left:-10px;margin-right:10px}.color-tools-card{min-height:150px}.color-tools-btn{width:180px}}@media (max-height: 480px) and (orientation: landscape){.color-tools-container{margin-top:15px}.color-tools-card{min-height:140px;padding:10px}.color-tools-card-description{margin-bottom:10px}}@media (width: 500px) and (height: 766px){.color-tools-container{margin-top:15px;padding:0 12px}.color-tools-title{font-size:22px;margin-bottom:20px}.color-tools-grid{gap:15px}.color-tools-card{width:100%;max-width:400px;min-height:170px;padding:15px}.color-tools-card-header{margin-bottom:12px}.color-tools-icon{font-size:20px}.color-tools-card-title{font-size:18px}.color-tools-card-description{font-size:14px;margin-bottom:15px}.color-tools-btn{width:180px;height:38px;font-size:14px;padding:9px 18px}}@media (min-width: 495px) and (max-width: 505px){.color-tools-container{padding:0 15px}.color-tools-card{width:100%;max-width:420px}}.footer{background-color:#fdd5b1;padding:15px 10px;box-shadow:0 -2px 5px #0000001a;color:#000;position:relative}.footer-content{max-width:1200px;margin:0 auto;position:relative}.footer-top{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.footer-logo{flex-shrink:0}.logo-image{max-width:100px;max-height:100px;object-fit:contain;margin:0 auto;display:block}.footer-description p{color:#000;max-width:800px;text-align:center;margin:15px auto 0 100px}.footer-divider{border:0;border-top:1px solid grey;margin:20px 0}.footer-bottom{text-align:center;margin:20px 0}.website-policies{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}.website-policies a{text-decoration:none;color:#000;padding:0 10px}.website-policies a:hover{color:#8a2be2}.footer-middle{display:flex;justify-content:center;flex-wrap:wrap;gap:20px}.footer-section{flex:1;min-width:200px;text-align:center;color:#000}.quick-links ul{list-style:none;padding:0}.quick-links li{margin:5px 0}.social-icons{display:flex;justify-content:center;gap:20px;flex-wrap:wrap}.social-icon{font-size:30px;margin-bottom:-10px;color:#666;text-decoration:none;transition:transform .3s ease-in-out,color .3s}.social-icon:hover{transform:scale(1.2)}.social-icon.linkedin:hover{color:#0077b5}.social-icon.github:hover{color:#333}.social-icon.twitter:hover{color:#1da1f2}.social-icon.facebook:hover{color:#1877f2}.social-icon.instagram:hover{color:#e1306c}.scroll-to-top{position:absolute;top:-20px;right:20px;background:#6c757d;color:#fff;border:none;border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 5px #0003;transition:background .3s ease,transform .3s ease-in-out;z-index:100}.scroll-to-top:hover{background:#ff8c5a;transform:scale(1.1)}.scroll-to-top svg{font-size:20px}@media (max-width: 768px){.scroll-to-top{width:36px;height:36px;top:5px;right:10px}}@media (max-width: 480px){.scroll-to-top{width:32px;height:32px;top:5px;right:5px}.scroll-to-top svg{font-size:18px}}@media (max-width: 768px){.footer-top{flex-direction:column;text-align:center}.logo-image{margin-left:0;margin-right:0}.footer-description p{margin-left:0;padding:0 15px}.website-policies{flex-direction:row;gap:5px;text-align:center}.website-policies a{padding:5px 0;display:block}.website-policies a:not(:last-child):after{content:none}}@media (max-width: 480px){.footer{padding:15px 5px}.logo-image{max-width:80px;max-height:80px}.footer-description p{font-size:.9rem}.footer-section{min-width:100%}.social-icons{gap:20px}.website-policies{flex-direction:column}.social-icon{font-size:25px;margin-bottom:-10px}}@media (min-width: 481px) and (max-width: 1024px){.footer-top{flex-direction:row;justify-content:center}.logo-image{margin:0 30px 0 0}.footer-description p{text-align:left;margin-left:0;padding:0;max-width:500px}.website-policies{gap:5px}.website-policies a{padding:0 8px}.website-policies a:not(:last-child):after{content:" | ";margin-left:8px;color:#000}.social-icons{gap:25px}.scroll-to-top{top:-15px;right:15px;width:36px;height:36px}}.contact-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.contact-modal{background:#fff;padding:30px;border-radius:8px;width:90%;max-width:500px;position:relative;box-shadow:0 4px 8px #0003}.close-button{position:absolute;top:10px;right:10px;background:none;border:none;font-size:24px;cursor:pointer;color:#000;background-color:gray;border-radius:50%;width:30px;height:30px}.close-button:hover{color:#000;background-color:red}.contact-modal h2{margin-bottom:20px;color:#333;text-align:center}.submission-message{padding:10px;margin-bottom:20px;border-radius:4px;text-align:center}.submission-message.success{background:#e7f3e7;color:#2e7d32}.submission-message.error{background:#fdeded;color:#d32f2f}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:5px;color:#666;font-weight:700}.form-group input,.form-group textarea{width:100%;padding:10px;border:1px solid #ddd;border-radius:4px;font-size:16px;color:#333}.form-group textarea{height:100px;resize:vertical}.form-group input:disabled,.form-group textarea:disabled{background:#f5f5f5;cursor:not-allowed}.submit-button{display:block;width:100%;padding:10px;background:#fdd5b1;color:#000;border:none;border-radius:4px;font-size:16px;cursor:pointer;transition:background .3s ease}.submit-button:hover:not(:disabled){background:#ff8c5a}.submit-button:disabled{background:green;cursor:not-allowed}textarea::-webkit-scrollbar{display:none}.privacy-policy-container{background-color:#fff;padding:40px 20px;min-height:100vh;color:#000}.privacy-policy-title{text-align:center;font-size:2.5rem;margin-bottom:30px;color:#4c0070;font-weight:700}.privacy-policy-content{max-width:800px;margin:0 auto;line-height:1.6}.privacy-policy-content p{margin-bottom:15px;font-size:1.1rem}.policy-section{margin-bottom:30px}.policy-section h2{font-size:1.8rem;color:#4c0070;margin:0;font-weight:600}.toggle-button{background-color:red;color:#f4e6ff;border:none;padding:6px;border-radius:5px;cursor:pointer;font-size:1rem;transition:background-color .3s ease;display:flex;align-items:center;justify-content:center}.section-divider{border:0;height:1px;background:gray;margin:10px 0}@media (max-width: 768px){.privacy-policy-container{padding:20px 15px}.privacy-policy-title{font-size:2rem}.policy-section h2{font-size:1.5rem}.toggle-button{padding:5px;font-size:.9rem}.privacy-policy-content p,.section-content li{font-size:1rem}}@media (min-width: 769px) and (max-width: 1024px){.privacy-policy-content{max-width:90%;padding:0 20px}.privacy-policy-title{font-size:2.3rem}.policy-section h2{font-size:1.7rem}}@media (max-width: 768px){.section-header{flex-direction:column;align-items:flex-start}.toggle-button{margin-top:10px;align-self:flex-end}}@media (max-width: 480px){.privacy-policy-container{padding:25px 12px}.privacy-policy-title{font-size:1.8rem;margin-bottom:20px}.policy-section h2{font-size:1.4rem}.privacy-policy-content p,.section-content li{font-size:1rem}.section-content ul{margin-left:15px}}@media (max-width: 375px){.privacy-policy-title{font-size:1.6rem}.policy-section h2{font-size:1.3rem}.privacy-policy-content{padding:0 5px}.toggle-button{padding:4px 6px;font-size:.85rem}}@media (max-width: 320px){.privacy-policy-title{font-size:1.5rem}.policy-section h2{font-size:1.2rem}.privacy-policy-content p,.section-content li{font-size:.95rem}}@media (max-height: 480px) and (orientation: landscape){.privacy-policy-container{padding:20px 10px}.privacy-policy-title{margin-bottom:15px}.policy-section{margin-bottom:20px}}@media (min-height: 1000px){.privacy-policy-container{padding-top:60px;padding-bottom:60px}.privacy-policy-title,.policy-section{margin-bottom:40px}}@media (min-width: 2000px){.privacy-policy-content{max-width:1000px}.privacy-policy-title{font-size:3rem}.policy-section h2{font-size:2.2rem}.privacy-policy-content p,.section-content li{font-size:1.2rem;line-height:1.7}.toggle-button{padding:8px 12px;font-size:1.1rem}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.privacy-policy-title,.policy-section h2{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}}@media print{.privacy-policy-container{padding:0;min-height:auto;color:#000}.toggle-button{display:none}.privacy-policy-content{max-width:100%;padding:0}.privacy-policy-title,.policy-section h2{color:#000!important}.section-content a{color:#000;text-decoration:underline}.section-divider{background-color:#ccc}}.terms-conditions-container{background-color:#fff;padding:40px 20px;min-height:100vh;color:#000}.terms-conditions-title{text-align:center;font-size:2.5rem;margin-bottom:20px;color:#4c0070;font-weight:700}.terms-conditions-content{max-width:800px;margin:0 auto;line-height:1.6}.terms-conditions-content p{margin-bottom:10px;font-size:1.1rem}.terms-section{margin-bottom:30px}.section-header{display:flex;justify-content:space-between;align-items:center;margin:10px 0}.terms-section h2{font-size:1.8rem;color:#4c0070;margin:0;font-weight:600}.toggle-button{background-color:gray;color:#fff;border:none;padding:6px;border-radius:5px;cursor:pointer;font-size:1rem;transition:background-color .3s ease;display:flex;align-items:center;justify-content:center}.toggle-button:hover{background-color:#ff8c5a}.para-divider{border:0;height:1px;background-color:gray;margin-bottom:20px;margin-top:20px}.section-divider{border:0;height:1px;background:gray;margin-top:30px}.section-content{margin-top:10px}.section-content ul{list-style-type:disc;margin-left:20px;margin-bottom:15px}.section-content li{margin-bottom:8px;font-size:1.1rem}.section-content a{color:#4c0070;text-decoration:none;transition:color .3s ease}.section-content a:hover{color:#8a2be2;text-decoration:underline}@media (max-width: 768px){.terms-conditions-container{padding:20px 15px}.terms-conditions-title{font-size:2rem}.terms-section h2{font-size:1.5rem}.toggle-button{padding:5px;font-size:.9rem}.terms-conditions-content p,.section-content li{font-size:1rem}}@media (max-width: 1024px){.terms-conditions-content{max-width:90%;padding:0 15px}.terms-conditions-title{font-size:2.2rem;margin-bottom:25px}.terms-section h2{font-size:1.6rem}}@media (max-width: 768px){.terms-conditions-container{padding:30px 15px}.terms-conditions-title{font-size:2rem}.section-header{flex-direction:column;align-items:flex-start}.toggle-button{margin-top:10px;align-self:flex-end}}@media (max-width: 576px){.terms-conditions-title{font-size:1.8rem;margin-bottom:20px}.terms-section h2{font-size:1.4rem}.terms-conditions-content p,.section-content li{font-size:1rem;line-height:1.5}.section-content ul{margin-left:15px}}@media (max-width: 480px){.terms-conditions-container{padding:25px 10px}.terms-conditions-title{font-size:1.6rem}.terms-section h2{font-size:1.3rem}.terms-conditions-content p,.section-content li{font-size:.95rem}.toggle-button{padding:5px 8px;font-size:.9rem}}@media (max-width: 320px){.terms-conditions-title{font-size:1.5rem}.terms-section h2{font-size:1.2rem}.terms-conditions-content{padding:0 5px}}@media (max-height: 480px) and (orientation: landscape){.terms-conditions-container{padding:20px 10px}.terms-conditions-title{margin-bottom:15px}.terms-section{margin-bottom:20px}}@media (min-width: 2000px){.terms-conditions-content{max-width:1200px}.terms-conditions-title{font-size:3rem}.terms-section h2{font-size:2.2rem}.terms-conditions-content p,.section-content li{font-size:1.3rem;line-height:1.7}.toggle-button{padding:10px 15px;font-size:1.2rem}}.color-names-page{margin:0 auto;padding:20px;max-width:1250px;width:100%;box-sizing:border-box}.color-code-names{text-align:center;color:#333;margin-bottom:20px;font-size:2.5rem;font-weight:600}.color-names-page>p{text-align:center;color:#666;margin-bottom:30px;font-size:1.1rem;line-height:1.5}.color-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:30px;padding:10px;justify-items:center}.color-item{background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;padding:15px;transition:transform .2s ease-in-out;border:2px solid grey;width:100%;max-width:230px}.color-box{width:180px;height:90px;border-radius:15px;margin:0 auto 10px;border:2px solid grey;transition:transform .3s ease-in-out}.color-box:hover{transform:scale(1.04)}.color-info{text-align:center}.color-info p{margin:5px 0;font-size:.9rem;color:#444}.color-info p:first-child{font-weight:500;color:#333}.copy-container{display:flex;align-items:center;justify-content:center;gap:8px}.copy-button{background:none;border:none;cursor:pointer;color:#666;transition:color .2s ease-in-out;padding:0;display:flex;align-items:center}.copy-button:hover{color:#ff8c5a}.copy-button svg{font-size:.9rem}@media (max-width: 1024px){.color-names-page{padding:15px}.color-grid{grid-template-columns:repeat(3,1fr);gap:20px}.color-box{width:160px;height:80px}.color-code-names{font-size:2.2rem}}@media (max-width: 768px){.color-names-page{padding:15px}.color-grid{grid-template-columns:repeat(2,1fr);gap:15px}.color-item{padding:10px}.color-box{width:100%;max-width:180px;height:80px;margin:0 auto 10px}.color-code-names{font-size:1.8rem}.color-names-page>p{font-size:1rem}.color-info p{font-size:.85rem}.copy-button svg{font-size:.8rem}}@media (max-width: 480px){.color-names-page{padding:10px}.color-box{width:85%;max-width:200px;height:70px;margin:0 auto 8px}.color-code-names{font-size:1.5rem}.color-names-page>p{font-size:.9rem;margin-bottom:20px}.color-info p{font-size:.8rem}.copy-container{gap:5px}.copy-button svg{font-size:.75rem}}@media (max-width: 360px){.color-names-page{padding:8px}.color-grid{gap:12px}.color-item{padding:6px}.color-box{width:90%;max-width:180px;height:60px;margin:0 auto 6px}.color-code-names{font-size:1.3rem}.color-names-page>p{font-size:.85rem}.color-info p{font-size:.75rem}.copy-container{gap:4px}.copy-button svg{font-size:.7rem}}.color-chart-container{display:flex;justify-content:center;gap:20px;padding:30px;max-width:1200px;margin:30px auto;border-radius:16px;flex-wrap:wrap}.color-chart-header{text-align:center;margin-bottom:30px;width:100%}.color-chart-header h1{font-size:2.2rem;color:#2c3e50;margin-bottom:10px;font-weight:700}.color-chart-header .subtitle{font-size:1.1rem;color:#7f8c8d;max-width:600px;margin:0 auto;line-height:1.5}.color-chart-column{margin-top:10px;display:flex;flex-direction:column;width:140px;border-radius:12px;overflow:hidden;background:#fff;position:relative}.color-column-header{background:#2c3e50;color:#fff;padding:10px;text-align:center;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:1px}.color-chart-box{height:50px;width:100%;display:flex;align-items:center;justify-content:center;position:relative;transition:all .3s ease;overflow:hidden}.color-chart-code{font-family:Fira Code,Courier New,monospace;font-size:14px;padding:6px 10px;border-radius:15px;background-color:#000000bf;color:#fff;display:flex;align-items:center;gap:8px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:all .2s ease;max-width:80%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.copy-icon{color:green!important}.copy-icon:hover{color:#ff8c5a}.color-chart-box[style*="#ffff"] .color-chart-code,.color-chart-box[style*="#fff"] .color-chart-code,.color-chart-box[style*="#ffe"] .color-chart-code,.color-chart-box[style*="#ffd"] .color-chart-code,.color-chart-box[style*="#ffc"] .color-chart-code,.color-chart-box[style*="#ffb"] .color-chart-code,.color-chart-box[style*="#ffa"] .color-chart-code,.color-chart-box[style*="#ff9"] .color-chart-code,.color-chart-box[style*="#ff8"] .color-chart-code{color:#333;background-color:#ffffffe6;box-shadow:0 0 0 1px #0000001a}@media (max-width: 768px){.color-chart-container{gap:15px;padding:20px}.color-chart-column{width:120px}.color-chart-code{font-size:10px;padding:4px 8px}}@media (max-width: 480px){.color-chart-container{padding:15px;gap:10px;margin:15px auto}.color-chart-header h1{font-size:1.8rem}.color-chart-header .subtitle{font-size:1rem;padding:0 15px}.color-chart-column{width:calc(50% - 15px);max-width:160px}.color-chart-code{font-size:10px;padding:3px 6px}}@media (min-width: 481px) and (max-width: 600px){.color-chart-column{width:calc(33.333% - 15px);max-width:160px}}@media (min-width: 601px) and (max-width: 767px){.color-chart-column{width:calc(25% - 15px);max-width:160px}}@media (min-width: 768px) and (max-width: 1024px){.color-chart-column{width:calc(20% - 16px)}}@media (min-width: 1025px) and (max-width: 1200px){.color-chart-column{width:calc(16.666% - 17px)}}@media (min-width: 1920px){.color-chart-container{max-width:1600px}.color-chart-column{width:160px}.color-chart-box{height:60px}.color-chart-code{font-size:16px}}@media screen and (orientation: portrait){.color-chart-container{padding:20px 10px}}@media screen and (orientation: landscape) and (max-height: 500px){.color-chart-container{padding:15px;margin:15px auto}.color-chart-box{height:40px}}.individual-chart-container{padding:20px;max-width:1200px;margin:0 auto;text-align:center}h2{margin-bottom:30px;font-size:24px;color:#333}.shades-grid{display:flex;flex-wrap:wrap;gap:20px;justify-content:center}.shade-column{display:flex;flex-direction:column;min-width:130px}.shade-box{border-bottom:2px solid rgb(174,174,174);display:flex;align-items:center;gap:10px;padding:10px;background-color:#f9f9f9;box-shadow:0 2px 4px #0000001a}.shade-swatch{width:40px;height:40px;border-radius:50%;border:1px solid grey;flex-shrink:0;transition:transform .2s}.shade-swatch:hover{transform:scale(1.1)}.shade-box span{font-family:monospace;font-size:14px;color:#555}.color-converter-container{padding:40px;margin:40px auto 20px;border-radius:15px;box-shadow:0 10px 20px #0000001a;height:auto;width:100%;max-width:1200px;position:relative;z-index:1}h2{text-align:center;margin-bottom:30px;letter-spacing:1px;font-size:35px}h3{text-align:center;color:#333;font-size:20px;margin-bottom:20px}.format-selection{margin-bottom:30px;text-align:center}.format-select{padding:10px;font-size:16px;border:2px solid grey;border-radius:8px;background-color:#fff;cursor:pointer;transition:border-color .3s;position:relative;z-index:20;pointer-events:auto;width:200px;max-width:100%}.format-select:hover,.format-select:focus{border-color:gray;outline:none}.output-format-options{display:flex;justify-content:center;gap:20px;flex-wrap:wrap}.output-format-label{display:flex;align-items:center;gap:5px;font-size:16px;color:#555;cursor:pointer}.output-format-label input[type=checkbox]{width:16px;height:16px;cursor:pointer}.input-section{display:flex;flex-direction:column;align-items:center;margin-bottom:30px}.color-input-conv{width:200px;max-width:100%;padding:10px;font-size:16px;border:2px solid #ddd;border-radius:8px;transition:border-color .3s;position:relative;z-index:10;pointer-events:auto;display:block;visibility:visible;opacity:1}.convert-btn{display:block;margin:0 auto 20px;padding:10px 20px;font-size:16px;background-color:gray;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s,transform .2s;position:relative;z-index:10;pointer-events:auto}.convert-btn:hover{background-color:#ff8c5a;transform:scale(1.05)}.error-message{text-align:center;color:#f44;font-size:16px;margin-bottom:20px;background-color:#ffe6e6;padding:10px;border-radius:8px}.result-section{border:1px solid #FDD5B1;display:flex;gap:20px;align-items:center;background-color:#fff;padding:20px;border-radius:10px;box-shadow:0 5px 15px #0000000d;margin-bottom:30px}.color-preview{width:100px;height:100px;border-radius:50%;border:1px solid grey;box-shadow:0 0 10px #0000001a;transition:transform .3s}.color-preview:hover{transform:scale(1.1)}.color-formats{flex:1;display:flex;flex-direction:column;gap:10px}.format-box{display:flex;justify-content:space-between;padding:10px;align-items:center;background-color:#f9f9f9;border-radius:8px;transition:background-color .3s;border:1px solid grey}.format-box:hover{background-color:#f0f0f0}.format-box span:first-child{font-weight:700;color:#555}.color-value{color:#00f;cursor:pointer;transition:color .3s;position:relative;z-index:10;pointer-events:auto}.color-value:hover{color:#554bff;text-decoration:none}.history-list{display:flex;flex-wrap:wrap;gap:15px;justify-content:center}.history-item{display:flex;align-items:center;gap:10px;padding:10px;background-color:#fff;border-radius:8px;box-shadow:0 3px 10px #0000000d;border:1px solid #FDD5B1}.history-preview{width:30px;height:30px;border-radius:5px;border:1px solid #ddd}.history-item span{font-size:14px;color:#555}@media (max-width: 1024px){.color-converter-container{padding:30px;margin-top:30px}h2{font-size:28px}h3{font-size:18px}.format-select,.color-input-conv{width:180px}.result-section{flex-direction:column;align-items:flex-start;padding:15px}.color-preview{width:80px;height:80px}}@media (max-width: 768px){.color-converter-container{padding:20px;margin-top:20px}.format-box{width:490px;padding:10px;font-size:14px}h2{font-size:24px;margin-bottom:20px}h3{font-size:16px;margin-bottom:15px}.format-select,.color-input-conv{width:100%;max-width:300px}.output-format-options{gap:15px;padding:0 10px}.output-format-label{font-size:14px}.convert-btn{padding:8px 16px;font-size:14px}.result-section{gap:15px}.color-preview{width:70px;height:70px;display:flex;justify-content:center;align-items:center;margin:0 auto}.history-item{padding:8px;gap:8px}.history-preview{width:25px;height:25px}.history-item span{font-size:12px}}@media (max-width: 480px){.color-converter-container{padding:15px;margin-top:15px;margin-bottom:15px}h2{font-size:20px;margin-bottom:15px}h3{font-size:14px;margin-bottom:10px}.format-selection{margin-bottom:20px}.format-select,.color-input-conv{width:100%;max-width:250px;font-size:14px;padding:8px}.output-format-options{gap:10px}.output-format-label{font-size:13px}.output-format-label input[type=checkbox]{width:14px;height:14px}.convert-btn{padding:6px 12px;font-size:13px}.error-message{font-size:14px;padding:8px}.result-section{padding:10px;gap:10px}.color-preview{width:60px;height:60px;display:flex;justify-content:center;align-items:center;margin:0 auto}.format-box{padding:8px;font-size:15px;width:330px;margin:0 auto}.history-list{gap:10px}.history-item{padding:6px}.history-preview{width:20px;height:20px}.history-item span{font-size:11px}}@media (max-width: 360px){.color-converter-container{padding:10px}h2{font-size:18px}h3{font-size:13px}.format-select,.color-input-conv{max-width:200px;font-size:13px}.color-preview{width:50px;height:50px}.format-box{font-size:13px;width:240px}}._container_1cmch_1{max-width:1200px;width:100%;margin:20px auto;padding:1rem;transition:transform .2s ease-in-out}._h1_1cmch_12{font-size:2rem;font-weight:700;color:#1a1a1a;margin-bottom:1rem;display:flex;align-items:center;justify-content:center;text-align:center;flex-wrap:wrap}._h1_1cmch_12 span{margin-right:.5rem;font-size:2.5rem}._description_1cmch_30{font-size:1.1rem;font-weight:500;color:#4a4a4a;margin-bottom:.5rem;text-align:center}._instructions_1cmch_38{font-size:.95rem;color:#6b7280;margin-bottom:1.5rem;text-align:center;max-width:600px;margin-left:auto;margin-right:auto}._imageSection_1cmch_49{display:grid;grid-template-columns:1fr;gap:1.5rem;margin-bottom:1.5rem;align-items:stretch}._selectedImage_1cmch_58{padding:1rem;border-radius:8px;transition:background-color .3s ease;display:flex;flex-direction:column;align-items:center}._selectedImage_1cmch_58 h3{font-size:1.1rem;font-weight:600;color:#2c3e50;margin-bottom:.8rem;text-align:center}._imagePreview_1cmch_75{width:100%;height:250px;border-radius:6px;border:1px solid #e5e7eb;transition:transform .2s ease-in-out;object-fit:contain;object-position:center;background-color:#e5e7eb}._placeholderImage_1cmch_86{height:250px;width:100%;background-color:#e5e7eb;display:flex;align-items:center;justify-content:center;border-radius:6px;color:#9ca3af;font-weight:500;border:1px dashed #d1d5db;text-align:center}._imageSelector_1cmch_101{padding:1rem;border-radius:8px;display:flex;flex-direction:column;align-items:center}._imageSelector_1cmch_101 h3{font-size:1.1rem;font-weight:600;color:#2c3e50;margin-bottom:.8rem;text-align:center}._dropzone_1cmch_117{height:250px;width:100%;background-color:#e6f0fa;border:2px dashed #93c5fd;border-radius:6px;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer;transition:background-color .3s ease,border-color .3s ease}._dropzone_1cmch_117:hover{background-color:#dbeafe;border-color:#3b82f6}._dropzone_1cmch_117 p{color:#3b82f6;font-weight:500;font-size:.9rem;text-align:center;padding:0 1rem}._fileInput_1cmch_144{position:absolute;width:100%;height:100%;opacity:0;cursor:pointer}._allColors_1cmch_153{margin-bottom:1.5rem}._allColors_1cmch_153 h3{font-size:1.3rem;font-weight:600;color:#2c3e50;margin-bottom:.8rem;text-align:center}._colorList_1cmch_165{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.8rem;max-height:400px;overflow-y:auto;padding:.8rem;background-color:#f9fafb;border-radius:8px;border:1px solid #e5e7eb}._colorBox_1cmch_177{border:1px grey solid;width:150px;margin-bottom:10px;text-align:center;padding:.5rem;background-color:#fff;border-radius:6px;transition:transform .2s ease-in-out,box-shadow .2s ease-in-out}._colorSample_1cmch_188{width:100%;height:45px;border-radius:4px;border:1px solid grey;margin-bottom:.4rem;transition:border-color .3s ease}._colorBox_1cmch_177 p{margin:.2rem 0;font-size:.85rem;color:#4b5563;font-weight:500}._colorList_1cmch_165::-webkit-scrollbar{width:6px}._colorList_1cmch_165::-webkit-scrollbar-track{background:#f1f5f9;border-radius:4px}._colorList_1cmch_165::-webkit-scrollbar-thumb{background:#fdd5b1;border-radius:4px}._colorList_1cmch_165::-webkit-scrollbar-thumb:hover{background:#ff8c5a}._copyBtnImg_1cmch_223{background:none;border:none;cursor:pointer}._copyIcon_1cmch_229{margin-left:8px;color:#666;font-size:13px;transition:color .2s ease}._copyIcon_1cmch_229:hover{color:#ff8c5a}._tickIcon_1cmch_240{color:#28a745;font-size:13px;margin-left:8px}@media (min-width: 601px){._imageSection_1cmch_49{grid-template-columns:1fr 1fr;gap:1.5rem}._h1_1cmch_12{font-size:2.2rem}._h1_1cmch_12 span{font-size:2.7rem}._description_1cmch_30{font-size:1.15rem}._imagePreview_1cmch_75,._placeholderImage_1cmch_86,._dropzone_1cmch_117{height:280px}._colorList_1cmch_165{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}}@media (min-width: 1025px){._container_1cmch_1{padding:2rem}._h1_1cmch_12{font-size:2.5rem}._h1_1cmch_12 span{font-size:3rem}._description_1cmch_30{font-size:1.25rem}._imagePreview_1cmch_75,._placeholderImage_1cmch_86,._dropzone_1cmch_117{height:300px}._colorList_1cmch_165{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}}@media (max-width: 360px){._colorList_1cmch_165{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}._colorSample_1cmch_188{height:80px}._imagePreview_1cmch_75,._placeholderImage_1cmch_86,._dropzone_1cmch_117{height:220px}}@media (max-width: 768px){._colorList_1cmch_165{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.75rem}._colorSample_1cmch_188{height:45px}._colorBox_1cmch_177{width:120px;height:90px}}@media (max-width: 480px){._colorList_1cmch_165{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.5rem;padding:.5rem}._colorBox_1cmch_177{padding:.5rem;width:90px}._colorSample_1cmch_188{height:50px}._colorBox_1cmch_177 p{font-size:.75rem}}.color-mixer-container{padding:40px;max-width:1200px;margin:0 auto;font-family:Arial,sans-serif;background-color:#fff;color:#333;border-radius:10px}.color-mixer-description{font-size:25px;color:#666;text-align:center;margin-bottom:30px}.color-mixer-grid{display:grid;grid-template-columns:1fr 2fr;gap:30px}.color-mixer-inputs{display:flex;flex-direction:column;gap:20px}.color-mixer-input-section{background-color:#fff;padding:15px;border:2px solid grey;border-radius:8px}.color-mixer-label{font-size:16px;color:#666;margin-bottom:10px;display:block}.color-mixer-color-input{width:100%;height:40px;border:none;border-radius:5px;margin-bottom:10px;cursor:pointer}.color-mixer-hex-input{width:100%;padding:8px;font-size:14px;border:1px solid #ddd;border-radius:5px;background-color:#fff;color:#333}.color-mixer-mixed-preview{width:100%;height:40px;border-radius:5px;margin-bottom:10px;border:1px solid #ddd}.color-mixer-export-section{margin-top:20px;text-align:center}.color-mixer-export-btn{padding:10px 20px;background-color:#666;width:200px;font-size:20px;color:#fff;border:none;border-radius:15px;cursor:pointer;transition:background-color .3s}.color-mixer-export-btn:hover{background-color:#ff8c5a}.color-mixer-preview{display:flex;flex-direction:column;gap:20px;height:495px}.color-mixer-mixed-color{flex:1;background-color:#fff;border:1px solid #ddd;border-radius:10px}.color-mixer-mix-chart{display:flex;gap:5px;background-color:#fff;padding:10px;border:1px solid #ddd;border-radius:8px}.color-mixer-mix-step{flex:1;height:50px;border-radius:5px}.color-mixer-mix-labels{display:flex;justify-content:space-between;margin-top:10px;font-size:14px;color:#666}.color-mixer-export-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.color-mixer-export-modal-content{background-color:#fff;padding:20px;border-radius:10px;width:400px;max-width:90%;border:1px solid #ddd}.color-mixer-export-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.color-mixer-export-modal-header h3{display:flex;font-size:18px;margin:0;color:#333}.color-mixer-export-modal-close{background:gray;width:30px;height:30px;border-radius:50%;border:none;color:#000;font-size:20px;cursor:pointer}.color-mixer-export-modal-close:hover{color:#000;background-color:red}.color-mixer-export-modal-body{margin-bottom:20px}.color-mixer-export-mix-chart{display:flex;gap:5px;margin-bottom:20px}.color-mixer-export-mix-step{flex:1;height:50px;border-radius:5px}.color-mixer-export-preview h4{font-size:16px;color:#333;margin-bottom:10px}.color-mixer-export-preview-image,.color-mixer-export-preview-svg{width:100%;align-items:center;justify-content:center;display:flex;height:auto;border-radius:5px}.color-mixer-export-preview-text{background-color:#f5f5f5;padding:10px;border:1px solid #ddd;border-radius:5px;font-size:14px;color:#333;white-space:pre-wrap;max-height:150px;overflow-y:auto}.color-mixer-export-preview-download-btn{margin-top:10px;padding:8px 16px;background-color:#666;color:#fff;border:none;border-radius:10px;cursor:pointer;transition:background-color .3s;display:block;margin-left:auto;margin-right:auto}.color-mixer-export-preview-download-btn:hover{background-color:coral}.color-mixer-export-modal-footer{display:flex;justify-content:center;align-items:center;gap:10px}.color-mixer-export-modal-btn{padding:8px 16px;background-color:#666;color:#fff;border:none;border-radius:25px;cursor:pointer;transition:background-color .3s}.color-mixer-export-modal-btn:hover{background-color:green}@media (max-width: 900px){.color-mixer-grid{grid-template-columns:1fr}.color-mixer-mixed-color{height:300px}}@media (max-width: 600px){.color-mixer-container{padding:20px}}.color-palette-generator-container{padding:40px;max-width:1200px;margin:0 auto;font-family:Arial,sans-serif;color:#333;border-radius:10px}.color-palette-generator-title{font-size:28px;margin-bottom:10px;text-align:center;text-transform:uppercase;letter-spacing:2px;color:#333}.color-palette-generator-description{font-size:16px;color:#666;text-align:center;margin-bottom:30px}.color-palette-generator-grid{display:grid;grid-template-columns:1fr 2fr;gap:30px}.color-palette-generator-inputs{display:flex;flex-direction:column;gap:20px}.color-palette-generator-input-section{background-color:#fff;padding:15px;border:1px solid #ddd;border-radius:8px}.color-palette-generator-label{font-size:16px;color:#666;margin-bottom:10px;display:block}.color-palette-generator-color-input{width:100%;height:40px;border:none;border-radius:5px;margin-bottom:10px;cursor:pointer}.color-palette-generator-hex-input,.color-palette-generator-select{width:100%;padding:8px;font-size:14px;border:1px solid #ddd;border-radius:5px;background-color:#fff;color:#333}.color-palette-generator-actions{display:flex;gap:10px;justify-content:center}.color-palette-generator-random-btn,.color-palette-generator-export-btn{padding:10px 20px;background-color:#666;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}.color-palette-generator-export-btn:hover{background-color:#ff8c5a}.color-palette-generator-random-btn:hover{background-color:green}.color-palette-generator-preview{display:flex;flex-direction:column;gap:20px}.color-palette-generator-sample{display:flex;height:100px;border:1px solid #ddd;border-radius:10px;overflow:hidden}.color-palette-generator-sample-block{flex:1}.color-palette-generator-palette{display:flex;flex-wrap:wrap;gap:10px;background-color:#fff;padding:10px;border:1px solid #ddd;border-radius:8px}.color-palette-generator-swatch{display:flex;flex-direction:column;align-items:center;gap:5px;width:100px}.color-palette-generator-swatch-color{width:100%;height:50px;border-radius:5px;border:1px solid #ddd}.color-palette-generator-swatch-hex{font-size:12px;color:#666}.color-palette-generator-export-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.color-palette-generator-export-modal-content{background-color:#fff;padding:20px;border-radius:10px;width:400px;max-width:90%;border:1px solid #ddd;position:relative;overflow:hidden}.color-palette-generator-export-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.color-palette-generator-export-modal-header h3{font-size:18px;margin:0;color:#333}.color-palette-generator-export-modal-close{background:gray;width:30px;height:30px;border:none;border-radius:50%;color:#666;font-size:20px;cursor:pointer}.color-palette-generator-export-modal-close:hover{color:#000;background-color:red}.color-palette-generator-export-modal-body{margin-bottom:20px}.color-palette-generator-export-palette{display:flex;gap:5px;margin-bottom:20px}.color-palette-generator-export-swatch{flex:1;height:50px;border-radius:5px}.color-palette-generator-export-preview{margin-top:20px;max-height:400px;overflow:auto}.color-palette-generator-export-preview h4{font-size:16px;color:#333;margin-bottom:10px}.color-palette-generator-export-preview-image,.color-palette-generator-export-preview-svg{width:100%;height:auto;object-fit:contain;overflow:auto;border-radius:5px;overflow-x:hidden}.color-palette-generator-export-preview-text{background-color:#f5f5f5;padding:10px;border:1px solid #ddd;border-radius:5px;font-size:14px;color:#333;white-space:pre-wrap;max-height:150px;overflow-y:auto}.color-palette-generator-export-preview-download-btn{margin-top:10px;padding:8px 16px;background-color:#666;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s;display:block;margin-left:auto;margin-right:auto}.color-palette-generator-export-preview-download-btn:hover{background-color:#ff8c5a}.color-palette-generator-export-modal-footer{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.color-palette-generator-export-modal-btn{padding:8px 16px;background-color:#666;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}.color-palette-generator-export-modal-btn:hover{background-color:green}@media (max-width: 900px){.color-palette-generator-grid{grid-template-columns:1fr}.color-palette-generator-sample{height:80px}}@media (max-width: 600px){.color-palette-generator-container{padding:20px}.color-palette-generator-swatch{width:80px}}@media (max-width: 1024px){.color-palette-generator-container{max-width:900px;padding:30px}.color-palette-generator-grid{grid-template-columns:1fr 1fr;gap:20px}.color-palette-generator-title{font-size:24px}.color-palette-generator-description{font-size:15px}.color-palette-generator-swatch{width:90px}.color-palette-generator-export-modal-content{width:80%}}@media (max-width: 768px){.color-palette-generator-container{padding:25px}.color-palette-generator-grid{grid-template-columns:1fr;gap:15px}.color-palette-generator-sample{height:80px}.color-palette-generator-preview{gap:15px}.color-palette-generator-actions{flex-direction:column;gap:8px}.color-palette-generator-random-btn,.color-palette-generator-export-btn{width:100%;padding:12px}.color-palette-generator-swatch{width:85px}}@media (max-width: 480px){.color-palette-generator-container{padding:15px;border-radius:5px}.color-palette-generator-title{font-size:20px;letter-spacing:1px}.color-palette-generator-description{font-size:14px;margin-bottom:20px}.color-palette-generator-input-section{padding:10px}.color-palette-generator-label{font-size:14px;margin-bottom:8px}.color-palette-generator-color-input{height:35px}.color-palette-generator-hex-input,.color-palette-generator-select{font-size:13px;padding:6px}.color-palette-generator-sample{height:60px}.color-palette-generator-swatch{width:70px}.color-palette-generator-swatch-color{height:40px}.color-palette-generator-swatch-hex{font-size:11px}.color-palette-generator-export-modal-content{width:90%;padding:15px}.color-palette-generator-export-modal-header h3{font-size:16px}.color-palette-generator-export-modal-close{font-size:18px}.color-palette-generator-export-swatch{height:40px}.color-palette-generator-export-preview-text{font-size:13px;max-height:120px}.color-palette-generator-export-modal-btn{padding:6px 12px;font-size:13px}}@media (max-width: 360px){.color-palette-generator-container{padding:10px}.color-palette-generator-title{font-size:18px}.color-palette-generator-description{font-size:13px}.color-palette-generator-input-section{padding:8px}.color-palette-generator-sample{height:50px}.color-palette-generator-swatch{width:60px}.color-palette-generator-swatch-color{height:35px}.color-palette-generator-random-btn,.color-palette-generator-export-btn{padding:10px;font-size:14px}.color-palette-generator-export-modal-content{padding:10px}.color-palette-generator-export-preview h4{font-size:14px}.color-palette-generator-export-preview-download-btn{padding:6px 12px;font-size:13px}}@media (max-height: 600px){.color-palette-generator-export-modal-content{max-height:90vh;overflow-y:auto}.color-palette-generator-export-preview{max-height:150px}}.color-contrast-checker-container{padding:40px;max-width:1200px;margin:0 auto 20px;font-family:Arial,sans-serif;color:#333;border-radius:10px}.color-contrast-checker-title{font-size:28px;margin-bottom:10px;text-align:center;text-transform:uppercase;letter-spacing:2px;color:#333}.color-contrast-checker-description{font-size:16px;color:#666;text-align:center;margin-bottom:30px}.color-contrast-checker-grid{display:grid;grid-template-columns:1fr 2fr;gap:30px}.color-contrast-checker-controls{display:flex;flex-direction:column;gap:20px}.color-contrast-checker-input-section{background-color:#fff;padding:15px;border:1px solid #ddd;border-radius:8px}.color-contrast-checker-label{font-size:16px;color:#666;margin-bottom:10px;display:block}.color-contrast-checker-color-input{width:100%;height:40px;border:none;border-radius:5px;margin-bottom:10px;cursor:pointer}.color-contrast-checker-hex-input,.color-contrast-checker-font-input,.color-contrast-checker-select{width:100%;padding:8px;font-size:14px;border:1px solid #ddd;border-radius:5px;background-color:#fff;color:#333}.color-contrast-checker-swap{display:flex;justify-content:center}.color-contrast-checker-swap-btn{background-color:#666;color:#fff;border:none;border-radius:5px;padding:8px;cursor:pointer;transition:background-color .3s}.color-contrast-checker-swap-btn:hover{background-color:#ff8c5a}.color-contrast-checker-actions{display:flex;gap:10px;justify-content:center;margin-top:10px}.color-contrast-checker-random-btn,.color-contrast-checker-export-btn{padding:10px 20px;background-color:#666;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}.color-contrast-checker-random-btn:hover,.color-contrast-checker-export-btn:hover{background-color:green}.color-contrast-checker-preview{display:flex;flex-direction:column;gap:20px}.color-contrast-checker-sample{padding:20px;border-radius:10px;border:1px solid #ddd}.color-contrast-checker-sample h3{font-size:24px;margin-bottom:10px}.color-contrast-checker-sample p{font-size:18px;line-height:1.6}.color-contrast-checker-icons{display:flex;gap:10px;justify-content:center}.color-contrast-checker-icon{font-size:24px}.color-contrast-checker-contrast-info{background-color:#fff;padding:15px;border:1px solid #ddd;border-radius:8px;text-align:center}.color-contrast-checker-contrast-info h4{font-size:18px;color:#333;margin-bottom:10px}.color-contrast-checker-contrast-info p{font-size:16px;color:#666;margin:5px 0}.color-contrast-checker-note{font-size:14px;color:#7f8c8d;margin-top:10px;margin-bottom:15px}.color-contrast-checker-presets{text-align:center;padding-top:10px;border-top:1px solid #ddd}.color-contrast-checker-presets h4{font-size:16px;color:#333;margin-bottom:10px}.color-contrast-checker-preset-btn{padding:8px 16px;background-color:#666;color:#fff;border:none;border-radius:5px;cursor:pointer;margin:5px;transition:background-color .3s}.color-contrast-checker-preset-btn:hover{background-color:green}.color-contrast-checker-export-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.color-contrast-checker-export-modal-content{background-color:#fff;padding:20px;border-radius:10px;width:400px;max-width:90%;border:1px solid #ddd}.color-contrast-checker-export-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.color-contrast-checker-export-modal-header h3{font-size:18px;margin:0;color:#333}.color-contrast-checker-export-modal-close{background:gray;width:30px;height:30px;border-radius:50%;border:none;color:#666;font-size:20px;cursor:pointer}.color-contrast-checker-export-modal-close:hover{color:#000;background-color:red}.color-contrast-checker-export-modal-body{margin-bottom:20px}.color-contrast-checker-export-preview{margin-top:20px}.color-contrast-checker-export-preview h4{font-size:16px;color:#333;margin-bottom:10px}.color-contrast-checker-export-preview-image{width:100%;height:auto;border:1px solid #ddd;border-radius:5px}.color-contrast-checker-export-preview-text{background-color:#f5f5f5;padding:10px;border:1px solid #ddd;border-radius:5px;font-size:14px;color:#333;white-space:pre-wrap;max-height:150px;overflow-y:auto}.color-contrast-checker-export-preview-download-btn{margin-top:10px;padding:8px 16px;background-color:#666;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s;display:block;margin-left:auto;margin-right:auto}.color-contrast-checker-export-preview-download-btn:hover{background-color:#ff8c5a}.color-contrast-checker-export-modal-footer{justify-content:center;align-items:center;display:flex;gap:10px;flex-wrap:wrap}.color-contrast-checker-export-modal-btn{padding:8px 16px;background-color:#666;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}.color-contrast-checker-export-modal-btn:hover{background-color:green}@media (max-width: 900px){.color-contrast-checker-grid{grid-template-columns:1fr}.color-contrast-checker-sample{padding:15px}}@media (max-width: 600px){.color-contrast-checker-container{padding:20px}.color-contrast-checker-sample h3{font-size:20px}.color-contrast-checker-sample p{font-size:16px}}@media (max-width: 479px){.color-contrast-checker-container{padding:20px 10px}.color-contrast-checker-title{font-size:22px;letter-spacing:1px;margin-bottom:8px}.color-contrast-checker-description{font-size:14px;margin-bottom:20px}.color-contrast-checker-grid{grid-template-columns:1fr;gap:20px}.color-contrast-checker-sample h3{font-size:20px}.color-contrast-checker-sample p{font-size:16px}.color-contrast-checker-actions{flex-direction:column;align-items:center}.color-contrast-checker-export-modal-content{width:95%}}@media (min-width: 480px) and (max-width: 599px){.color-contrast-checker-container{padding:25px 15px}.color-contrast-checker-grid{grid-template-columns:1fr;gap:25px}.color-contrast-checker-title{font-size:24px}}@media (min-width: 600px) and (max-width: 767px){.color-contrast-checker-container{padding:30px 20px}.color-contrast-checker-grid{grid-template-columns:1fr 1.5fr}.color-contrast-checker-controls{gap:15px}}@media (min-width: 768px) and (max-width: 991px){.color-contrast-checker-container{max-width:95%}.color-contrast-checker-grid{gap:25px}}@media (min-width: 992px) and (max-width: 1199px){.color-contrast-checker-container{max-width:1100px}}@media (min-width: 1200px){.color-contrast-checker-container{padding:50px}}@media (min-width: 1800px){.color-contrast-checker-container{max-width:1400px}.color-contrast-checker-title{font-size:32px}.color-contrast-checker-sample h3{font-size:28px}}@media (max-height: 700px) and (orientation: portrait){.color-contrast-checker-container{padding:15px 10px}.color-contrast-checker-grid{gap:15px}}@media (max-width: 900px) and (orientation: landscape){.color-contrast-checker-grid{grid-template-columns:1fr 1fr}.color-contrast-checker-title{font-size:24px}}@media (min-width: 2000px){.color-contrast-checker-container{max-width:1600px}.color-contrast-checker-title{font-size:36px}.color-contrast-checker-description{font-size:18px}.color-contrast-checker-sample h3{font-size:30px}.color-contrast-checker-sample p{font-size:22px}}@media (max-width: 600px) and (max-height: 500px){.color-contrast-checker-container{padding:10px}.color-contrast-checker-grid{grid-template-columns:1fr;gap:10px}}@media print{.color-contrast-checker-container{padding:0;max-width:100%}.color-contrast-checker-grid{grid-template-columns:1fr 1fr}.color-contrast-checker-actions,.color-contrast-checker-swap{display:none}}.color-gradient-maker-container{padding:40px;max-width:1200px;margin:0 auto;background-color:#fff;color:#333}.color-gradient-maker-title{font-size:28px;margin-bottom:10px;text-align:center;text-transform:uppercase;letter-spacing:1px;color:#333}.color-gradient-maker-description{font-size:16px;color:#666;text-align:center;margin-bottom:30px}.color-gradient-maker-grid{width:1100px;display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-bottom:40px}.color-gradient-maker-controls{display:flex;flex-direction:column;gap:20px}.color-gradient-maker-input-section{background-color:#fff;padding:15px;border:1px solid #ddd;border-radius:8px}.color-gradient-maker-label{font-size:16px;color:#666;margin-bottom:10px;display:block}.color-gradient-maker-select{width:100%;padding:8px;font-size:14px;border:1px solid #ddd;border-radius:5px;background-color:#fff;color:#333}.color-gradient-maker-actions{display:flex;gap:10px;justify-content:center;margin-top:20px}.color-gradient-maker-random-btn,.color-gradient-maker-create-btn,.color-gradient-maker-export-btn{padding:10px 20px;background-color:#666;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}.color-gradient-maker-random-btn:hover,.color-gradient-maker-create-btn:hover,.color-gradient-maker-export-btn:hover{background-color:green}.color-gradient-maker-preview{display:flex;flex-direction:column;gap:20px}.color-gradient-maker-gradient{height:200px;border:1px solid #ddd;border-radius:10px;position:relative}.color-gradient-maker-arrow-icon{font-size:12px}.color-gradient-maker-css{background-color:#fff;padding:15px;border:1px solid #ddd;border-radius:8px;display:flex;flex-direction:column;gap:10px}.color-gradient-maker-css-code{background-color:#f5f5f5;padding:10px;border:1px solid #ddd;border-radius:5px;align-items:center;justify-content:center;display:flex;font-size:14px;height:60px;color:#333;white-space:pre-wrap;margin:0}.color-gradient-maker-copy-btn{top:0;padding:8px 16px;background-color:#666;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s;display:flex;align-items:center;gap:5px;justify-content:center}.color-gradient-maker-copy-btn:hover{background-color:green}.color-gradient-maker-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000;overflow-y:auto}.color-gradient-maker-modal{background-color:#fff;padding:20px;border-radius:10px;width:500px;max-width:90%;border:1px solid #ddd;position:relative;max-height:90vh;overflow-y:auto;box-sizing:border-box}.color-gradient-maker-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.color-gradient-maker-modal-header h2{font-size:20px;color:#333;margin:0;text-align:center;flex:1}.color-gradient-maker-modal-close{background:none;border:none;color:#666;font-size:18px;cursor:pointer;transition:color .3s}.color-gradient-maker-modal-close:hover{color:#e74c3c}.color-gradient-maker-color-inputs{display:flex;flex-direction:column;gap:10px;margin-bottom:20px;max-height:50vh;overflow-y:auto;padding-right:5px}.color-gradient-maker-color-input{display:flex;align-items:center;gap:10px}.color-gradient-maker-color-input label{font-size:14px;color:#666;width:60px}.color-gradient-maker-color-picker{width:40px;height:40px;border:none;border-radius:5px;cursor:pointer}.color-gradient-maker-hex-input{flex:1;padding:8px;font-size:14px;border:1px solid #ddd;border-radius:5px;background-color:#fff;color:#333}.color-gradient-maker-remove-btn{background-color:#e74c3c;color:#fff;border:none;border-radius:5px;padding:8px;cursor:pointer;transition:background-color .3s}.color-gradient-maker-remove-btn:hover{background-color:#c0392b}.color-gradient-maker-add-color-button{padding:10px;background-color:#666;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s;display:flex;align-items:center;gap:5px;justify-content:center;margin-bottom:20px}.color-gradient-maker-add-color-button:hover{background-color:green}.color-gradient-maker-modal-buttons{display:flex;justify-content:flex-end;gap:10px}.color-gradient-maker-create-button,.color-gradient-maker-save-button{padding:8px 16px;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}.color-gradient-maker-create-button{background-color:#666;color:#fff}.color-gradient-maker-create-button:hover{background-color:#00f}.color-gradient-maker-save-button{background:#00000080;color:#fff}.color-gradient-maker-save-button:hover{background-color:green}.color-gradient-maker-preview-section{margin-top:20px;font-size:5px}.color-gradient-maker-preview-section h3{font-size:16px;color:#333;margin-bottom:10px;text-align:center}.color-gradient-maker-gradient-preview{height:100px;border:1px solid #ddd;border-radius:10px;position:relative}.color-gradient-maker-preview-color-codes{position:absolute;left:10px;bottom:10px;display:flex;align-items:center;gap:3px;background:#00000080;padding:5px 10px;border-radius:5px;color:#fff;font-size:10px}.color-gradient-maker-arrow-icon-preview{font-size:10px}.color-gradient-maker-export-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.color-gradient-maker-export-modal-content{background-color:#fff;padding:20px;border-radius:10px;width:400px;max-width:90%;border:1px solid #ddd}.color-gradient-maker-export-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.color-gradient-maker-export-modal-header h3{font-size:18px;margin:0;color:#333}.color-gradient-maker-export-modal-close{background:gray;border:none;border-radius:50%;height:30px;width:30px;color:#666;font-size:16px;cursor:pointer}.color-gradient-maker-export-modal-close:hover{color:#000;background-color:red}.color-gradient-maker-export-modal-body{margin-bottom:20px}.color-gradient-maker-export-preview{margin-top:20px}.color-gradient-maker-export-preview h4{font-size:16px;color:#333;margin-bottom:10px}.color-gradient-maker-export-preview-image{width:100%;height:auto;border:1px solid #ddd;border-radius:5px}.color-gradient-maker-export-preview-text{background-color:#f5f5f5;padding:10px;border:1px solid #ddd;border-radius:5px;font-size:14px;color:#333;white-space:pre-wrap;max-height:150px;overflow-y:auto}.color-gradient-maker-export-preview-download-btn{margin-top:10px;padding:8px 16px;background-color:#666;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s;display:block;margin-left:auto;margin-right:auto}.color-gradient-maker-export-preview-download-btn:hover{background-color:#ff8c5a}.color-gradient-maker-export-modal-footer{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.color-gradient-maker-export-modal-btn{padding:8px 16px;background-color:#666;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}.color-gradient-maker-export-modal-btn:hover{background-color:green}.color-gradient-maker-inspiration{margin-top:40px}.color-gradient-maker-inspiration-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.color-gradient-maker-inspiration-header h3{font-size:20px;color:#333}.color-gradient-maker-sort-container{position:relative}.color-gradient-maker-sort-button{padding:8px 16px;color:#000;border:none;border-radius:5px;font-size:20px;cursor:pointer;display:flex;align-items:center;gap:5px;transition:background-color .3s}.color-gradient-maker-sort-button:hover{background-color:green}.color-gradient-maker-sort-dropdown{position:absolute;top:100%;right:0;background-color:#fff;border:1px solid #ddd;border-radius:10px;box-shadow:0 2px 8px #0000001a;z-index:10}.color-gradient-maker-sort-dropdown ul{list-style:none;margin:0;padding:0}.color-gradient-maker-sort-dropdown li{padding:8px 16px;font-size:18px;border-radius:10px;width:115px;color:#333;cursor:pointer;transition:background-color .3s}.color-gradient-maker-sort-dropdown li:hover{background-color:#ff8c5a}.color-gradient-maker-gradient-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));gap:20px}.color-gradient-maker-gradient-card{position:relative;height:150px;border:1px solid #ddd;border-radius:10px;overflow:hidden}.color-gradient-maker-gradient-background{width:100%;height:100%}.color-gradient-maker-color-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}.color-gradient-maker-color-codes{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:5px;background:#fffc;padding:5px 10px;border-radius:5px;color:#333;font-size:12px;max-width:90%;text-align:center}.color-gradient-maker-spinner-container{text-align:center;margin:20px 0}.color-gradient-maker-spinner{position:relative;width:50px;height:50px;margin:0 auto}.spinner-circle{position:absolute;width:100%;height:100%;border:5px solid transparent;border-top:5px solid #666;border-radius:50%;animation:spin 1.5s linear infinite}.spinner-circle-delayed{border-top:5px solid #ff8c5a;animation:spin 1s linear infinite;animation-delay:.75s}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.color-gradient-maker-no-more{text-align:center;margin:20px 0}.color-gradient-maker-no-more p{font-size:16px;color:#666}.color-gradient-maker-load-more-trigger{height:20px}@media (max-width: 900px){.color-gradient-maker-grid{grid-template-columns:1fr}.color-gradient-maker-gradient{height:150px}}@media (max-width: 600px){.color-gradient-maker-container{padding:20px}.color-gradient-maker-color-input{flex-direction:column;align-items:flex-start}.color-gradient-maker-color-picker{width:100%}.color-gradient-maker-gradient-card{height:120px}}@media (min-width: 768px) and (max-width: 1024px){.color-gradient-maker-container{padding:30px;max-width:95%}.color-gradient-maker-grid{width:100%;gap:20px}.color-gradient-maker-gradient{height:180px}.color-gradient-maker-actions{flex-wrap:wrap}.color-gradient-maker-gradient-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.color-gradient-maker-gradient-card{height:130px}.color-gradient-maker-modal{width:80%}}@media (min-width: 481px) and (max-width: 767px){.color-gradient-maker-container{padding:25px 20px}.color-gradient-maker-title{font-size:24px}.color-gradient-maker-grid{width:100%;grid-template-columns:1fr;gap:25px;margin-bottom:30px}.color-gradient-maker-gradient{height:160px}.color-gradient-maker-actions{flex-direction:column;align-items:center}.color-gradient-maker-random-btn,.color-gradient-maker-create-btn,.color-gradient-maker-export-btn{width:100%;max-width:250px}.color-gradient-maker-gradient-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.color-gradient-maker-gradient-card{height:120px}.color-gradient-maker-modal{width:95%;padding:15px;max-height:85vh}.color-gradient-maker-color-inputs{max-height:40vh}.color-gradient-maker-color-input{flex-direction:column;align-items:flex-start}.color-gradient-maker-color-input label{width:100%;margin-bottom:5px}.color-gradient-maker-color-picker{width:50px;height:50px}.color-gradient-maker-hex-input{width:100%}.color-gradient-maker-modal-buttons{flex-direction:column;align-items:stretch}.color-gradient-maker-create-button,.color-gradient-maker-save-button{width:100%}}@media (max-width: 480px){.color-gradient-maker-container{padding:20px 15px}.color-gradient-maker-title{font-size:22px;margin-bottom:8px}.color-gradient-maker-description{font-size:14px;margin-bottom:20px}.color-gradient-maker-grid{width:100%;grid-template-columns:1fr;gap:20px}.color-gradient-maker-input-section{padding:12px}.color-gradient-maker-label{font-size:14px}.color-gradient-maker-select{font-size:13px;padding:7px}.color-gradient-maker-gradient{height:140px;border-radius:8px}.color-gradient-maker-css-code{font-size:12px;height:50px;padding:8px}.color-gradient-maker-copy-btn{padding:6px 12px;font-size:13px}.color-gradient-maker-actions{flex-direction:column;gap:8px}.color-gradient-maker-random-btn,.color-gradient-maker-create-btn,.color-gradient-maker-export-btn{padding:8px 16px;font-size:14px;width:100%}.color-gradient-maker-gradient-grid{grid-template-columns:1fr;gap:15px}.color-gradient-maker-gradient-card{height:110px}.color-gradient-maker-color-codes{font-size:10px;padding:3px 6px}.color-gradient-maker-modal{width:95%;padding:12px;max-height:80vh}.color-gradient-maker-modal-header h2{font-size:18px}.color-gradient-maker-color-inputs{max-height:35vh}.color-gradient-maker-hex-input{font-size:13px;padding:6px}.color-gradient-maker-modal-buttons{flex-direction:column;gap:8px}.color-gradient-maker-create-button,.color-gradient-maker-save-button{padding:7px 14px;font-size:14px}}@media (max-height: 480px) and (orientation: landscape){.color-gradient-maker-container{padding:15px}.color-gradient-maker-grid{grid-template-columns:1fr 1fr;gap:15px}.color-gradient-maker-gradient{height:120px}.color-gradient-maker-actions{margin-top:15px;flex-direction:row;flex-wrap:wrap}.color-gradient-maker-random-btn,.color-gradient-maker-create-btn,.color-gradient-maker-export-btn{width:auto;padding:6px 12px}.color-gradient-maker-modal{max-height:95vh;width:80%}.color-gradient-maker-color-inputs{max-height:60vh}}@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait){.color-gradient-maker-grid{gap:25px}.color-gradient-maker-gradient{height:200px}}@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape){.color-gradient-maker-grid{grid-template-columns:1fr 1fr}.color-gradient-maker-gradient-grid{grid-template-columns:repeat(auto-fill,minmax(350px,1fr))}}._brandWrapper_u97s5_1{width:100%;padding:20px;margin-top:25px;margin-bottom:50px;box-sizing:border-box}._header_u97s5_9{display:flex;justify-content:flex-end;margin-bottom:20px}._searchContainer_u97s5_15{position:relative;width:100%;max-width:300px}._searchContainer_u97s5_15 input{width:100%;max-width:200px;font-size:20px;padding:5px;border:1px solid black;border-radius:10px;box-sizing:border-box;margin-right:0}._searchIcon_u97s5_32{position:absolute;right:110px;top:50%;transform:translateY(-50%);cursor:pointer;font-size:25px;color:#000;margin-right:0}._noResultsOverlay_u97s5_43{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1001}._noResults_u97s5_43{color:red;font-size:clamp(18px,5vw,24px);padding:20px;background:#fff;border-radius:8px;box-shadow:0 4px 8px #0003;text-align:center;display:flex;justify-content:center;align-items:center;gap:10px;max-width:90%}._closeNoResultsBtn_u97s5_71{background:none;border:none;font-size:25px;cursor:pointer;color:#333;background-color:#cfc8c8;border-radius:50%;height:25px;width:25px;display:flex;align-items:center;justify-content:center}._closeNoResultsBtn_u97s5_71:hover{color:#000;background-color:red}._brandContainer_u97s5_91{width:100%;max-width:1200px;margin:0 auto;font-family:Arial,sans-serif;position:relative;z-index:1;min-height:400px;padding:0 10px;box-sizing:border-box}._brandItem_u97s5_103{display:flex;align-items:center;padding:10px 0;border-bottom:1px solid #e0e0e0;flex-wrap:wrap}._brandName_u97s5_111{width:100%;max-width:360px;color:#333;font-size:clamp(20px,4vw,28px);margin-right:20px;margin-bottom:10px}._colorBoxes_u97s5_120{margin-left:0;display:flex;gap:15px;flex-grow:1;flex-wrap:wrap;max-width:100%}._colorBox_u97s5_120{width:clamp(40px,10vw,50px);height:clamp(40px,10vw,50px);border:1px solid #ccc;background-size:cover;margin-bottom:5px}._colorCodeSection_u97s5_137{margin-left:20px}._colorCodeBtn_u97s5_141{padding:5px 10px;background-color:gray;color:#fff;border:none;cursor:pointer;border-radius:4px;font-size:clamp(16px,3vw,20px)}._colorCodeBtn_u97s5_141:hover{transition:.4s;color:#000;background-color:#ff8c5a}._modal_u97s5_157{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}._modalContent_u97s5_170{background:#fff;padding:20px;border-radius:8px;width:90%;max-width:600px;box-shadow:0 4px 8px #0003;position:relative;text-align:center}._modalHeader_u97s5_181{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;border-bottom:1px solid #ccc;padding-bottom:10px}._modalHeader_u97s5_181 h3{margin:0;color:#333;font-size:clamp(16px,3vw,18px)}._closeBtn_u97s5_196{background:none;border:none;font-size:25px;cursor:pointer;color:#333;background-color:#cfc8c8;border-radius:50%;height:25px;width:25px}._closeBtn_u97s5_196:hover{color:#000;background-color:red}._modalColors_u97s5_213{display:flex;gap:10px;margin-bottom:20px;justify-content:center;flex-wrap:wrap;max-width:100%}._colorBoxModal_u97s5_222{width:clamp(40px,10vw,50px);height:clamp(40px,10vw,50px);border:1px solid #ccc;border-radius:4px;margin-bottom:10px}._modalDownload_u97s5_230{display:flex;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap;gap:10px}._downloadBtn_u97s5_238{padding:10px 20px;background-color:#6c757d;color:#fff;border:none;border-radius:25px;cursor:pointer;font-size:clamp(12px,2.5vw,14px);flex:1;margin:0}._downloadBtn_u97s5_238:hover{background-color:green}._modalPreviewContent_u97s5_254 h4{margin:0 0 10px;color:#333;font-size:clamp(14px,2.5vw,16px)}._previewBox_u97s5_260{border:1px solid #ccc;padding:15px;border-radius:5px;width:100%;max-width:550px;max-height:200px;overflow-y:auto;display:inline-block;text-align:left;font-size:clamp(11px,2vw,13px)}._codePreview_u97s5_273 pre{margin:0;padding:0;flex-grow:1;overflow-y:auto;box-sizing:border-box;word-wrap:break-word;white-space:pre-wrap}._previewImage_u97s5_284{width:100%;height:60px;border-radius:4px;overflow:hidden;display:inline-block}._previewImage_u97s5_284 img{width:100%;height:100%;object-fit:contain}._downloadConfirmBtn_u97s5_298{font-size:clamp(13px,2.5vw,15px);padding:10px 20px;background-color:#6c757d;color:#fff;border:none;border-radius:4px;cursor:pointer;width:fit-content;margin:10px auto 15px}._downloadConfirmBtn_u97s5_298:hover{background-color:#ff8c5a}._modalDownloadOptions_u97s5_317{display:flex;justify-content:center;gap:20px;margin:10px 0;flex-wrap:wrap}._downloadOptionBtn_u97s5_325{padding:10px 20px;background-color:#6c757d;color:#fff;border:none;border-radius:25px;cursor:pointer;font-size:clamp(12px,2.5vw,14px)}._downloadOptionBtn_u97s5_325:hover{background-color:green}@media (max-width: 1200px){._brandContainer_u97s5_91{max-width:100%;padding:0 15px}._searchContainer_u97s5_15{max-width:250px}._searchContainer_u97s5_15 input{max-width:100%}._searchIcon_u97s5_32{right:10px}._brandItem_u97s5_103{flex-direction:column;align-items:flex-start}._brandName_u97s5_111{max-width:100%;margin-right:0}._colorCodeSection_u97s5_137{margin-left:0;margin-top:10px}._modalContent_u97s5_170{width:95%}}@media (max-width: 768px){._brandWrapper_u97s5_1{padding:15px}._header_u97s5_9{justify-content:center}._searchContainer_u97s5_15{max-width:100%}._searchContainer_u97s5_15 input{font-size:16px;padding:5px 30px 5px 10px}._searchIcon_u97s5_32{right:10px;font-size:20px}._brandName_u97s5_111{font-size:clamp(18px,4vw,24px)}._colorBox_u97s5_120{width:40px;height:40px}._colorCodeBtn_u97s5_141{font-size:16px;padding:4px 8px}._modalContent_u97s5_170{padding:15px}._modalHeader_u97s5_181 h3{font-size:16px}._colorBoxModal_u97s5_222{width:40px;height:40px}._modalDownload_u97s5_230{flex-direction:column;gap:8px}._downloadBtn_u97s5_238{font-size:12px;padding:8px 15px}._previewBox_u97s5_260{max-width:100%;max-height:150px;font-size:11px}._downloadConfirmBtn_u97s5_298{font-size:13px;padding:8px 15px}._modalDownloadOptions_u97s5_317{gap:10px}._downloadOptionBtn_u97s5_325{font-size:12px;padding:8px 15px}._noResults_u97s5_43{font-size:18px;padding:15px}}@media (max-width: 480px){._brandWrapper_u97s5_1{padding:10px}._searchContainer_u97s5_15 input{font-size:14px;padding:4px 25px 4px 8px}._searchIcon_u97s5_32{right:8px;font-size:18px}._brandName_u97s5_111{font-size:clamp(16px,4vw,20px)}._colorBox_u97s5_120{width:35px;height:35px}._colorCodeBtn_u97s5_141{font-size:14px;padding:3px 6px}._modalContent_u97s5_170{padding:10px}._modalHeader_u97s5_181 h3{font-size:14px}._colorBoxModal_u97s5_222{width:35px;height:35px}._downloadBtn_u97s5_238{font-size:11px;padding:6px 12px}._previewBox_u97s5_260{padding:10px;max-height:120px;font-size:10px}._downloadConfirmBtn_u97s5_298{font-size:12px;padding:6px 12px}._downloadOptionBtn_u97s5_325{font-size:11px;padding:6px 12px}._noResults_u97s5_43{font-size:16px;padding:10px}._closeNoResultsBtn_u97s5_71{font-size:20px;height:20px;width:20px}}._container_12m9n_1{padding:40px;font-family:Poppins,sans-serif;width:1200px;margin:0 auto 20px;border-radius:15px;position:relative}@keyframes _fadeIn_12m9n_1{0%{opacity:0}to{opacity:1}}._title_12m9n_20{text-align:center;font-size:2.5em;margin-bottom:30px;text-transform:uppercase;letter-spacing:1px}._inputSection_12m9n_28{display:flex;justify-content:center;align-items:center;gap:15px;margin-bottom:40px}._colorPicker_12m9n_36{padding:5px;width:150px;height:150px;border:none;cursor:pointer;border-radius:5px;background:#fff;box-shadow:0 2px 5px #0000001a}._colorInput_12m9n_47{padding:12px 20px;font-size:1em;border:1px solid #fdd5b1;border-radius:25px;outline:none;transition:border-color .3s ease}._colorInput_12m9n_47:focus{border-color:#ff8c5a}._randomButton_12m9n_60{padding:12px 25px;font-size:1em;background-color:gray;color:#fff;border:none;border-radius:25px;cursor:pointer;transition:background-color .3s ease,transform .2s ease}._randomButton_12m9n_60:hover{background-color:#ff8c5a;transform:scale(1.05)}._shadeSection_12m9n_76{margin-bottom:40px;text-align:center}._sliderLabel_12m9n_81{display:flex;align-items:center;justify-content:center;gap:15px;font-size:1.3em;margin-bottom:20px}._slider_12m9n_81{width:200px;accent-color:green}._sliderValue_12m9n_95{font-weight:700;color:#e74c3c;background-color:#bfbcbc;justify-content:center;align-items:center;display:flex;width:40px;height:40px}._shades_12m9n_107{display:flex;max-width:900px;margin-left:auto;margin-right:auto;margin-top:20px;padding:10px;border-radius:10px;box-shadow:0 5px 15px #0000001a}._shade_12m9n_76{flex:1;height:60px;cursor:pointer;border:1px solid #ecf0f1;transition:transform .2s ease,box-shadow .2s ease}._shade_12m9n_76:hover{transform:scale(1.1)}._colorDetails_12m9n_130{display:flex;flex-direction:column;align-items:center;gap:20px;padding:20px;border-radius:10px;box-shadow:0 5px 15px #0000001a;width:100%}._colorDetailsContent_12m9n_140{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:40px;width:100%;max-width:900px}._detailTitle_12m9n_150{font-size:1.8em;margin-bottom:10px}._colorBox_12m9n_155{width:250px;height:250px;border:1px solid grey;border-radius:5px;cursor:pointer}._colorInfo_12m9n_163{text-align:left;font-size:1.1em;display:flex;flex-direction:column;gap:10px;flex:1}._colorInfo_12m9n_163 p{margin:10px 0;padding:5px 15px;background:#f9f9f9;border-radius:5px;display:flex;align-items:center;justify-content:center;gap:10px;transition:background .3s ease}._copyIcon_12m9n_184{cursor:pointer;color:gray;transition:color .3s ease}._copyIcon_12m9n_184:hover{color:green}._exportButton_12m9n_194{padding:12px 25px;margin-left:250px;font-size:1em;background-color:gray;color:#fff;border:none;border-radius:25px;cursor:pointer;transition:background-color .3s ease,transform .2s ease;display:flex;align-items:center;justify-content:center;width:fit-content;align-self:flex-start}._exportButton_12m9n_194:hover{background-color:green;transform:scale(1.05)}._popup_12m9n_216{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}._popupContent_12m9n_229{background-color:#fff;padding:20px;border-radius:10px;position:relative;width:500px;text-align:center;box-shadow:0 5px 15px #0000004d;max-height:80vh;overflow-y:auto}._closeButton_12m9n_241{position:absolute;top:10px;right:10px;background:none;border:none;font-size:1.9em;cursor:pointer;color:#000}._closeButton_12m9n_241{background-color:gray;width:30px;height:30px;color:#000;border-radius:50%}._closeButton_12m9n_241:hover{background-color:red}._colorSquares_12m9n_262{display:flex;justify-content:center;gap:10px;margin:20px 0}._square_12m9n_269{width:50px;height:50px;border:1px solid #ccc}._previewSection_12m9n_275{margin:20px 0;padding:10px;display:none}._previewBar_12m9n_282{display:flex;height:100px}._previewSegment_12m9n_287{flex:1}._previewImage_12m9n_291{max-width:100%;margin-top:10px}._formatButtons_12m9n_296{display:flex;justify-content:center;gap:10px;margin:20px 0}._formatButton_12m9n_296{padding:10px 20px;font-size:1em;background-color:gray;color:#fff;border:none;border-radius:20px;cursor:pointer;transition:background-color .3s ease}._formatButton_12m9n_296:hover{background-color:green}._previewContainer_12m9n_318{margin:20px 0;padding:10px}._codeBlock_12m9n_323{background-color:#f4f4f4;padding:10px;max-height:200px;overflow-y:auto;border-radius:5px;white-space:pre-wrap;text-align:left;margin:10px 0}._svgPreview_12m9n_334{margin:10px 0}._downloadButton_12m9n_338{padding:10px 20px;font-size:1em;background-color:gray;color:#fff;border:none;border-radius:20px;cursor:pointer;transition:background-color .3s ease;margin-top:10px}._downloadButton_12m9n_338:hover{background-color:#ff8c5a}._shadesPreview_12m9n_353{display:none;width:100%;height:20px}._shadesPreview_12m9n_353 ._shade_12m9n_76{flex:1}._modeToggle_12m9n_362{padding:10px;font-size:1em;background-color:#6c757d;color:#fff;border:none;border-radius:50%;cursor:pointer;transition:background-color .3s ease,transform .2s ease;margin:10px auto;display:flex;align-items:center;justify-content:center;width:40px;height:40px}._modeToggle_12m9n_362:hover{background-color:#5a6268;transform:scale(1.1)}._modeToggle_12m9n_362:active{transform:scale(.95)}@media (max-width: 768px){._container_12m9n_1{padding:20px;width:100%;max-width:1200px}._title_12m9n_20{font-size:2em;margin-bottom:20px}._inputSection_12m9n_28{flex-direction:column;gap:10px;margin-bottom:30px}._colorPicker_12m9n_36{width:120px;height:120px}._colorInput_12m9n_47{padding:10px 15px;font-size:.9em}._randomButton_12m9n_60{padding:10px 20px;font-size:.9em}._shadeSection_12m9n_76{margin-bottom:30px}._sliderLabel_12m9n_81{font-size:1.1em;gap:10px;margin-bottom:15px}._slider_12m9n_81{width:180px}._sliderValue_12m9n_95{width:35px;height:35px}._shades_12m9n_107{max-width:100%;padding:8px}._shade_12m9n_76{height:50px}._colorDetails_12m9n_130{padding:15px}._colorDetailsContent_12m9n_140{flex-direction:column;gap:20px;max-width:100%}._detailTitle_12m9n_150{font-size:1.5em}._colorBox_12m9n_155{width:200px;height:200px}._colorInfo_12m9n_163{font-size:1em}._exportButton_12m9n_194{margin-left:0;align-self:center}._popupContent_12m9n_229{width:90%;max-width:500px}._closeButton_12m9n_241{font-size:1.5em;width:25px;height:25px}._colorSquares_12m9n_262{gap:8px;margin:15px 0}._square_12m9n_269{width:40px;height:40px}._formatButtons_12m9n_296{gap:8px;flex-wrap:wrap}._formatButton_12m9n_296,._downloadButton_12m9n_338{padding:8px 15px;font-size:.9em}._modeToggle_12m9n_362{width:35px;height:35px;font-size:.9em}}@media (max-width: 480px){._container_12m9n_1{padding:15px;width:100%;border-radius:10px;margin-bottom:15px}._title_12m9n_20{font-size:1.8em;margin-bottom:15px;letter-spacing:.5px}._inputSection_12m9n_28{gap:8px;margin-bottom:20px}._colorPicker_12m9n_36{width:100px;height:100px}._colorInput_12m9n_47{padding:8px 12px;font-size:.8em;width:100%;max-width:200px}._randomButton_12m9n_60{padding:8px 15px;font-size:.8em}._shadeSection_12m9n_76{margin-bottom:20px}._sliderLabel_12m9n_81{font-size:1em;gap:8px;margin-bottom:10px;flex-wrap:wrap}._slider_12m9n_81{width:100%;max-width:200px}._sliderValue_12m9n_95{width:30px;height:30px;font-size:.9em}._shades_12m9n_107{padding:5px;margin-top:15px}._shade_12m9n_76{height:40px}._colorDetails_12m9n_130{padding:10px}._colorDetailsContent_12m9n_140{gap:15px}._detailTitle_12m9n_150{font-size:1.3em}._colorBox_12m9n_155{width:150px;height:150px}._colorInfo_12m9n_163{font-size:.9em;gap:8px}._colorInfo_12m9n_163 p{margin:8px 0;padding:5px 10px}._exportButton_12m9n_194{padding:10px 20px;font-size:.8em;align-self:center}._popupContent_12m9n_229{width:90%;padding:15px;max-height:70vh}._closeButton_12m9n_241{font-size:1.3em;width:20px;height:20px}._colorSquares_12m9n_262{gap:5px;margin:10px 0}._square_12m9n_269{width:35px;height:35px}._previewBar_12m9n_282{height:80px}._formatButtons_12m9n_296{gap:5px;margin:15px 0}._formatButton_12m9n_296{padding:6px 12px;font-size:.8em}._previewContainer_12m9n_318{padding:5px}._codeBlock_12m9n_323{padding:8px;max-height:150px}._downloadButton_12m9n_338{padding:6px 12px;font-size:.8em;margin-top:5px}._modeToggle_12m9n_362{width:30px;height:30px;font-size:.8em;padding:8px}}._symbolSelector_1g1et_1{padding:40px;font-family:Poppins,sans-serif;max-width:1200px;margin:20px auto;border-radius:15px}._headerTitles_1g1et_11{text-align:center;margin-bottom:30px}._headerTitles_1g1et_11 h1{font-size:2.5em;color:#34495e;margin-bottom:10px}._headerTitles_1g1et_11 p{font-size:1.2em;color:#7f8c8d}._categorySelector_1g1et_27{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:30px}._categoryBtn_1g1et_35{padding:12px 25px;font-size:1em;background-color:#ecf0f1;color:#34495e;border:none;border-radius:25px;cursor:pointer;transition:background-color .3s ease,transform .2s ease}._categoryBtn_1g1et_35:hover{background-color:#ff8c5a;color:#fff;transform:scale(1.05)}._categoryBtn_1g1et_35._active_1g1et_52{background-color:#ff8c5a;color:#fff}._codeInputs_1g1et_57{display:flex;flex-direction:column;gap:15px;margin-bottom:30px;padding:0 20px}._inputGroup_1g1et_65{display:flex;align-items:center;gap:10px}._inputGroup_1g1et_65 label{font-size:1em;font-weight:500;min-width:100px}._inputWrapper_1g1et_77{position:relative;display:flex;align-items:center;width:200px}._inputWrapper_1g1et_77 input{width:100%;padding:8px 30px 8px 10px;font-size:1.1em;background:#ecf0f1;border:none;border-radius:8px;color:#2c3e50;cursor:pointer;transition:background-color .3s ease}._inputWrapper_1g1et_77 input:hover{background:#dfe6e9}._inputWrapper_1g1et_77 input:focus{outline:none;box-shadow:0 0 5px #ff8c5a80}._copyIcon_1g1et_105{position:absolute;right:10px;color:#525151;font-size:1.2em;cursor:pointer;transition:color .3s ease}._copyIcon_1g1et_105:hover{color:#e67e22}._symbolsContainer_1g1et_118{background:#fff;border-radius:10px;box-shadow:0 5px 15px #0000000d;padding:20px}._symbolsGrid_1g1et_125{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(6,50px);gap:10px}._symbol_1g1et_1{display:flex;align-items:center;justify-content:center;height:50px;background:#ecf0f1;border-radius:8px;cursor:pointer;transition:background-color .3s ease,transform .2s ease}._symbol_1g1et_1:hover{background-color:#ff8c5a;transform:scale(1.1)}._symbol_1g1et_1._selected_1g1et_148{background-color:#ff8c5a;color:#fff;border:2px solid #e67e22}._symbolChar_1g1et_154{font-size:1.5em}._noIconText_1g1et_158{font-size:.8em;color:#7f8c8d;font-weight:400}._pagination_1g1et_164{display:flex;align-items:center;justify-content:center;gap:15px;margin-top:20px}._pageBtn_1g1et_172{width:40px;height:40px;background:#ff8c5a;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.2em;transition:background-color .3s ease}._pageBtn_1g1et_172:hover{background:#e67e22}._pageBtn_1g1et_172:disabled{background:#bdc3c7;cursor:not-allowed}._pageInfo_1g1et_196{font-size:1em;color:#34495e;font-weight:500}@media (max-width: 768px){._symbolSelector_1g1et_1{padding:20px}._headerTitles_1g1et_11{margin-bottom:20px}._headerTitles_1g1et_11 h1{font-size:2em}._headerTitles_1g1et_11 p{font-size:1em}._categorySelector_1g1et_27{gap:8px;margin-bottom:20px}._categoryBtn_1g1et_35{padding:10px 20px;font-size:.9em}._codeInputs_1g1et_57{gap:12px;margin-bottom:20px;padding:0 10px}._inputGroup_1g1et_65 label{min-width:80px;font-size:.9em}._inputWrapper_1g1et_77{width:180px}._inputWrapper_1g1et_77 input{font-size:.9em}._symbolsContainer_1g1et_118{padding:15px}._symbolsGrid_1g1et_125{grid-template-columns:repeat(10,1fr);gap:8px}._symbol_1g1et_1{height:45px}._symbolChar_1g1et_154{font-size:1.3em}._pagination_1g1et_164{gap:10px;margin-top:15px}._pageBtn_1g1et_172{width:35px;height:35px;font-size:1em}._pageInfo_1g1et_196{font-size:.9em}}@media (max-width: 480px){._symbolSelector_1g1et_1{padding:10px}._headerTitles_1g1et_11{margin-bottom:15px}._headerTitles_1g1et_11 h1{font-size:1.8em}._headerTitles_1g1et_11 p{font-size:.9em}._categorySelector_1g1et_27{gap:5px;margin-bottom:15px}._categoryBtn_1g1et_35{padding:8px 15px;font-size:.8em}._codeInputs_1g1et_57{gap:10px;margin-bottom:15px;padding:0 5px}._inputGroup_1g1et_65{flex-direction:column;align-items:flex-start;gap:5px}._inputGroup_1g1et_65 label{min-width:unset;font-size:.8em}._inputWrapper_1g1et_77{width:100%}._inputWrapper_1g1et_77 input{font-size:.8em}._copyIcon_1g1et_105{font-size:1em}._symbolsContainer_1g1et_118{padding:10px}._symbolsGrid_1g1et_125{grid-template-columns:repeat(6,1fr);gap:5px}._symbol_1g1et_1{height:40px}._symbolChar_1g1et_154{font-size:1.2em}._noIconText_1g1et_158{font-size:.7em}._pagination_1g1et_164{gap:5px;margin-top:10px}._pageBtn_1g1et_172{width:30px;height:30px;font-size:.9em}._pageInfo_1g1et_196{font-size:.8em}}.color-comparison-container{max-width:1150px;margin:20px auto 23px;padding:20px;font-family:Arial,sans-serif}.color-comparison-container h2,.color-comparison-container h3,.color-comparison-container h4,.color-comparison-container h5{margin:0 0 15px}.color-inputs{display:flex;flex-wrap:wrap;gap:60px;margin-bottom:20px}.color-section{flex:1;min-width:200px}.color-section label{display:block;margin-bottom:5px;font-weight:700}.color-section input[type=color]{width:100%;height:50px;padding:0;border:1px solid grey;cursor:pointer}.color-formats{margin-top:10px}.format-item{display:flex;align-items:center;margin:5px 0}.format-label{width:40px;font-weight:700;color:#666}.format-value{flex:1;display:flex;align-items:center;justify-content:space-between;padding:5px;background:#f5f5f5;border-radius:4px}.format-value button{background:none;border:none;padding:5px;cursor:pointer;color:#666;transition:color .3s}.format-value button:hover{color:#333}.suggestions-section{margin-bottom:20px}.suggestions-section button{display:flex;align-items:center;justify-content:center;margin:0 auto;background:gray;color:#fff;border:none;padding:10px 15px;border-radius:4px;cursor:pointer;transition:background .3s}.suggestions-section button:hover{background:#ff8c5a}.suggestions-container{margin-top:10px;padding:15px;background:#f9f9f9;border-radius:4px}.suggestions-grid{display:flex;flex-wrap:wrap;gap:20px;position:relative}.suggestions-grid:after{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:#ccc;transform:translate(-50%)}.suggestion-group{flex:1;min-width:200px;padding:0 10px}.suggestion-item{display:flex;align-items:center;margin:5px 0}.suggestion-item span{flex:1;margin-right:10px}.color-swatch{width:30px;height:30px;border:1px solid #ddd;border-radius:4px;cursor:pointer}.text-size-section{margin-bottom:25px;display:flex;align-items:center;gap:10px}.text-size-section label{margin-bottom:0;font-weight:700;white-space:nowrap}.text-size-section select{width:100%;max-width:150px;padding:8px;border:1px solid #ccc;border-radius:10px;font-size:16px;cursor:pointer;height:35px}.sample-text-container{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:20px;height:100px}.sample-text{flex:1;min-width:200px;padding:20px;text-align:center;border:1px solid #ddd;border-radius:4px;display:flex;align-items:center;justify-content:center}.text-small{font-size:1rem}.text-medium{font-size:1.25rem}.text-large{font-size:1.5rem}.contrast-info{margin-bottom:20px;margin-top:30px}.contrast-content p{font-size:18px}.contrast-info .contrast-content{justify-content:center;display:flex;align-items:center;gap:20px}.contrast-info p{margin:0}.rating-aaa,.rating-aa,.rating-a,.rating-fail{padding:5px 10px;border-radius:4px;font-weight:700;margin:0}.rating-aaa{background:#d4edda;color:#155724}.rating-aa{background:#cce5ff;color:#004085}.rating-a{background:#fff3cd;color:#856404}.rating-fail{background:#f8d7da;color:#721c24}.favorites-section{margin-top:30px}.favorites-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.favorites-header h3{font-size:20px}.favorites-header button{background:#28a745;color:#fff;border:none;padding:10px 15px;border-radius:4px;cursor:pointer;transition:background .3s}.favorites-header button:hover{background:#218838}.favorites-list p{margin:0;font-weight:700;color:#333;font-size:20px;color:red;background-color:#ff0;width:fit-content}.favorites-list{display:flex;flex-direction:column;gap:10px}.favorite-item{display:flex;align-items:center;justify-content:space-between;padding:10px;background:#f9f9f9;border-radius:4px}.favorite-swatches{display:flex;gap:5px}.favorite-details{display:flex;align-items:center;gap:10px}.favorite-details button{background:gray;color:#fff;border:none;padding:5px 10px;border-radius:4px;cursor:pointer;transition:background .3s}.favorite-details button:hover{background:#ff8c5a;color:#000}@media (max-width: 1024px){.color-comparison-container{max-width:900px;padding:15px}.color-inputs{gap:40px}.suggestions-grid{gap:15px}.suggestion-group{min-width:180px}.sample-text-container,.contrast-info .contrast-content{gap:15px}.favorites-header{flex-direction:row;align-items:center;gap:10px}.favorites-list{gap:8px}.favorite-item{flex-direction:row;align-items:center;gap:10px;padding:8px}.favorite-swatches,.favorite-details{width:auto}.favorite-details{display:flex;justify-content:flex-start;align-items:center;gap:15px}}@media (max-width: 767px){.color-comparison-container{max-width:100%;padding:10px}.color-inputs{flex-direction:column;gap:20px}.favorites-header h3{font-size:18px;margin-top:15px}.color-section{min-width:100%}.suggestions-grid{flex-direction:column;gap:10px}.suggestion-group{min-width:100%;padding:0}.suggestions-grid:after{display:none}.text-size-section{flex-direction:column;gap:5px;align-items:flex-start}.text-size-section select{max-width:100%}.sample-text-container{flex-direction:column;height:auto;gap:10px}.sample-text{min-width:100%;padding:15px}.contrast-info .contrast-content{flex-direction:column;gap:10px;align-items:center}.favorites-header{flex-direction:row;align-items:center;gap:10px}.favorites-list{gap:6px}.favorite-item{flex-direction:row;align-items:center;gap:5px;padding:6px;flex-wrap:wrap}.favorite-swatches{width:auto;flex-shrink:0}.favorite-details{width:auto;display:flex;justify-content:flex-start;align-items:center;gap:15px;flex-shrink:0}}._container_16vmn_1{max-width:1200px;margin:0 auto 20px;padding:1rem;text-align:center}._title_16vmn_9{font-size:1.8rem;font-weight:600;margin-bottom:1rem}._controls_16vmn_15{display:flex;justify-content:center;align-items:center;gap:1rem;margin-bottom:1rem}._cameraButton_16vmn_23{padding:.5rem 1rem;background-color:#8a2be2;color:#fff;border:none;border-radius:50%;height:50px;cursor:pointer;transition:background-color .3s ease}._cameraButton_16vmn_23:hover{color:#000;background-color:#ff8c5a}._cameraButton_16vmn_23:disabled{background-color:#6b7280;cursor:not-allowed}._clearButton_16vmn_45{padding:.5rem 1rem;background-color:#a35f57;color:#fff;border:none;border-radius:15px;cursor:pointer;transition:background-color .3s ease;display:flex;align-items:center;gap:.5rem;height:45px;margin-top:8px}._clearButton_16vmn_45:hover{background-color:red}._loading_16vmn_64{font-size:1.2rem}._error_16vmn_68{color:#e74c3c;background-color:#fadbd8;padding:.5rem 1rem;border-radius:4px;margin:1rem 0;text-align:center}._cameraSection_16vmn_77,._cameraSectionWithLayout_16vmn_84{display:flex;flex-direction:column;align-items:center;gap:1rem}._previewArea_16vmn_91{position:relative;width:600px;height:400px;background-color:#000;border-radius:8px;border:1px solid #e5e7eb;overflow:hidden;flex-shrink:0}._video_16vmn_102{width:100%;height:100%;object-fit:cover;position:absolute;top:0;left:0}._capturedImage_16vmn_111{width:100%;height:100%;object-fit:cover;position:absolute;top:0;left:0;border-radius:8px}._canvas_16vmn_121{display:none}._captureButton_16vmn_125{padding:.5rem 1rem;background-color:#8a2be2;color:#fff;border:none;border-radius:10px;cursor:pointer;transition:background-color .3s ease}._captureButton_16vmn_125:hover{background-color:#45a049;transform:scale(1.03);transition:.4s}._captureButton_16vmn_125:disabled{background-color:#6b7280;cursor:not-allowed}._newPhotoButton_16vmn_146{padding:.5rem 1rem;background-color:#8a2be2;height:45px;color:#fff;border:none;border-radius:15px;cursor:pointer;transition:background-color .3s ease;margin-top:.5rem}._newPhotoButton_16vmn_146:hover{background-color:green}._buttonGroup_16vmn_162{display:flex;gap:1rem;margin-top:.5rem}._colorPaletteContainer_16vmn_168{flex-grow:1;width:900px}._colorHeader_16vmn_173{font-size:2rem;color:#2c3e50;margin-bottom:.5rem}._colorPaletteGrid_16vmn_179{border:1px solid grey;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;max-height:350px;overflow-y:auto;padding:.5rem;background-color:#f9f9f9;border-radius:8px;scrollbar-width:none;-ms-overflow-style:none}._colorCard_16vmn_193{display:flex;flex-direction:column;border:1px solid grey;border-radius:10px;height:150px;overflow:hidden;text-align:center;font-size:.9rem}._colorHalf_16vmn_204{height:60%;border-radius:10px 10px 0 0;border-bottom:1px solid grey}._colorDetails_16vmn_210{height:50%;display:flex;flex-direction:column;justify-content:center;padding:.25rem;background-color:#fff}._colorCode_16vmn_219{display:flex;align-items:center;justify-content:center;gap:.25rem}._colorCode_16vmn_219 span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}._copyButton_16vmn_232{padding:0;background:none;border:none;cursor:pointer;font-size:1rem}._copyIcon_16vmn_240{color:#000;transition:color .2s ease}._copyIcon_16vmn_240:hover{color:#ff8c5a}._instructions_16vmn_249{font-size:.9rem;color:#6b7280;margin-top:1rem}._recentImages_16vmn_255{margin-top:2rem;width:900px;display:block;height:550px}._recentImages_16vmn_255 h3{font-size:1.5rem;margin-bottom:1rem}._recentImageGrid_16vmn_267{margin:0 auto;width:fit-content;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr);gap:.5rem;justify-content:center}._recentImage_16vmn_255{width:100%;height:150px;object-fit:cover;border-radius:4px;border:1px solid grey;cursor:pointer;transition:transform .2s ease}._recentImage_16vmn_255:hover{transform:scale(1.02)}._note_16vmn_291{color:red;font-size:15px}._error_16vmn_68{color:red;background:#ffe6e6;padding:10px;border-radius:5px;margin:10px 0;display:flex;justify-content:space-between;align-items:center}._clearButtonInline_16vmn_305{background:#ff4d4d;color:#fff;border:none;padding:5px 10px;border-radius:3px;cursor:pointer}@media (max-width: 1000px){._cameraSectionWithLayout_16vmn_84{flex-direction:column;align-items:center}._previewArea_16vmn_91{width:100%;height:300px}._buttonGroup_16vmn_162{flex-direction:column;gap:.5rem}._newPhotoButton_16vmn_146,._clearButton_16vmn_45{width:100%}._recentImages_16vmn_255{max-width:100%}._recentImageGrid_16vmn_267{grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(2,1fr)}._colorPaletteGrid_16vmn_179{max-height:150px;grid-template-columns:repeat(5,1fr)}._colorCard_16vmn_193{height:120px}._colorHalf_16vmn_204,._colorDetails_16vmn_210{height:50%}}@media (max-width: 768px){._container_16vmn_1{padding:.5rem}._title_16vmn_9{font-size:1.5rem}._controls_16vmn_15{flex-direction:column;gap:.75rem}._previewArea_16vmn_91{width:100%;height:250px}._colorPaletteContainer_16vmn_168{width:100%}._colorPaletteGrid_16vmn_179{grid-template-columns:repeat(3,1fr);max-height:200px}._recentImageGrid_16vmn_267{grid-template-columns:repeat(3,1fr)}._recentImages_16vmn_255{width:100%;height:auto}._recentImage_16vmn_255{height:120px}}@media (max-width: 480px){._container_16vmn_1{padding:.25rem}._title_16vmn_9{font-size:1.2rem}._controls_16vmn_15{gap:.5rem}._cameraButton_16vmn_23{height:60px;width:60px}._clearButton_16vmn_45,._newPhotoButton_16vmn_146{height:40px;font-size:.9rem}._captureButton_16vmn_125{padding:.4rem .8rem;font-size:.9rem}._previewArea_16vmn_91{width:100%;height:200px}._colorPaletteGrid_16vmn_179{grid-template-columns:repeat(2,1fr);max-height:250px}._colorCard_16vmn_193{height:120px;font-size:.8rem}._recentImageGrid_16vmn_267{grid-template-columns:repeat(2,1fr)}._recentImage_16vmn_255{height:100px}._instructions_16vmn_249{font-size:.8rem}._colorHeader_16vmn_173{font-size:1.5rem}}@media (max-width: 320px){._title_16vmn_9{font-size:1rem}._previewArea_16vmn_91{height:150px}._colorPaletteGrid_16vmn_179{grid-template-columns:1fr}._colorCard_16vmn_193{height:60px}._recentImageGrid_16vmn_267{grid-template-columns:1fr}._recentImage_16vmn_255{height:80px}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;line-height:1.6;background-color:#fff;-ms-overflow-style:none;scrollbar-width:none;overflow-y:auto}html,body{margin:0;padding:0;width:100%;overflow-x:hidden;box-sizing:border-box}#root{width:100%;max-width:100%;margin:0;padding:0;overflow-x:hidden;box-sizing:border-box}body::-webkit-scrollbar{display:none}@media (max-width: 474px){.color-box{border-width:1px;box-shadow:1px 1px 4px #0000001a}}@media (max-width: 375px){.color-box{border-width:.5px;box-shadow:.5px .5px 2px #0000001a}}