body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}body,html{overflow-x:hidden}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.navbar{background:#fff;position:-webkit-sticky;position:sticky;top:0;z-index:999}.topBanner{background-color:#f37f20;color:#fff;font-size:15px;padding:10px;text-align:center}.navbarContainer{margin:0 auto;max-width:1200px;padding:5px 20px}.navbarContent{align-items:center;border-bottom:2px solid #a5a5a5;display:flex;height:65px;justify-content:space-between}.navLogo{display:flex;flex:1 1}.logoImage{cursor:pointer;height:65px}.navLinks{align-items:center;display:flex;flex:1 1;gap:40px;justify-content:center}.navLink{color:#444;font-size:18px;font-weight:600;padding-bottom:4px;position:relative;text-decoration:none;transition:color .2s ease;white-space:nowrap}.navLink:after{background:#f37f20;border-radius:2px;bottom:0;content:"";height:2px;left:0;position:absolute;transition:width .25s ease;width:0}.navLink:hover,.navLinkActive{color:#f37f20}.navLink:hover:after,.navLinkActive:after{width:100%}.navIcon{align-items:center;display:flex;flex:1 1;gap:20px;justify-content:flex-end}.iconBtn{background:none;border:none;cursor:pointer;padding:10px}.icon{height:30px;width:30px}.mobileMenuBtn{background:#fff;border:2px solid #f37f20;border-radius:10px;color:#f37f20;cursor:pointer;display:none;font-size:24px;font-weight:700;padding:5px 14px}.mobileBottomNav,.mobileMenu{display:none}@media screen and (max-width:768px){.navbarContainer{padding:0 15px}.navIcon,.navLinks{display:none}.mobileMenuBtn{display:block}.mobileMenu{display:flex;flex-direction:column;gap:15px;padding:20px 0}.mobileNavBtn{background:#fff4ee;border:2px solid #f37f20;border-radius:10px;color:#f37f20;cursor:pointer;font-size:16px;font-weight:700;margin:0 5vh;padding:10px;text-align:center}.logoImage{height:55px}.mobileBottomNav{align-items:center;background-color:#fff;bottom:0;box-shadow:0 -2px 10px #0000001a;display:flex;height:68px;justify-content:space-around;left:0;padding-bottom:env(safe-area-inset-bottom);position:fixed;width:100%;z-index:1000}.bottomNavItem{align-items:center;background:none;border:none;color:#666;cursor:pointer;display:flex;flex:1 1;flex-direction:column;font-size:11px;font-weight:500;gap:3px;justify-content:center;text-decoration:none;transition:color .2s ease}.bottomNavIcon{height:24px;width:24px}.bottomNavActive{color:#f37f20;font-weight:700}.bottomNavCameraWrapper{flex:1.2 1;flex-direction:column;position:relative;top:-12px}.bottomNavCameraBtn,.bottomNavCameraWrapper{align-items:center;display:flex;justify-content:center}.bottomNavCameraBtn{background:linear-gradient(135deg,#f37f20,#e06808);border:4px solid #fff;border-radius:50%;box-shadow:0 4px 8px #f37f2066;color:#fff;cursor:pointer;height:54px;transition:transform .2s ease;width:54px}.bottomNavCameraBtn:active{transform:scale(.92)}.cameraIcon{height:26px;width:26px}.cameraLabel{color:#f37f20;font-size:11px;font-weight:600;margin-top:2px}}.scCamOverlay{align-items:center;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:#111827b3;box-sizing:border-box;height:100vh;padding:16px;width:100vw;z-index:2000}.scCamCard{border-radius:24px;box-shadow:0 20px 40px #0000004d,0 0 0 1px #0000000d;box-sizing:border-box;display:flex;flex-direction:column;gap:16px;max-height:88vh;max-width:400px;overflow-y:auto;padding:24px 20px}.scCloseBtn{align-items:center;background:#f3f4f6;border-radius:50%;color:#4b5563;display:flex;font-size:18px;font-weight:700;height:32px;justify-content:center;right:16px;top:16px;transition:background .15s ease,transform .1s ease;width:32px;z-index:10}.scCloseBtn:active{background:#e5e7eb;transform:scale(.9)}.scRgbTitle{color:#111827;font-size:20px;margin:0;text-align:center}.scRgbSubtitle{color:#6b7280;margin:-10px 0 0;text-align:center}.scCamAccuracyNote{background:#fffaf0;border:1px solid #fed7aa;border-left:4px solid #f37f20;border-radius:12px;padding:12px 14px}.scCamAccuracyIcon{height:18px;margin-top:1px;width:18px}.scCamAccuracyNote p{color:#7c2d12;font-size:12px;line-height:1.4}.scCamImageWrapper,.scCamVideoWrapper{align-items:center;aspect-ratio:1/1;background:#111827;border-radius:18px;box-shadow:inset 0 0 0 1px #ffffff1a,0 4px 12px #00000014;display:flex;justify-content:center}.scCamCapturedImage,.scCamVideo{height:100%;object-fit:cover}.scCamCapturedImage{cursor:crosshair}.scCamActions{gap:12px;margin-top:4px}.scSearchBtn{background:linear-gradient(135deg,#f37f20,#e06808);border:none;border-radius:14px;box-shadow:0 4px 12px #f37f204d;cursor:pointer;flex:1 1;font-size:15px;font-weight:600;padding:14px 20px;transition:transform .1s ease,box-shadow .2s ease}.scSearchBtn:active{box-shadow:0 2px 6px #f37f2033;transform:scale(.98)}.scSearchBtn:disabled{background:#d1d5db}.scCancelBtn{background:#f3f4f6;border:none;border-radius:14px;color:#374151;cursor:pointer;flex:1 1;font-size:15px;font-weight:600;padding:14px 20px;transition:background .15s ease,transform .1s ease}.scCancelBtn:active{background:#e5e7eb;transform:scale(.98)}.searchSectionMain{background:linear-gradient(180deg,#f37f20 0,#f37f20 45%,#fff 0,#fff);overflow:hidden;padding:70px 10px;position:relative}.searchSectionMain:before{animation:float 6s ease-in-out infinite;background:radial-gradient(circle,#ffffff1a 0,#0000 70%);border-radius:50%;content:"";height:500px;position:absolute;right:-10%;top:-50%;width:500px}.searchSectionMain:after{animation:float 8s ease-in-out infinite reverse;background:radial-gradient(circle,#ffffff14 0,#0000 70%);border-radius:50%;bottom:-30%;content:"";height:400px;left:-10%;position:absolute;width:400px}@keyframes float{0%,to{transform:translateY(0) translateX(0)}50%{transform:translateY(-20px) translateX(20px)}}.search{background-color:#fff;border:3px solid #f37f20;border-radius:8px;box-shadow:0 10px 30px #f05a2826;margin:0 auto;max-width:750px;opacity:0;padding:30px 3px 50px;position:relative;text-align:center;transform:translateY(30px);transition:opacity .8s ease,transform .8s ease;width:80%;z-index:1}.search.fade-in{opacity:1;transform:translateY(0)}.searchContent{align-items:center;display:flex;gap:20px;justify-content:center}.searchText{text-align:center}.mascotImage,.mascotWrapper{position:relative}.mascotImage{flex-shrink:0;height:auto;width:130px;z-index:2}.mascotGlow{animation:pulse 2s ease-in-out infinite;background:radial-gradient(circle,#f05a2826 0,#0000 70%);border-radius:50%;height:150px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:150px;z-index:1}.Title{color:#1a1a1a;font-size:38px;font-weight:700;margin:0 0 10px}.Title .highlight{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#f37f20,#ff8e53);-webkit-background-clip:text;background-clip:text}.Subtitle{color:#333;font-size:24px;margin:0}.searchWrapper{margin:20px auto 0;max-width:520px;position:relative;width:100%}.searchInputGroup{position:relative;transition:transform .3s ease}.searchInputGroup:focus-within{transform:translateY(-2px)}.searchInput{background-color:#ededed;border:2px solid #000;border-radius:25px;box-sizing:border-box;font-size:18px;outline:none;padding:12px 195px 12px 20px;transition:all .3s ease;width:100%}.searchInput:focus{background-color:#fff;border-color:#f37f20;box-shadow:0 0 0 3px #f05a281a}.searchBtn{align-items:center;background-color:#fff;border:2px solid #f37f20;border-radius:50%;cursor:pointer;display:flex;height:36px;justify-content:center;position:absolute;right:15px;top:50%;transform:translateY(-50%);transition:transform .2s ease,box-shadow .2s ease;width:36px;z-index:10}.searchBtn:hover{box-shadow:0 3px 10px #f05a2866;transform:translateY(-50%) scale(1.05)}.searchBtn:active{transform:translateY(-50%) scale(.95)}.rgbBtn{align-items:center;background:#fff;border:2px solid #f37f20;border-radius:50%;cursor:pointer;display:flex;height:38px;justify-content:center;padding:0;position:absolute;right:60px;top:50%;transform:translateY(-50%);transition:all .3s ease;width:38px;z-index:10}.rgbBtn:hover{background:linear-gradient(135deg,#f37f20,#ff8e53);box-shadow:0 4px 15px #f05a2866;transform:translateY(-50%) scale(1.1)}.rgbIcon{height:22px;width:22px}.cameraButton{align-items:center;background:#f37f20;border:2px solid #f37f20;border-radius:50%;color:#fff;cursor:pointer;display:flex;height:38px;justify-content:center;padding:0;position:absolute;right:105px;top:50%;transform:translateY(-50%);transition:all .3s ease;width:38px;z-index:10}.cameraButton:hover{background:linear-gradient(135deg,#f37f20,#ff8e53);box-shadow:0 4px 15px #f05a2866;color:#fff;transform:translateY(-50%) scale(1.1)}.cameraIcon{height:20px;width:20px}.uploadBtn{align-items:center;background:#fff;border:2px solid #f37f20;border-radius:50%;color:#f37f20;cursor:pointer;display:flex;height:38px;justify-content:center;padding:0;position:absolute;right:150px;top:50%;transform:translateY(-50%);transition:all .3s ease;width:38px;z-index:10}.uploadBtn:hover{background:linear-gradient(135deg,#f37f20,#ff8e53);box-shadow:0 4px 15px #f05a2866;color:#fff;transform:translateY(-50%) scale(1.1)}.uploadIconS{height:20px;width:20px}.popularSearches{align-items:center;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:15px}.popularLabel{color:#666;font-size:13px;font-weight:600}.popularTag{background:#f8f8f8;border:1px solid #e0e0e0;border-radius:20px;color:#333;cursor:pointer;font-size:13px;padding:6px 16px;transition:all .3s ease}.popularTag:hover{background:linear-gradient(135deg,#f37f20,#ff8e53);border-color:#0000;color:#fff;transform:translateY(-2px)}.statsSection{align-items:center;display:flex;gap:30px;justify-content:center;margin-top:40px;padding:0 20px}.statItem{text-align:center}.statNumber{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#f37f20,#ff8e53);-webkit-background-clip:text;background-clip:text;font-size:28px;font-weight:700;margin-bottom:5px}.statLabel{color:#666;font-size:13px;font-weight:500}.statDivider{background:#ffffff4d;height:40px;width:1px}.rgbOverlay{align-items:flex-start;animation:overlayFadeIn .25s ease;background:#00000080;bottom:0;display:flex;justify-content:center;left:0;overflow-y:auto;padding:20px;position:fixed;right:0;top:0;z-index:9999}@keyframes overlayFadeIn{0%{opacity:0}to{opacity:1}}.rgbCard{animation:cardSlideUp .35s cubic-bezier(.34,1.56,.64,1);background:#fff;border:3px solid #f37f20;border-radius:20px;box-shadow:0 20px 60px #0000004d;margin-top:60px;max-width:450px;padding:30px;position:relative;text-align:center;width:100%}@keyframes cardSlideUp{0%{opacity:0;transform:translateY(60px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}.closeBtn{align-items:center;background:none;border:none;color:#999;cursor:pointer;display:flex;font-size:32px;height:35px;justify-content:center;line-height:1;position:absolute;right:15px;top:12px;transition:all .25s;width:35px}.closeBtn:hover{color:#f37f20;transform:rotate(90deg)}.rgbTitle{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#f37f20,#ff8e53);-webkit-background-clip:text;background-clip:text;font-size:24px;font-weight:700;margin:0 0 5px}.rgbSubtitle{color:#666;font-size:13px;margin:0 0 18px}.colorPreviewBox{align-items:flex-end;border:2px solid #f0f0f0;border-radius:15px;box-shadow:0 8px 20px #00000026;display:flex;height:120px;margin-bottom:18px;padding:15px;transition:background-color .15s ease}.colorInfo{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:10px;box-shadow:0 2px 10px #0000001a;display:flex;flex-direction:column;gap:3px;padding:10px 14px}.colorHexDisplay{color:#333;font-size:20px;font-weight:700;letter-spacing:1px}.colorRgbDisplay{color:#666;font-size:12px;font-weight:500}.colorWheelSection{margin-bottom:18px;position:relative;z-index:0}.colorWheelWrapper{align-items:stretch;border:2px solid #e0e0e0;border-radius:10px;cursor:pointer;display:flex;height:55px;overflow:hidden;transition:border-color .3s,box-shadow .3s;width:100%}.colorWheelWrapper:hover{border-color:#f37f20;box-shadow:0 0 0 3px #f05a281a}.colorWheel{-webkit-appearance:none;appearance:none;background:none;border:none;cursor:pointer;display:block;height:100%;margin:0;outline:none;padding:0;width:100%}.rgbSliders{margin-bottom:18px;text-align:left}.sliderRow{gap:12px;margin-bottom:14px}.sliderLabel,.sliderRow{align-items:center;display:flex}.sliderLabel{color:#333;font-size:14px;font-weight:700;gap:6px;min-width:30px}.colorDot{border-radius:50%;display:inline-block;height:10px;width:10px}.redDot{background:red}.greenDot{background:#0c0}.blueDot{background:#00f}.colorSlider{-webkit-appearance:none;appearance:none;border-radius:10px;box-shadow:inset 0 2px 4px #0000001a;cursor:pointer;flex:1 1;height:10px;outline:none}.colorSlider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#fff;border:3px solid #f37f20;border-radius:50%;box-shadow:0 3px 10px #0000004d;cursor:pointer;height:22px;-webkit-transition:transform .2s;transition:transform .2s;width:22px}.colorSlider::-webkit-slider-thumb:hover{box-shadow:0 4px 15px #f05a2866;transform:scale(1.15)}.colorSlider::-moz-range-thumb{background:#fff;border:3px solid #f37f20;border-radius:50%;box-shadow:0 3px 10px #0000004d;cursor:pointer;height:22px;width:22px}.rgbNumberInput{background:#f8f8f8;border:2px solid #e0e0e0;border-radius:8px;font-size:13px;font-weight:700;padding:6px 8px;text-align:center;transition:all .3s;width:55px}.rgbNumberInput:focus{background:#fff;border-color:#f37f20;box-shadow:0 0 0 3px #f05a281a;outline:none}.rgbActions{display:flex;gap:12px;justify-content:center;margin-top:18px}.cancelButton,.searchColorButton{border:none;border-radius:10px;cursor:pointer;flex:1 1;font-size:15px;font-weight:700;letter-spacing:.5px;padding:12px 20px;transition:all .3s}.searchColorButton{background:linear-gradient(135deg,#f37f20,#ff8e53);box-shadow:0 4px 15px #f05a284d;color:#fff}.searchColorButton:hover{box-shadow:0 6px 20px #f05a2866;transform:translateY(-2px)}.searchColorButton:disabled{box-shadow:none;cursor:not-allowed;opacity:.5;transform:none}.camOverlay{align-items:flex-start;animation:overlayFadeIn .25s ease;background:#00000080;bottom:0;display:flex;justify-content:center;left:0;overflow-y:auto;padding:20px;position:fixed;right:0;top:0;z-index:9999}.camCard{animation:cardSlideUp .35s cubic-bezier(.34,1.56,.64,1);background:#fff;border:3px solid #f37f20;border-radius:20px;box-shadow:0 20px 60px #0000004d;margin-top:60px;max-width:450px;padding:30px;position:relative;text-align:center;width:100%}.camError{color:#d33;font-size:13px;margin:0 0 12px}.camImageWrapper,.camVideoWrapper{background:#000;border-radius:14px;margin-bottom:16px;overflow:hidden;position:relative;width:100%}.camCapturedImage,.camVideo{cursor:crosshair;display:block;max-height:320px;object-fit:contain;width:100%}.camPickMarker{border:3px solid #fff;border-radius:50%;box-shadow:0 2px 8px #0006;height:22px;position:absolute;right:8px;top:8px;width:22px}@media (max-width:480px){.camCard{padding:20px 15px}}.uploadOverlay{align-items:flex-start;animation:overlayFadeIn .25s ease;background:#00000080;bottom:0;display:flex;justify-content:center;left:0;overflow-y:auto;padding:20px;position:fixed;right:0;top:0;z-index:9999}.uploadCard{animation:cardSlideUp .35s cubic-bezier(.34,1.56,.64,1);background:#fff;border:3px solid #f37f20;border-radius:20px;box-shadow:0 20px 60px #0000004d;margin-top:60px;max-width:450px;padding:30px;position:relative;text-align:center;width:100%}.uploadDropBox{background:#fff;border:2px dashed #f3c4a0;border-radius:14px;overflow:hidden;transition:border-color .2s,background .2s,transform .2s}.uploadDropBox.dragOver{background:#fff7f0;border-color:#f37f20;transform:scale(1.01)}.uploadHintBox{align-items:center;display:flex;flex-direction:column;gap:8px;justify-content:center;padding:28px 22px}.uploadHintIcon{animation:bobIcon 2.5s ease-in-out infinite;display:inline-block;font-size:38px}.uploadHintBox p{color:#888;font-size:14px;margin:0;text-align:center}.uploadHintSub{color:#bbb!important;font-size:12px!important}.uploadCanvasWrap{align-items:center;animation:canvasFadeIn .35s ease;display:flex;justify-content:center;padding:16px}.uploadCanvasInner{line-height:0;max-width:380px;position:relative;width:100%}.uploadCanvas{border-radius:10px;display:block;height:auto;width:100%}.uploadPickOverlay{height:100%;left:0;position:absolute;top:0;width:100%}.uploadCursorPill{border:2.5px solid #fff;border-radius:50%;box-shadow:0 1px 6px #00000059;display:none;height:22px;pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:22px;z-index:10}.uploadModeRow{animation:canvasFadeIn .3s ease;display:flex;gap:8px;margin-top:10px}.uploadModeBtn{background:#fff;border:1.5px solid #e0e0e0;border-radius:8px;color:#555;cursor:pointer;flex:1 1;font-size:13px;font-weight:500;padding:8px 10px;transition:all .15s}.uploadModeBtn:hover{background:#f7f7f7;transform:translateY(-1px)}.uploadModeBtn.active{background:#fff4eb;border-color:#f37f20;color:#c45c00}.uploadModeBtn.danger{border-color:#fdd;color:#c0392b}.uploadModeBtn.danger:hover{background:#fff5f5}@media (max-width:480px){.uploadCard{padding:20px 15px}.uploadModeRow{flex-wrap:wrap}}@media (max-width:768px){.searchSectionMain{padding:40px 10px}.searchSectionMain:after,.searchSectionMain:before{height:300px;width:300px}.search{padding:20px 15px 30px;width:90%}.searchContent{flex-direction:column;gap:15px}.mascotImage{width:100px}.mascotGlow{height:120px;width:120px}.Title{font-size:28px}.Subtitle{font-size:18px}.searchWrapper{max-width:100%}.searchInput{font-size:16px;padding:10px 165px 10px 15px}.searchBtn{right:15px}.rgbBtn,.searchBtn{height:32px;width:32px}.rgbBtn{right:55px}.cameraButton{height:32px;right:95px;width:32px}.cameraIcon{height:18px;width:18px}.uploadBtn{height:32px;right:135px;width:32px}.uploadIconS{height:18px;width:18px}.popularSearches{gap:6px;margin-top:12px}.popularTag{font-size:12px;padding:5px 14px}.statsSection{gap:20px;margin-top:30px}.statNumber{font-size:24px}.statLabel{font-size:11px}.statDivider{height:35px}.camCard,.rgbCard,.uploadCard{padding:25px 20px}.rgbTitle{font-size:22px}.colorPreviewBox{height:100px}.colorWheel{height:50px}.rgbNumberInput{font-size:12px;width:50px}.sliderLabel{font-size:13px}}@media (max-width:480px){.Title{font-size:24px}.Subtitle{font-size:16px}.mascotImage{width:80px}.mascotGlow{height:100px;width:100px}.searchInput{font-size:14px;padding:10px 145px 10px 15px}.searchBtn{right:12px}.rgbBtn,.searchBtn{height:30px;width:30px}.rgbBtn{right:48px}.cameraButton{height:30px;right:84px;width:30px}.cameraIcon{height:16px;width:16px}.uploadBtn{height:30px;right:120px;width:30px}.uploadIconS{height:16px;width:16px}.popularSearches{flex-wrap:wrap}.popularLabel{margin-bottom:5px;width:100%}.statsSection{flex-direction:column;gap:25px;margin-top:25px}.statDivider{display:none}.camCard,.rgbCard,.uploadCard{padding:20px 15px}.rgbTitle{font-size:20px}.colorPreviewBox{height:80px;padding:10px}.colorHexDisplay{font-size:16px}.colorRgbDisplay{font-size:11px}.sliderRow{gap:8px}.rgbNumberInput{width:45px}.rgbActions{flex-direction:column}.cancelButton,.searchColorButton{width:100%}}.exploreSection{background:linear-gradient(180deg,#fff 0,#f8f8f8);padding:60px 20px}.exploreContainer{margin:0 auto;max-width:1200px}.exploreContent{grid-gap:60px;align-items:center;display:grid;gap:60px;grid-template-columns:2fr 2fr;margin-bottom:40px}.exploreTitle{color:#1a1a1a;display:inline-block;font-size:36px;font-weight:700;margin:0;position:relative}.exploreTitle:after{background-color:#f05a28;bottom:-8px;content:"";height:4px;left:0;position:absolute;width:60px}.exploreText{color:#333;font-size:18px;line-height:1.6;margin:0}@media (max-width:768px){.exploreSection{padding:40px 20px}.exploreContent{gap:30px;grid-template-columns:1fr;text-align:center}.exploreTitle{font-size:28px}.exploreTitle:after{left:50%;transform:translateX(-50%)}.exploreText{font-size:16px}.landscapeGrid{gap:15px;grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.exploreTitle{font-size:24px}.exploreText{font-size:14px;line-height:1.5}.landscapeGrid{gap:15px;grid-template-columns:1fr}.imageTitle{font-size:12px}}.trendingSection{background:linear-gradient(180deg,#f8f8f8 0,#fff);padding:60px 20px}.trendingContainer{margin:0 auto;max-width:1200px}.trendingContent{grid-gap:60px;align-items:center;display:grid;gap:60px;grid-template-columns:2fr 2fr;margin-bottom:40px}.trendingTitle{color:#1a1a1a;display:inline-block;font-size:36px;font-weight:700;margin:0;position:relative}.trendingTitle:after{background-color:#f05a28;bottom:-8px;content:"";height:4px;left:0;position:absolute;width:60px}.trendingText{color:#333;font-size:18px;line-height:1.6;margin:0}.landscapeGrid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(4,1fr)}.imageWrapper,.landscapeItem{overflow:hidden;position:relative}.imageWrapper{border-radius:8px;box-shadow:0 4px 8px #0000001a;cursor:pointer;transition:transform .3s ease,box-shadow .3s ease}.imageWrapper:hover{box-shadow:0 12px 24px #00000026;transform:translateY(-8px)}.landscapeImage{display:block;height:auto;transition:transform .3s ease;width:100%}.imageWrapper:hover .landscapeImage{transform:scale(1.1)}.imageOverlay{background:linear-gradient(0deg,#000c 0,#0000);bottom:0;left:0;padding:15px;position:absolute;right:0;transform:translateY(100%);transition:transform .3s ease}.imageWrapper:hover .imageOverlay{transform:translateY(0)}.imageTitle{color:#fff;font-size:14px;font-weight:600;letter-spacing:.5px;text-transform:uppercase}@media (max-width:1024px){.landscapeGrid{gap:15px;grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.trendingSection{padding:40px 20px}.trendingContent{gap:30px;grid-template-columns:1fr;text-align:center}.trendingTitle{font-size:28px}.trendingTitle:after{left:50%;transform:translateX(-50%)}.trendingText{font-size:16px}.landscapeGrid{gap:15px;grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.trendingTitle{font-size:24px}.trendingText{font-size:14px;line-height:1.5}.landscapeGrid{gap:15px;grid-template-columns:1fr}.imageTitle{font-size:12px}}.footer{background-color:#1a1a1a;color:#fff;padding:50px 20px 20px}.footerContainer{margin:0 auto;max-width:1200px}.footerContent{grid-gap:60px;border-bottom:1px solid #444;display:grid;gap:60px;grid-template-columns:2fr 1fr;padding-bottom:30px}.footerAddress{text-align:left}.footerTitle{color:#f05a28;font-size:16px;font-weight:700;letter-spacing:1px;margin-bottom:20px}.addressText{color:#ccc;font-size:14px;line-height:1.6;margin:8px 0}.socialIcons{gap:20px}.socialIcon,.socialIcons{align-items:center;display:flex;justify-content:center}.socialIcon{background-color:#333;border-radius:50%;color:#fff;height:40px;text-decoration:none;transition:all .3s ease;width:40px}.icon{height:20px;width:20px}.socialIcon:hover{background-color:#f05a28;transform:translateY(-3px)}.footerBottom{padding-top:20px;text-align:center}.footerBottom p{color:#888;font-size:13px;margin:0}@media (max-width:768px){.footer{padding:40px 20px 20px}.footerContent{gap:30px;grid-template-columns:1fr}.footerAddress,.footerContent,.footerSocial{text-align:center}.socialIcons{justify-content:center}.footerTitle{font-size:15px}.addressText{font-size:13px}}@media (max-width:480px){.footerContent{gap:25px}.socialIcons{gap:15px}.socialIcon{height:36px;width:36px}.icon{height:18px;width:18px}}.paletteSection{background-color:#ededed;overflow:hidden;padding:20px 10px}.paletteContainer{margin:0 auto;max-width:100%;overflow:hidden}.colorExGrid{display:flex;gap:50px;overflow-x:hidden;padding:0}.colorItem{flex-shrink:0;min-width:100px;text-align:center;width:100px}.colorBox{border-radius:4px;cursor:pointer;height:90px;margin-bottom:4px;transition:transform .2s;width:90px}.colorBox:hover{transform:scale(1.15)}.colorName{font-size:12px;font-weight:600;line-height:1.2}.skeletonPulse{animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@media (max-width:768px){.paletteSection{background-color:#ededed;padding:15px 0}.colorExGrid{gap:40px}.colorItem{min-width:80px;width:80px}.colorBox{height:80px;width:80px}.colorName{font-size:11px}}@media (max-width:480px){.paletteSection{padding:10px 0}.colorExGrid{gap:30px}.colorItem{min-width:70px;width:70px}.colorBox{height:70px;width:70px}.colorName{font-size:10px;text-align:center}}@media (prefers-reduced-motion:reduce){.colorExGrid{scroll-behavior:auto}}.features-section{background:linear-gradient(180deg,#fff 0,#f8f8f8);padding:10px 20px 70px}.features-container{margin:0 auto;max-width:1200px}.features-title{color:#1a1a1a;font-size:36px;font-weight:700;margin-bottom:60px;position:relative;text-align:center}.features-title:after{background:linear-gradient(90deg,#f05a28,#ff8e53);bottom:-15px;content:"";height:4px;left:50%;position:absolute;transform:translateX(-50%);width:80px}.features-grid{grid-gap:30px;display:grid;gap:30px;grid-template-columns:repeat(4,1fr)}.feature-card{background:#fff;border-radius:12px;box-shadow:0 4px 12px #00000014;cursor:pointer;padding:40px 25px;text-align:center;transition:transform .3s ease,box-shadow .3s ease}.feature-card:hover{box-shadow:0 12px 24px #00000026;transform:translateY(-10px)}.feature-icon{align-items:center;background:linear-gradient(90deg,#f05a28,#ff8e53);border-radius:50%;color:#fff;display:flex;height:70px;justify-content:center;margin:0 auto 20px;width:70px}.feature-icon svg{height:35px;width:35px}.feature-card h3{color:#1a1a1a;font-size:20px;font-weight:700;margin:0 0 12px}.feature-card p{color:#666;font-size:15px;line-height:1.6;margin:0}@media (max-width:1024px){.features-grid{gap:25px;grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.features-section{padding:60px 20px}.features-title{font-size:32px;margin-bottom:40px}.features-grid{gap:20px;grid-template-columns:1fr}.feature-card{padding:30px 20px}}@media (max-width:480px){.features-title{font-size:28px}.feature-icon{height:60px;width:60px}.feature-icon svg{height:30px;width:30px}.feature-card h3{font-size:18px}.feature-card p{font-size:14px}}.searchHeader{background:linear-gradient(180deg,#f37f20 0,#f37f20 45%,#fff 0,#fff);overflow:hidden;padding:30px 20px;position:relative}.searchHeader:before{animation:scFloat 6s ease-in-out infinite;background:radial-gradient(circle,#ffffff1a 0,#0000 70%);height:320px;right:-10%;top:-40%;width:320px}.searchHeader:after,.searchHeader:before{border-radius:50%;content:"";position:absolute}.searchHeader:after{animation:scFloat 8s ease-in-out infinite reverse;background:radial-gradient(circle,#ffffff14 0,#0000 70%);bottom:-40%;height:260px;left:-10%;width:260px}@keyframes scFloat{0%,to{transform:translateY(0) translateX(0)}50%{transform:translateY(-15px) translateX(15px)}}.searchHeaderContainer{margin:0 auto;max-width:600px;position:relative;z-index:1}.searchHeaderCard{align-items:center;background-color:#fff;border:3px solid #f37f20;border-radius:10px;display:flex;flex-direction:column;gap:15px;opacity:0;padding:25px 60px;text-align:center;transform:translateY(20px);transition:opacity .7s ease,transform .7s ease}.searchHeaderCard.fade-in{opacity:1;transform:translateY(0)}.searchHeaderTitleRow{align-items:center;display:flex;gap:12px}.searchHeaderMascotWrapper{flex-shrink:0;position:relative}.searchHeaderMascotSmall{height:auto;position:relative;width:60px;z-index:2}.searchHeaderMascotGlow{animation:scPulse 2s ease-in-out infinite;background:radial-gradient(circle,#f05a2826 0,#0000 70%);border-radius:50%;height:80px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:80px;z-index:1}@keyframes scPulse{0%,to{opacity:.5;transform:translate(-50%,-50%) scale(1)}50%{opacity:.8;transform:translate(-50%,-50%) scale(1.1)}}.searchHeaderContent{align-items:center;display:flex;gap:12px}.searchHeaderTitle{font-size:26px;font-weight:700;margin:0 0 5px}.searchHeaderTitle .highlight{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#f37f20,#fc955e);-webkit-background-clip:text;background-clip:text}.searchHeaderSubtitle{color:#666;font-size:14px;margin:0 0 15px}.colorSelectWrapper{align-items:center;display:flex;gap:8px;position:relative;transition:transform .3s ease;width:75%}.colorSelectWrapper:focus-within{transform:translateY(-2px)}.colorSelectInput{border:2px solid #000;border-radius:20px;box-sizing:border-box;flex:1 1;font-size:14px;outline:none;padding:8px 15px;transition:border-color .3s,box-shadow .3s}.colorSelectInput:focus{border-color:#f37f20;box-shadow:0 0 0 3px #f05a281a}.scInputActions{align-items:center;display:flex;flex-shrink:0;gap:6px}.goButton{background:#f37f20;border:none;border-radius:20px;color:#fff;cursor:pointer;font-size:14px;font-weight:700;padding:8px;transition:opacity .3s,transform .2s ease,box-shadow .2s ease;width:75%}.goButton:hover{box-shadow:0 4px 12px #f05a2859;opacity:.9;transform:translateY(-2px)}.goButton:active{transform:translateY(0) scale(.97)}.scRgbBtn{align-items:center;background:#fff;border:2px solid #f37f20;border-radius:50%;cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;padding:0;transition:all .3s ease;width:32px}.scRgbBtn:hover{background:linear-gradient(135deg,#f37f20,#ff8e53);box-shadow:0 3px 10px #f05a2866;transform:scale(1.1)}.scRgbIcon{height:18px;width:18px}.scRgbOverlay{align-items:flex-start;animation:scOverlayIn .25s ease;background:#00000080;bottom:0;display:flex;justify-content:center;left:0;overflow-y:auto;padding:20px;position:fixed;right:0;top:0;z-index:9999}@keyframes scOverlayIn{0%{opacity:0}to{opacity:1}}.scRgbCard{animation:scCardUp .35s cubic-bezier(.34,1.56,.64,1);background:#fff;border:3px solid #f37f20;border-radius:20px;box-shadow:0 20px 60px #0000004d;margin-top:60px;max-width:420px;padding:28px;position:relative;text-align:center;width:100%}@keyframes scCardUp{0%{opacity:0;transform:translateY(60px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}.scCloseBtn{background:none;border:none;color:#999;cursor:pointer;font-size:30px;line-height:1;position:absolute;right:15px;top:12px;transition:all .25s}.scCloseBtn:hover{color:#f37f20;transform:rotate(90deg)}.scRgbTitle{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#f37f20,#ff8e53);-webkit-background-clip:text;background-clip:text;font-size:22px;font-weight:700;margin:0 0 4px}.scRgbSubtitle{color:#666;font-size:13px;margin:0 0 16px}.scCamAccuracyNote{align-items:flex-start;background:#f9f9f9;border:1px solid #f0f0f0;border-left:3px solid #f37f20;border-radius:8px;display:flex;gap:10px;margin-bottom:14px;padding:10px 12px;text-align:left}.scCamAccuracyIcon{color:#f37f20;flex-shrink:0;height:16px;margin-top:2px;width:16px}.scCamAccuracyNote p{color:#666;font-size:11.5px;line-height:1.5;margin:0}.scColorPreviewBox{align-items:flex-end;border:2px solid #f0f0f0;border-radius:14px;box-shadow:0 8px 20px #00000026;display:flex;height:110px;margin-bottom:16px;padding:14px;transition:background-color .15s ease}.scColorInfo{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-radius:10px;box-shadow:0 2px 10px #0000001a;display:flex;flex-direction:column;gap:2px;padding:8px 12px}.scClearBtn{align-items:center;background:#fff;border:2px solid #ccc;border-radius:50%;color:#888;cursor:pointer;display:flex;flex-shrink:0;font-size:16px;height:28px;justify-content:center;line-height:1;padding:0;transition:color .15s,border-color .15s,background .15s,transform .15s;width:28px}.scClearBtn:hover{background:#f37f20;border-color:#f37f20;color:#fff;transform:rotate(90deg)}.scColorHex{color:#333;font-size:18px;font-weight:700;letter-spacing:1px}.scColorRgb{color:#666;font-size:11px;font-weight:500}.scColorWheelSection{margin-bottom:16px;position:relative;z-index:0}.scColorWheelWrapper{align-items:stretch;border:2px solid #e0e0e0;border-radius:10px;cursor:pointer;display:flex;height:50px;overflow:hidden;transition:border-color .3s,box-shadow .3s;width:100%}.scColorWheelWrapper:hover{border-color:#f37f20;box-shadow:0 0 0 3px #f05a281a}.scColorWheel{-webkit-appearance:none;appearance:none;background:none;border:none;cursor:pointer;display:block;height:100%;margin:0;outline:none;padding:0;width:100%}.scRgbSliders{margin-bottom:16px;text-align:left}.scSliderRow{gap:10px;margin-bottom:12px}.scSliderLabel,.scSliderRow{align-items:center;display:flex}.scSliderLabel{color:#333;font-size:13px;font-weight:700;gap:5px;min-width:28px}.scColorDot{border-radius:50%;display:inline-block;height:9px;width:9px}.scRedDot{background:red}.scGreenDot{background:#0c0}.scBlueDot{background:#00f}.scColorSlider{-webkit-appearance:none;appearance:none;border-radius:10px;box-shadow:inset 0 2px 4px #0000001a;cursor:pointer;flex:1 1;height:10px;outline:none}.scColorSlider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#fff;border:3px solid #f37f20;border-radius:50%;box-shadow:0 3px 10px #00000040;cursor:pointer;height:20px;-webkit-transition:transform .2s;transition:transform .2s;width:20px}.scColorSlider::-webkit-slider-thumb:hover{transform:scale(1.15)}.scColorSlider::-moz-range-thumb{background:#fff;border:3px solid #f37f20;border-radius:50%;box-shadow:0 3px 10px #00000040;cursor:pointer;height:20px;width:20px}.scRgbNumber{background:#f8f8f8;border:2px solid #e0e0e0;border-radius:8px;font-size:12px;font-weight:700;padding:5px 6px;text-align:center;transition:all .3s;width:50px}.scRgbNumber:focus{background:#fff;border-color:#f37f20;box-shadow:0 0 0 3px #f05a281a;outline:none}.scHexSection{margin-bottom:16px;text-align:left}.scHexLabel{color:#333;display:block;font-size:13px;font-weight:600;margin-bottom:6px}.scHexField{background:#f8f8f8;border:2px solid #e0e0e0;border-radius:10px;box-sizing:border-box;font-size:15px;font-weight:700;letter-spacing:1px;padding:10px 14px;text-align:center;text-transform:uppercase;transition:all .3s;width:100%}.scHexField:focus{background:#fff;border-color:#f37f20;box-shadow:0 0 0 3px #f05a281a;outline:none}.scRgbActions{display:flex;gap:10px}.scCancelBtn,.scSearchBtn{border:none;border-radius:10px;cursor:pointer;flex:1 1;font-size:14px;font-weight:700;padding:10px 16px;transition:all .3s}.scSearchBtn{background:linear-gradient(135deg,#f37f20,#ff8e53);box-shadow:0 4px 15px #f05a284d;color:#fff}.scSearchBtn:hover{box-shadow:0 6px 20px #f05a2866;transform:translateY(-2px)}.scSearchBtn:disabled{box-shadow:none;cursor:not-allowed;opacity:.5;transform:none}.scCancelBtn{background:#f0f0f0;color:#333}.scCancelBtn:hover{background:#e0e0e0}.scCameraBtn{align-items:center;background:#fff;border:2px solid #f37f20;border-radius:50%;color:#f37f20;cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;padding:0;transition:all .3s ease;width:32px}.scCameraBtn:hover{background:linear-gradient(135deg,#f37f20,#ff8e53);box-shadow:0 3px 10px #f05a2866;color:#fff;transform:scale(1.1)}.scCameraIcon{height:18px;width:18px}.scCamOverlay{align-items:flex-start;animation:scOverlayIn .25s ease;background:#00000080;bottom:0;display:flex;justify-content:center;left:0;overflow-y:auto;padding:20px;position:fixed;right:0;top:0;z-index:9999}.scCamCard{animation:scCardUp .35s cubic-bezier(.34,1.56,.64,1);background:#fff;border:3px solid #f37f20;border-radius:20px;box-shadow:0 20px 60px #0000004d;margin-top:60px;max-width:420px;padding:28px;position:relative;text-align:center;width:100%}.scCamError{color:#d33;font-size:13px;margin:0 0 12px}.scCamImageWrapper,.scCamVideoWrapper{background:#000;border-radius:14px;margin-bottom:16px;overflow:hidden;position:relative;width:100%}.scCamCapturedImage,.scCamVideo{cursor:crosshair;display:block;max-height:320px;object-fit:contain;width:100%}.scCamPickMarker{border:3px solid #fff;border-radius:50%;box-shadow:0 2px 8px #0006;height:22px;position:absolute;right:8px;top:8px;width:22px}.scCamActions{display:flex;gap:10px}@media (max-width:480px){.scCamCard{padding:18px 14px}.scCamActions{flex-direction:column}}.scUploadBtn{align-items:center;background:#fff;border:2px solid #f37f20;border-radius:50%;color:#f37f20;cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;padding:0;transition:all .3s ease;width:32px}.scUploadBtn:hover{background:linear-gradient(135deg,#f37f20,#ff8e53);box-shadow:0 3px 10px #f05a2866;color:#fff;transform:scale(1.1)}.scUploadIcon{height:18px;width:18px}.scUploadOverlay{align-items:flex-start;animation:scOverlayIn .25s ease;background:#00000080;bottom:0;display:flex;justify-content:center;left:0;overflow-y:auto;padding:20px;position:fixed;right:0;top:0;z-index:9999}.scUploadCard{animation:scCardUp .35s cubic-bezier(.34,1.56,.64,1);background:#fff;border:3px solid #f37f20;border-radius:20px;box-shadow:0 20px 60px #0000004d;margin-top:60px;max-width:420px;padding:28px;position:relative;text-align:center;width:100%}.scUploadBox{background:#fff;border:2px dashed #f3c4a0;border-radius:14px;overflow:hidden;transition:border-color .2s,background .2s,transform .2s}.scUploadBox.scDragOver{background:#fff7f0;border-color:#f37f20;transform:scale(1.01)}.scUploadHint{align-items:center;display:flex;flex-direction:column;gap:8px;justify-content:center;padding:26px 22px}.scUploadHintIcon{animation:scBobIcon 2.5s ease-in-out infinite;display:inline-block;font-size:36px}@keyframes scBobIcon{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.scUploadHint p{color:#888;font-size:14px;margin:0;text-align:center}.scUploadHintSub{color:#bbb!important;font-size:12px!important}.scBrowseText{color:#f37f20;cursor:pointer;font-weight:600;text-decoration:underline}.scUploadCanvasWrap{align-items:center;animation:scCanvasFadeIn .35s ease;display:flex;justify-content:center;padding:16px}@keyframes scCanvasFadeIn{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}.scUploadCanvasInner{line-height:0;max-width:360px;position:relative;width:100%}.scUploadCanvas{border-radius:10px;display:block;height:auto;width:100%}.scUploadPickOverlay{height:100%;left:0;position:absolute;top:0;width:100%}.scUploadCursorPill{border:2.5px solid #fff;border-radius:50%;box-shadow:0 1px 6px #00000059;display:none;height:22px;pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:22px;z-index:10}.scUploadModeRow{animation:scCanvasFadeIn .3s ease;display:flex;gap:8px;margin-top:10px}.scUploadModeBtn{background:#fff;border:1.5px solid #e0e0e0;border-radius:8px;color:#555;cursor:pointer;flex:1 1;font-size:13px;font-weight:500;padding:8px 10px;transition:all .15s}.scUploadModeBtn:hover{background:#f7f7f7;transform:translateY(-1px)}.scUploadModeBtn.active{background:#fff4eb;border-color:#f37f20;color:#c45c00}.scUploadModeBtn.danger{border-color:#fdd;color:#c0392b}.scUploadModeBtn.danger:hover{background:#fff5f5}@media (max-width:480px){.scUploadCard{padding:18px 14px}.scUploadModeRow{flex-wrap:wrap}}@media (max-width:768px){.searchHeader{padding:20px 15px}.searchHeader:after,.searchHeader:before{height:200px;width:200px}.searchHeaderCard{border-radius:10px;gap:12px;padding:20px 25px}.searchHeaderTitleRow{flex-direction:column;gap:8px}.searchHeaderMascotSmall{width:80px}.searchHeaderMascotGlow{height:100px;width:100px}.searchHeaderTitle{font-size:22px}.searchHeaderTitle .highlight{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#f37f20,#ff8e53);-webkit-background-clip:text;background-clip:text}.searchHeaderSubtitle{font-size:13px;margin:0 0 10px}.colorSelectWrapper{width:90%}.colorSelectInput{font-size:13px;padding:8px 40px 8px 12px}.goButton{font-size:13px;width:90%}.scRgbCard{padding:22px 18px}.scRgbTitle{font-size:20px}.scColorPreviewBox{height:95px}.colorSelectWrapper{flex-wrap:wrap;gap:6px;justify-content:center}.scInputActions{gap:5px}.scCameraBtn,.scRgbBtn,.scUploadBtn{height:30px;width:30px}.scCameraIcon,.scRgbIcon,.scUploadIcon{height:16px;width:16px}.scClearBtn{font-size:14px;height:26px;width:26px}}@media (max-width:480px){.searchHeader{padding:15px 10px}.searchHeader:after,.searchHeader:before{height:150px;width:150px}.searchHeaderCard{border:2px solid #f37f20;border-radius:10px;padding:15px 20px}.searchHeaderMascotSmall{width:45px}.searchHeaderMascotGlow{height:65px;width:65px}.searchHeaderTitle{font-size:18px;margin:0 0 3px}.searchHeaderTitle .highlight{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#f37f20,#ff8e53);-webkit-background-clip:text;background-clip:text}.searchHeaderSubtitle{font-size:11px;margin:0 0 8px}.colorSelectWrapper{width:100%}.colorSelectInput{font-size:12px;padding:7px 38px 7px 10px}.goButton{font-size:12px;padding:7px;width:100%}.scRgbCard{padding:18px 14px}.scRgbActions{flex-direction:column}.scCancelBtn,.scSearchBtn{width:100%}.colorSelectWrapper{gap:5px}.scInputActions{gap:4px}.scCameraBtn,.scRgbBtn,.scUploadBtn{height:28px;width:28px}.scCameraIcon,.scRgbIcon,.scUploadIcon{height:14px;width:14px}.scClearBtn{font-size:13px;height:24px;width:24px}}.brandScrollerSection{background-color:#fff;border-bottom:1px solid #ddd;padding:30px 20px}.fade-up{opacity:0;transform:translateY(12px);transition:opacity .45s ease,transform .45s ease;transition-delay:0s;transition-delay:var(--delay,0s)}.scroller-loaded .fade-up{opacity:1;transform:translateY(0)}.resultsTitle{border-bottom:2px solid #a5a5a5;font-size:26px;font-weight:700;margin:0 auto 30px;max-width:1200px;text-align:left}.brandScrollerWrapper{align-items:center;display:flex;gap:10px;margin:0 auto;max-width:1200px;position:relative}.scrollBtn{align-items:center;background-color:#f0f0f0;border:1px solid #ddd;border-radius:50%;cursor:pointer;display:flex;flex-shrink:0;font-size:20px;height:35px;justify-content:center;transition:background-color .3s;width:35px}.scrollBtn:hover{background-color:#e0e0e0}.brandScroller{display:flex;flex:1 1;gap:12px;overflow-x:auto;padding:5px;scroll-behavior:smooth}.brandScroller::-webkit-scrollbar{height:8px}.brandScroller::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.brandScroller::-webkit-scrollbar-thumb{background:#888;border-radius:10px}.brandScrollerCard{align-items:center;border:3px solid #0000;border-radius:8px;cursor:pointer;display:flex;flex-direction:column;gap:8px;height:80px;justify-content:center;min-width:60px;padding:10px;transition:transform .2s,box-shadow .2s}.brandScrollerCard:hover{box-shadow:0 4px 8px #0000004d;transform:translateY(-3px)}.brandScrollerCardActive{border:3px solid #000;box-shadow:0 4px 8px #0000004d}.brandScrollerLogo{background-color:#fff;border-radius:50%;height:40px;object-fit:contain;padding:5px;width:40px}.brandScrollerName{color:#fff;font-size:11px;font-weight:700;text-align:center;text-transform:uppercase}@media (max-width:768px){.brandScrollerSection{padding:20px 15px}.resultsTitle{font-size:20px;margin:0 0 20px 20px}.brandScrollerWrapper{gap:8px}.scrollBtn{font-size:18px;height:30px;width:30px}.brandScroller{gap:10px}.brandScrollerCard{height:90px;min-width:70px;padding:8px}.brandScrollerLogo{height:45px;width:45px}.brandScrollerName{font-size:10px}.brandScroller::-webkit-scrollbar{height:4px}}.skeletonCard{pointer-events:none}.skeletonImageWrapper{animation:shimmer 1.4s infinite;aspect-ratio:4/3;background:linear-gradient(90deg,#e8e8e8 25%,#f5f5f5 50%,#e8e8e8 75%);background-size:200% 100%;border-radius:8px;width:100%}.skeletonInfo{display:flex;flex-direction:column;gap:6px;padding:8px 4px}.skeletonLine{animation:shimmer 1.4s infinite;background:linear-gradient(90deg,#e8e8e8 25%,#f5f5f5 50%,#e8e8e8 75%);background-size:200% 100%;border-radius:4px}.skeletonTitle{height:14px;width:75%}.skeletonCode{height:12px;width:50%}.skeletonSeries{height:11px;width:40%}.skeletonHeading{animation:shimmer 1.4s infinite;background:linear-gradient(90deg,#e8e8e8 25%,#f5f5f5 50%,#e8e8e8 75%);background-size:200% 100%;border-radius:4px;height:22px;margin-bottom:16px;width:200px}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.brandResultsSection{background-color:#fff;margin-bottom:20px;padding:4em 8em}.brandResultsTitle{border-bottom:2px solid #a5a5a5;font-size:24px;font-weight:700;margin:0 auto 30px;max-width:1200px;text-align:left}.colorGrid{grid-template-columns:repeat(5,1fr);margin:0 auto;padding-bottom:3em}.colorCard{transition:transform .2s,box-shadow .2s}.colorCard:hover{box-shadow:0 6px 12px #00000026;transform:translateY(-5px)}.colorCardImage{height:150px;object-fit:cover;width:70%}.favoriteIconBtn.disabled{cursor:not-allowed;opacity:.5}@media (max-width:1024px){.brandResultsSection{padding:3em 4em}.colorGrid{gap:18px;grid-template-columns:repeat(4,1fr)}}@media (max-width:768px){.brandResultsSection{padding:2em}.brandResultsTitle{font-size:20px;margin:0 0 20px}.colorGrid{gap:15px;grid-template-columns:repeat(2,1fr);padding-bottom:2em}.colorCardImage{height:140px}.colorCardInfo{padding:12px}.colorCardTitle{font-size:16px}.colorCardCode,.colorCardSeries{font-size:11px}}@media (max-width:480px){.brandResultsSection{padding:1.5em 1em}.brandResultsTitle{border-bottom:1px solid #a5a5a5;font-size:18px;margin:0 0 15px}.colorGrid{gap:12px;grid-template-columns:repeat(2,1fr);padding-bottom:1.5em}.colorCard{border:1px solid #ddd}.colorCardImage{height:120px}.colorCardInfo{padding:10px}.colorCardTitle{font-size:14px;margin:0 0 4px}.colorCardCode,.colorCardSeries{font-size:10px;margin:2px 0 0}}.productCard{background-color:#fff;margin:40px auto;max-width:1200px;padding:0 10em}.productContent{display:grid;text-align:left}.productHeader{align-items:flex-start;border-bottom:2px solid #f0f0f0;display:flex;justify-content:space-between;margin-bottom:30px;padding-bottom:20px}.colourTitle h2{color:#1a1a1a;font-size:28px;font-weight:700;margin:0 0 10px}.colourTitle p{color:#666;font-size:16px;margin:5px 0}.productActions{display:flex;gap:10px}.actionButton{align-items:center;background:#fff;border:2px solid #ddd;border-radius:50%;cursor:pointer;display:flex;height:44px;justify-content:center;transition:all .3s ease;width:44px}.actionButton svg{stroke-width:2;color:#666;height:22px;width:22px}.actionButton:hover{background:#fff5f3;border-color:#f05a28;transform:translateY(-2px)}.actionButton:hover svg{color:#f05a28}.actionButton.favoriteBtn.active{background:#f05a28;border-color:#f05a28}.actionButton.favoriteBtn.active svg{fill:#fff;color:#fff}.actionButton.favoriteBtn.disabled{cursor:not-allowed;opacity:.35}.imageGallerySection{margin-bottom:50px}.imageGalleryContainer{display:flex;gap:20px;margin:0 auto;max-width:600px}.mainImageWrapper{align-items:center;background:#f8f8f8;border-radius:16px;box-shadow:0 4px 12px #0000001a;box-sizing:border-box;display:flex;flex:1 1;height:350px;justify-content:center;overflow:hidden;padding:20px;position:relative}.mainImageWrapper svg{height:100%;object-fit:contain;transition:transform .3s ease;width:100%}.mainImageWrapper:hover svg{transform:scale(1.05)}.mainPreviewImage{height:350px;object-fit:contain;padding:20px;transition:transform .3s ease;width:100%}.mainImageWrapper:hover .mainPreviewImage{transform:scale(1.05)}.thumbnailColumn{align-items:center;display:flex;flex-direction:column;gap:10px}.thumbnailNavBtn{align-items:center;background:#fff;border:2px solid #ddd;border-radius:8px;cursor:pointer;display:flex;height:35px;justify-content:center;transition:all .3s ease;width:100px}.thumbnailNavBtn svg{color:#666;height:20px;width:20px}.thumbnailNavBtn:hover{background:#fff5f3;border-color:#f05a28}.thumbnailNavBtn:hover svg{color:#f05a28}.thumbnail{align-items:center;background:#f8f8f8;border:3px solid #ddd;border-radius:8px;box-sizing:border-box;cursor:pointer;display:flex;height:100px;justify-content:center;overflow:hidden;padding:8px;transition:all .3s ease;width:100px}.thumbnail img,.thumbnail svg{height:100%;width:100%}.thumbnail img{object-fit:contain;padding:5px}.thumbnail:hover{border-color:#f05a28;transform:translateX(-3px)}.thumbnail.active{border-color:#f05a28;box-shadow:0 4px 12px #f05a284d}.colourAccuracyNote{align-items:flex-start;background:#f9f9f9;border:1px solid #f0f0f0;border-left:4px solid #f05a28;border-radius:10px;display:flex;gap:14px;margin:-20px auto 40px;max-width:600px;padding:16px 18px}.accuracyIconWrap{align-items:center;background:#fff4ee;border-radius:50%;display:flex;flex-shrink:0;height:32px;justify-content:center;width:32px}.accuracyIconWrap svg{color:#f05a28;height:18px;width:18px}.accuracyText h4{color:#1a1a1a;font-size:14px;font-weight:700;margin:0 0 4px}.accuracyText p{color:#666;font-size:12.5px;line-height:1.6;margin:0}@media (max-width:480px){.colourAccuracyNote{align-items:flex-start;flex-direction:column;margin:0 0 30px;max-width:100%}}.colourRecipeProduct{margin-bottom:3em;margin-top:3em}.sectionHeader{gap:15px;margin-bottom:30px}.sectionHeader h2{font-size:24px;font-weight:700;margin:0}.sectionBadge{background:linear-gradient(135deg,#f05a28,#ff8e53);border-radius:20px;color:#fff;font-size:13px;font-weight:600;padding:6px 16px}.recipeGrid{grid-gap:15px;display:grid;gap:15px;grid-template-columns:repeat(2,1fr);max-width:800px}.recipeTotalRow{align-items:center;background:#fff4ee;border:2px solid #f05a28;border-radius:10px;color:#333;display:flex;font-size:16px;font-weight:600;justify-content:space-between;margin-bottom:15px;max-width:350px;padding:12px 18px}.recipeTotalValue{color:#f05a28;font-size:22px;font-weight:700}.recipeLoginGate{background:#fff4ee;border:3px solid #f05a28;border-radius:16px;padding:48px 24px;text-align:center}.recipeLoginGateTitle{color:#1a1a1a;font-size:24px;font-weight:800;margin:0 0 16px}.recipeLoginGateText{color:#666;font-size:15px;line-height:1.5;margin:0 0 24px}.recipeLoginGateBtn{align-items:center;background:linear-gradient(135deg,#f05a28,#ff8e53);border:none;border-radius:25px;box-shadow:0 4px 12px #f05a284d;color:#fff;cursor:pointer;display:inline-flex;font-size:16px;font-weight:700;gap:8px;padding:14px 28px;transition:all .3s ease}.recipeLoginGateBtn:hover{box-shadow:0 6px 16px #f05a2866;transform:translateY(-2px)}.recipeCard{align-items:center;background:#fff;border:2px solid #f0f0f0;border-radius:12px;display:flex;gap:20px;padding:15px;transition:all .3s ease}.recipeCard:hover{border-color:#f05a28;box-shadow:0 4px 12px #f05a281a;transform:translateX(5px)}.recipeIcon{align-items:center;background:#f0f0f0;border-radius:50%;color:#666;display:flex;flex-shrink:0;font-size:20px;font-weight:700;height:30px;justify-content:center;width:30px}.recipeIcon.highlight{background:linear-gradient(135deg,#f05a28,#ff8e53);color:#fff}.recipeInfo{align-items:center;display:flex;flex:1 1;justify-content:space-between}.recipeCodeName{color:#333;font-size:16px;font-weight:600}.recipePercentage{color:#f05a28;font-size:24px;font-weight:700}.suggestedPrimer{display:flex;flex-direction:column}.primerColourContext{align-items:center;background:#f9f9f9;border:1px solid #f0f0f0;border-radius:10px;display:flex;gap:12px;margin-bottom:18px;padding:12px 14px}.primerColourDot{border:1px solid #0000001a;border-radius:8px;flex-shrink:0;height:36px;width:36px}.primerContextText{color:#666;font-size:12px;line-height:1.5;margin:0}.primerContextText strong{color:#1a1a1a}.primerGrid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(3,1fr)}.primerCard{background:#fff;border:2px solid #e0e0e0;border-radius:12px;display:flex;flex-direction:column;gap:8px;margin-top:10px;padding:14px;position:relative;transition:border-color .2s,background .2s}.primerCardFeatured{background:#fff4ee;border-color:#f05a28;margin-top:20px}.primerCardDim{opacity:.55}.primerBestTag{background:#f05a28;border-radius:10px;color:#fff;font-size:10px;font-weight:700;left:50%;padding:3px 10px;position:absolute;top:-13px;transform:translateX(-50%);white-space:nowrap}.primerSwatch{align-items:center;border:1px solid #0000001a;border-radius:8px;display:flex;font-size:11px;font-weight:600;height:44px;justify-content:center;letter-spacing:.3px;width:100%}.primerName{color:#1a1a1a;font-size:13px;font-weight:700;line-height:1.3;margin:0 0 2px}.primerCode{color:#888;font-size:11px;margin:0}.primerFitLabel{border-radius:10px;display:inline-block;font-size:10px;font-weight:700;letter-spacing:.3px;padding:3px 8px;width:-webkit-fit-content;width:fit-content}.fitBest{background:#f05a28;color:#fff}.fitOk{background:#e8eef8;color:#185fa5}.fitNo{background:#f0f0f0;color:#888}.primerDesc{color:#666;font-size:11px;line-height:1.5;margin:0}.primerLegend{display:flex;flex-wrap:wrap;gap:14px;margin-top:14px}.legendItem{align-items:center;color:#888;display:flex;font-size:11px;gap:5px}.legendDot{border-radius:50%;flex-shrink:0;height:8px;width:8px}.dotBest{background:#f05a28}.dotOk{background:#378add}.dotNo{background:#ccc}@media (max-width:768px){.primerGrid{grid-template-columns:repeat(2,1fr);max-width:100%}}@media (max-width:480px){.primerGrid{grid-template-columns:1fr}}.colourProcess{margin-bottom:3em}.colourProcess h2{font-size:24px;font-weight:700;margin:0 0 30px}.processTimeline{flex-wrap:wrap;gap:0;justify-content:center}.processCard,.processTimeline{align-items:center;display:flex}.processCard{flex-direction:column;gap:10px;position:relative}.processNumber{align-items:center;background:linear-gradient(135deg,#f05a28,#ff8e53);border-radius:50%;box-shadow:0 2px 8px #f05a284d;color:#fff;display:flex;font-size:14px;font-weight:700;height:32px;justify-content:center;left:-5px;position:absolute;top:-5px;width:32px;z-index:2}.processCard img{border:3px solid #f0f0f0;border-radius:12px;height:110px;object-fit:cover;transition:all .3s ease;width:110px}.processCard:hover img{border-color:#f05a28;box-shadow:0 4px 12px #00000026;transform:scale(1.05)}.processCard p{color:#333;font-size:14px;font-weight:600;margin:0;text-align:center}.processConnector{background:linear-gradient(90deg,#f05a28,#ff8e53);height:3px;margin:0 10px;position:relative;width:40px}.processConnector:after{color:#f05a28;content:"→";font-size:20px;font-weight:700;position:absolute;right:-15px;top:-11px}.colourGallery{margin-top:3em}.galleryHeader{align-items:center;display:flex;gap:20px;margin-bottom:25px}.galleryHeader h2{font-size:24px;font-weight:700;margin:0}.uploadButton{align-items:center;background:linear-gradient(90deg,#f05a28,#ff8e53);border:none;border-radius:25px;box-shadow:0 4px 12px #f05a284d;color:#fff;cursor:pointer;display:flex;font-size:14px;font-weight:600;padding:10px 24px;transition:all .3s}.uploadButton:hover{box-shadow:0 6px 16px #f05a2866;transform:translateY(-2px)}.galleryGrid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(4,1fr)}.galleryImageWrapper{border:2px solid #f0f0f0;border-radius:12px;overflow:hidden;position:relative;transition:all .3s ease}.galleryImageWrapper:hover{border-color:#f05a28;box-shadow:0 4px 12px #0000001a;transform:translateY(-4px)}.galleryImage{height:200px;object-fit:cover;transition:transform .3s;width:100%}.galleryImageWrapper:hover .galleryImage{transform:scale(1.05)}.uploadModalOverlay{align-items:center;background-color:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:1000}.uploadModalContainer{height:100%;margin:0 auto;max-height:90vh;max-width:1000px;width:100%}.uploadModalContent{background-color:#fff;box-shadow:0 20px 25px -5px #0000001a;height:100%;position:relative}.dragOverlay,.uploadModalContent{border-radius:12px;display:flex;flex-direction:column}.dragOverlay{align-items:center;background-color:#fffffff2;bottom:0;justify-content:center;left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:50}.dragIcon{color:#f05a28;height:64px;margin-bottom:16px;width:64px}.dragText{color:#f05a28;font-size:20px;font-weight:600}.uploadScrollArea{flex:1 1;overflow-y:auto;padding:32px}.uploadDropZone{align-items:center;background:#fff5f3;border:3px dashed #f05a28;border-radius:12px;display:flex;flex-direction:column;justify-content:center;padding:48px;transition:all .3s}.uploadDropZone:hover{background:#ffe8e0;border-color:#ff8e53}.uploadDropText{color:#333;font-size:16px;font-weight:600;margin-bottom:16px;text-align:center}.uploadBrowseButton{background:linear-gradient(90deg,#f05a28,#ff8e53);border:none;border-radius:25px;color:#fff;cursor:pointer;font-weight:600;margin-top:12px;padding:12px 32px;transition:all .3s}.uploadBrowseButton:hover{box-shadow:0 4px 12px #f05a2866;transform:translateY(-2px)}.uploadListTitle{color:#333;font-size:18px;font-weight:700;padding-bottom:16px;padding-top:32px}.uploadFileList{display:flex;flex-wrap:wrap;gap:12px}.emptyState{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:200px;width:100%}.emptyIcon{height:100px;margin-bottom:16px;width:100px}.emptyText{color:#999;font-size:16px}.filePreviewCard{background-color:#f8f8f8;border:2px solid #e0e0e0;border-radius:12px;cursor:pointer;height:120px;min-width:120px;overflow:hidden;position:relative;transition:all .3s;width:calc(16.666% - 12px)}.filePreviewCard:hover{border-color:#f05a28;box-shadow:0 4px 12px #0000001a;transform:translateY(-4px)}.filePreviewImage{height:100%;object-fit:cover;width:100%}.filePreviewInfo{background:linear-gradient(0deg,#000c,#0000);bottom:0;color:#fff;left:0;padding:8px;position:absolute;right:0}.filePreviewName{font-size:12px;margin:0 0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filePreviewFooter{align-items:center;display:flex;justify-content:space-between}.filePreviewSize{font-size:11px;opacity:.9}.fileDeleteButton{background:#fff3;border:none;border-radius:4px;cursor:pointer;padding:4px;transition:background .3s}.fileDeleteButton:hover{background:#f05a28}.fileDeleteButton svg{color:#fff;height:16px;width:16px}.uploadModalFooter{border-top:1px solid #f0f0f0;display:flex;gap:12px;justify-content:flex-end;padding:20px 32px}.uploadSubmitButton{background:linear-gradient(90deg,#f05a28,#ff8e53);border:none;border-radius:25px;color:#fff;cursor:pointer;font-weight:600;padding:12px 32px;transition:all .3s}.uploadSubmitButton:hover:not(:disabled){box-shadow:0 4px 12px #f05a2866;transform:translateY(-2px)}.uploadSubmitButton:disabled{cursor:not-allowed;opacity:.5}.uploadCancelButton{background:#f0f0f0;border:none;border-radius:25px;cursor:pointer;font-weight:600;padding:12px 32px;transition:all .3s}.uploadCancelButton:hover{background:#e0e0e0}@media (max-width:1024px){.imageGalleryContainer{max-width:500px}.mainPreviewImage{height:300px}.thumbnail{height:90px;width:90px}.thumbnailNavBtn{height:32px;width:90px}}@media (max-width:768px){.imageGalleryContainer{flex-direction:column;max-width:100%}.mainImageWrapper{width:100%}.mainPreviewImage{height:280px}.thumbnailColumn{flex-direction:row;justify-content:center;order:2}.thumbnailNavBtn.up{height:80px;order:1;width:40px}.thumbnailNavBtn.up svg{transform:rotate(-90deg)}.thumbnail{height:80px;order:2;width:80px}.thumbnailNavBtn.down{height:80px;order:3;width:40px}.thumbnailNavBtn.down svg{transform:rotate(-90deg)}.recipeGrid{grid-template-columns:1fr}.processTimeline{flex-direction:column;gap:20px}.processConnector{height:30px;transform:rotate(90deg);width:3px}.processConnector:after{right:-8px;top:10px;transform:rotate(90deg)}.galleryGrid{gap:15px;grid-template-columns:repeat(2,1fr)}.galleryImage{height:150px}.filePreviewCard{width:calc(33.333% - 12px)}}@media (max-width:480px){.productCard{padding:0 1em}.colourTitle h2{font-size:20px}.actionButton{height:40px;width:40px}.actionButton svg{height:20px;width:20px}.mainPreviewImage{height:220px;padding:15px}.thumbnail{height:70px;width:70px}.thumbnailNavBtn.down,.thumbnailNavBtn.up{height:70px;width:35px}.processCard img{height:180px;width:250px}.galleryGrid{grid-template-columns:1fr}.uploadModalFooter{flex-direction:column-reverse}.uploadCancelButton,.uploadSubmitButton{width:100%}.filePreviewCard{width:calc(50% - 12px)}.galleryImageWrapper{margin:0 auto;width:70%}.fade-section{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease;transition-delay:0s;transition-delay:var(--delay,0s)}.page-loaded .fade-section{opacity:1;transform:translateY(0)}}.authPage{display:flex;flex-direction:column;min-height:100vh}.authContainer{display:grid;flex:1 1;grid-template-columns:1fr 1fr;min-height:calc(100vh - 200px)}.authLeftSection{align-items:center;background:#fff;display:flex;justify-content:center;overflow:hidden;padding:0;position:relative}.mascotImg{display:block;height:70%;object-fit:cover;object-position:center;width:60%}.authRightSection{align-items:center;background:#fff;display:flex;justify-content:center;padding:40px 20px}.authFormContainer{max-width:500px;width:100%}.authTabs{border:3px solid #f05a28;border-radius:10px;display:flex;gap:0;margin-bottom:40px;padding:5px}.authTab{background:#fff;border:none;border-radius:15px;color:#333;cursor:pointer;flex:1 1;font-size:18px;font-weight:600;padding:12px 24px;transition:all .3s}.authTab.active{background:linear-gradient(90deg,#f05a28,#ff8e53);color:#fff}.authForm{display:flex;flex-direction:column;gap:20px}.formGroup label{font-size:16px}.formGroup input{border:3px solid #f05a28;border-radius:15px;font-size:16px;padding:12px 20px;transition:border-color .3s}.formGroup input:focus{border-color:#ff8e53}.formGroup.floatGroup{margin-bottom:4px;position:relative}.formGroup.floatGroup input{background:#0000;border:3px solid #f05a28;border-radius:15px;box-sizing:border-box;font-size:16px;outline:none;padding:18px 20px 18px 48px!important;transition:border-color .3s;width:100%}.formGroup.floatGroup input:focus{border-color:#ff8e53}.formGroup.floatGroup label{background:#0000;color:#999;font-size:16px;font-weight:500;left:48px;margin:0;padding:0 6px;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:all .18s ease}.formGroup.floatGroup input:focus+label,.formGroup.floatGroup input:not(:placeholder-shown)+label{background:#fff;color:#f05a28;font-weight:700;left:34px;top:0;transform:translateY(-50%) scale(.82)}.formGroup.floatGroup .inputIcon{color:#f05a28;height:20px;left:16px;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);width:20px;z-index:2}.formGroup.floatGroup.hasToggle input{padding-right:48px!important}.passwordToggleBtn{align-items:center;background:none;border:none;color:#999;cursor:pointer;display:flex;justify-content:center;padding:4px;position:absolute;right:14px;top:50%;transform:translateY(-50%);z-index:2}.passwordToggleBtn:hover{color:#f05a28}.passwordToggleBtn svg{height:20px;width:20px}.authSubmitButton{background:linear-gradient(90deg,#f05a28,#ff8e53);border:none;border-radius:15px;color:#fff;cursor:pointer;font-size:18px;font-weight:600;margin-top:20px;padding:14px 24px;transition:opacity .3s}.authSubmitButton:hover{opacity:.9}.authLinkRow{display:flex;justify-content:flex-end;margin-top:-8px}.authLink{color:#f05a28;cursor:pointer;font-size:14px;font-weight:600;text-decoration:none}.authLink:hover{text-decoration:underline}.authHeading{color:#333;font-size:22px;font-weight:700;margin:0 0 8px}.authSubtext{color:#666;font-size:14px;line-height:1.5;margin:0 0 24px}@media (max-width:768px){.authContainer{grid-template-columns:1fr}.authLeftSection{display:none}.authFormContainer{max-width:100%;padding:0 20px}.authTab{font-size:16px;padding:10px 20px}.formGroup label{font-size:14px}.formGroup input{font-size:14px;padding:10px 15px}}.profilePage{display:flex;flex-direction:column;min-height:100vh}.profileContainer{align-items:flex-start;background:url(/static/media/BACKGROUND.c2d6bdadb3d837deb459.png);background-attachment:fixed;background-position:50%;background-repeat:no-repeat;background-size:cover;display:flex;flex:1 1;justify-content:center;padding:60px 20px}.submissionRgbSwatch{border:1px solid #0000001a;border-radius:8px;height:80px;width:100%}.profileStack{display:flex;flex-direction:column;gap:24px;max-width:600px;width:100%}.profileCard{background:#fff;border-radius:12px;box-shadow:0 4px 12px #0000001a;box-sizing:border-box;max-width:600px;padding:40px;width:100%}.profileHeader{margin-bottom:40px;text-align:center}.profileAvatarWrapper{height:100px;margin:0 auto 20px;position:relative;width:100px}.profileAvatar{align-items:center;background:linear-gradient(90deg,#f37f20,#ff8e53);color:#fff;display:flex;font-size:48px;font-weight:700;justify-content:center}.profileAvatar,.profileAvatarImage{border-radius:50%;height:100px;width:100px}.profileAvatarImage{object-fit:cover}.uploadPhotoButton{align-items:center;background:#f37f20;border-radius:50%;bottom:0;cursor:pointer;display:flex;height:32px;justify-content:center;position:absolute;right:0;transition:background-color .3s;width:32px}.uploadPhotoButton:hover{background:#ff8e53}.cameraIcon{color:#fff;height:18px;width:18px}.profileName{color:#333;font-size:28px;font-weight:700;margin:0 0 8px}.profileEmail{color:#666;font-size:16px;margin:0}.editHeader{display:flex;flex-direction:column;gap:10px;margin-top:10px}.editInputName{font-size:28px;font-weight:700;padding:8px}.editInputEmail,.editInputName{border:2px solid #f37f20;border-radius:8px;outline:none;text-align:center}.editInputEmail{color:#666;font-size:16px;padding:6px}.profileInfo{margin-bottom:30px}.sectionHeader{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.profileInfo h3{color:#333;font-size:20px;font-weight:700;margin:0}.editButton{align-items:center;background:#0000;border:2px solid #f37f20;border-radius:20px;color:#f37f20;cursor:pointer;display:flex;font-weight:600;gap:6px;padding:8px 16px;transition:all .3s}.editButton:hover{background:#f37f20;color:#fff}.editIcon{height:16px;width:16px}.infoRow{border-bottom:1px solid #eee;display:flex;justify-content:space-between;padding:12px 0}.infoLabel{color:#666;font-weight:600}.infoValue{color:#333}.editForm{display:flex;flex-direction:column;gap:20px}.formGroup{gap:8px}.formGroup label{font-size:14px}.editInput{border:2px solid #ddd;border-radius:8px;font-size:16px;outline:none;padding:10px 15px;transition:border-color .3s}.editInput:focus{border-color:#f37f20}.profileActions{display:flex;gap:12px}.cancelButton,.logoutButton,.saveButton{border:none;border-radius:8px;cursor:pointer;flex:1 1;font-size:15px;font-weight:600;padding:14px 24px;transition:opacity .3s}.logoutButton,.saveButton{background:linear-gradient(90deg,#f37f20,#ff8e53);color:#fff}.logoutButton:hover,.saveButton:hover{opacity:.9}.cancelButton{background:#f0f0f0;color:#333}.cancelButton:hover{background:#e0e0e0}.changePasswordButton{background:#fff;border:2px solid #f37f20;border-radius:8px;color:#f37f20;cursor:pointer;flex:1 1;font-size:15px;font-weight:600;padding:14px 24px;transition:all .3s}.changePasswordButton:hover{background:#f37f20;color:#fff}.submissionsCard .sectionHeader{margin-bottom:16px}.submissionsCount{background:#f5f5f5;border-radius:20px;color:#999;font-size:13px;font-weight:600;padding:4px 12px}.submissionsEmptyText{color:#999;font-size:14px;padding:20px 0;text-align:center}.submissionsErrorText{color:#c0392b}.submissionsAccordion{display:flex;flex-direction:column;gap:10px}.submissionItem{border:2px solid #eee;border-radius:10px;overflow:hidden;transition:border-color .25s ease}.submissionItem.open{border-color:#f37f20}.submissionHeaderRow{align-items:center;background:#fff;border:none;cursor:pointer;display:flex;gap:12px;justify-content:space-between;padding:14px 16px;text-align:left;width:100%}.submissionHeaderLeft{align-items:center;display:flex;gap:12px;min-width:0}.submissionSwatch{border:1px solid #0000001a;border-radius:8px;flex-shrink:0;height:32px;width:32px}.submissionHeaderText{display:flex;flex-direction:column;min-width:0}.submissionName{color:#1a1a1a;font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.submissionDate{color:#999;font-size:12px}.submissionHeaderRight{align-items:center;display:flex;flex-shrink:0;gap:12px}.submissionStatus{border-radius:20px;font-size:11px;font-weight:700;padding:4px 10px;text-transform:capitalize;white-space:nowrap}.statusPending{background:#fff4e0;color:#b8760a}.statusApproved{background:#e5f6ea;color:#1a8a3c}.statusRejected{background:#fde8e8;color:#c0392b}.submissionChevron{color:#999;flex-shrink:0;height:18px;transition:transform .25s ease;width:18px}.submissionItem.open .submissionChevron{color:#f37f20;transform:rotate(180deg)}.submissionDetails{max-height:0;overflow:hidden;transition:max-height .3s ease}.submissionItem.open .submissionDetails{max-height:600px}.submissionDetailsInner{border-top:1px solid #f0f0f0;display:flex;flex-direction:column;gap:10px;padding:4px 16px 18px}.submissionImage{border-radius:8px;margin-top:12px;max-height:180px;object-fit:cover;width:100%}.submissionDetailRow{border-bottom:1px solid #f5f5f5;display:flex;font-size:13px;gap:12px;justify-content:space-between;padding:6px 0}.submissionFormulas{font-size:13px;padding-top:6px}.submissionFormulas ul{color:#555;margin:6px 0 0;padding-left:18px}.submissionFormulas li{margin-bottom:4px}@media (max-width:768px){.profileContainer{padding:40px 20px}.profileCard{padding:30px 20px}.profileAvatar,.profileAvatarImage,.profileAvatarWrapper{height:80px;width:80px}.profileAvatar{font-size:36px}.editInputName,.profileName{font-size:24px}.editInputEmail,.profileEmail{font-size:14px}.profileInfo h3{font-size:18px}.infoRow{gap:5px}.infoRow,.profileActions{flex-direction:column}.submissionHeaderRow{padding:12px}.submissionDetailRow{flex-direction:column;gap:2px}}.changePasswordPage{align-items:center;background:url(/static/media/BACKGROUND.c2d6bdadb3d837deb459.png);background-position:50%;background-size:cover;display:flex;justify-content:center;min-height:100vh;padding:40px 20px}.changePasswordContainer{max-width:500px;width:100%}.changePasswordCard{background:#fff;border-radius:12px;box-shadow:0 4px 12px #0000001a;padding:40px}.changePasswordCard h2{color:#333;margin-bottom:30px;text-align:center}.formGroup{margin-bottom:20px}.formGroup label{color:#666;font-weight:600}.formGroup input{border:2px solid #ddd;border-radius:8px;outline:none;padding:12px}.formGroup input:focus{border-color:#f37f20}.buttonGroup{display:flex;gap:12px;margin-top:20px}.cancelBtn,.saveBtn{border:none;border-radius:8px;cursor:pointer;flex:1 1;font-size:15px;font-weight:600;padding:14px 24px}.saveBtn{background:linear-gradient(90deg,#f37f20,#ff8e53);color:#fff}.cancelBtn{background:#eee}.favoritesContainer{background:linear-gradient(180deg,#fff 0,#f8f8f8);box-sizing:border-box;margin:0 auto;max-width:1400px;min-height:60vh;padding:60px 20px;width:100%}.favoritesHeader{margin-bottom:30px}.headerContent{align-items:center;display:flex;gap:15px;justify-content:center;margin:10px 20px}.heartIcon{color:#f05a28;height:30px;width:30px}.favoritesTitle{color:#1a1a1a;font-size:36px;font-weight:700;margin:0}.favoritesSubtitle{color:#666;font-size:18px;margin:0;text-align:center}.emptyFavorites{padding:40px 20px;text-align:center}.emptyIcon{color:#ddd;display:block;height:120px;margin:0 auto 30px;width:120px}.emptyFavorites h2{color:#333;font-size:32px;margin:0 0 15px}.emptyFavorites p{color:#666;font-size:18px;margin:0 0 30px}.exploreButton{background:linear-gradient(90deg,#f05a28,#ff8e53);border:none;border-radius:25px;color:#fff;cursor:pointer;font-size:16px;font-weight:600;padding:14px 32px;transition:opacity .3s}.exploreButton:hover{opacity:.9}.favoritesGrid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(5,1fr);margin:0 auto;max-width:1200px;padding-bottom:3em}.favoriteCard{background-color:#fff;border:2px solid #ddd;border-radius:8px;cursor:pointer;display:flex;flex-direction:column;overflow:hidden;transition:transform .2s,box-shadow .2s}.favoriteCard:hover{box-shadow:0 6px 12px #00000026;transform:translateY(-5px)}.favoriteImageWrapper{align-items:center;background:#f9f9f9;display:flex;height:140px;justify-content:center;overflow:hidden;position:relative;width:100%}.favoriteImageWrapper svg{display:block;height:100%;width:100%}.removeButton{align-items:center;background:#fffffff2;border:none;border-radius:50%;cursor:pointer;display:flex;height:32px;justify-content:center;position:absolute;right:8px;top:8px;transition:all .3s;width:32px;z-index:10}.removeButton svg{color:#f05a28;height:18px;width:18px}.removeButton:hover{background:#f05a28;transform:scale(1.1)}.removeButton:hover svg{color:#fff}.favoriteInfo{flex:1 1;padding:12px}.favoriteName{color:#1a1a1a;font-size:14px;font-weight:700;line-height:1.3;margin:0 0 4px}.favoriteCode,.favoriteSeries{color:#666;font-size:12px;margin:3px 0 0}@media (max-width:1024px){.favoritesGrid{gap:16px;grid-template-columns:repeat(4,1fr)}}@media (max-width:768px){.favoritesContainer{padding:30px 16px}.favoritesTitle{font-size:26px}.heartIcon{height:26px;width:26px}.favoritesSubtitle{font-size:15px}.favoritesGrid{gap:12px;grid-template-columns:repeat(2,1fr);padding-bottom:2em}.favoriteImageWrapper{height:110px}.favoriteInfo{padding:10px}.favoriteName{font-size:13px}.favoriteCode,.favoriteSeries{font-size:11px}.emptyFavorites{padding:40px 20px}.emptyIcon{height:80px;width:80px}.emptyFavorites h2{font-size:22px}.emptyFavorites p{font-size:15px}}@media (max-width:480px){.favoritesTitle{font-size:22px}.favoritesGrid{gap:10px;grid-template-columns:repeat(2,1fr)}.favoriteCard{border:1px solid #ddd}.favoriteImageWrapper{height:90px}.favoriteInfo{padding:8px}.favoriteName{font-size:12px}.favoriteCode,.favoriteSeries{font-size:10px}}.reveal,.reveal-left,.reveal-right,.reveal-up{opacity:0;transition:opacity .8s ease,transform .8s ease}.reveal-up{transform:translateY(40px)}.reveal-up.is-visible,.reveal.is-visible{opacity:1;transform:translateY(0)}.reveal-left{transform:translateX(-40px)}.reveal-right{transform:translateX(40px)}.mainHeader.is-visible .reveal-left,.mainHeader.is-visible .reveal-right{opacity:1;transform:translateX(0)}.mainHeader.is-visible .reveal-left{transition-delay:.1s}.mainHeader.is-visible .reveal-right{transition-delay:.25s}.cardReveal,.colourLibrary.is-visible .cardReveal{animation:cardFadeUp .6s ease forwards;animation-delay:0s;animation-delay:var(--card-delay,0s);opacity:0;transform:translateY(25px)}@keyframes cardFadeUp{to{opacity:1;transform:translateY(0)}}.swatchPop{animation:swatchPopIn .35s cubic-bezier(.34,1.56,.64,1)}@keyframes swatchPopIn{0%{opacity:0;transform:translateY(8px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.recipeRowEnter{animation:recipeRowIn .3s ease}@keyframes recipeRowIn{0%{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}.spotlightImageHover svg{transition:transform .4s ease}.spotlightImageHover:hover svg{transform:translateY(-6px) rotate(-1deg)}.mainHeader{align-items:center;border-top:2px solid #a5a5a5;display:flex;gap:40px;justify-content:space-between;margin:0 auto;max-width:1200px;padding:10px 0 50px}.colourContent{align-items:start;display:flex;flex-direction:column;padding:10px 20px;width:30%}.smalltext{color:#f37f20;font-size:15px;font-weight:700;padding-left:70px;position:relative}.smalltext:before{background:#f37f20;content:"";height:3px;left:0;position:absolute;top:50%;transform:translateY(-50%);width:60px}.colourTitle1{color:#010101}.colourTitle1,.colourTitle2{font-size:50px;padding:0 60px}.colourTitle2{color:#f37f20;font-weight:700}.colourText2{font-size:18px;margin-top:25px;padding:0 60px}.submitButton{background:linear-gradient(135deg,#f05a28,#ff8e53);border:2px solid #f37f20;border-radius:8px;box-shadow:0 4px 12px #f05a284d;color:#fff;cursor:pointer;font-size:18px;margin:20px 30px 20px 60px;padding:10px 20px;transition:transform .25s ease,box-shadow .25s ease}.submitButton:hover{box-shadow:0 6px 16px #f05a2866;transform:translateY(-2px) scale(1.02)}.submitButton:active{transform:translateY(0) scale(.98)}.headerImg{align-items:center;display:flex;justify-content:center;width:70%}.headerImg img{animation:gentleFloat 5s ease-in-out infinite;max-width:750px;width:100%}@keyframes gentleFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.colourSpotlight{display:flex;justify-content:center;margin:60px 0}.colourhighlight{align-items:center;border:3px solid #f3a183;border-radius:25px;display:flex;flex-direction:column;max-width:1200px;transition:box-shadow .4s ease;width:80%}.colourhighlight:hover{box-shadow:0 12px 35px #f37f202e}.colourTop{font-size:15px;padding:20px 50px 10px;text-align:center}.colourTop,.colourTop p{color:#f37f20;font-weight:700}.colourTop p{background:#ffe5d7;border-radius:30px;display:inline-block;font-size:14px;padding:5px 15px}.colourTitle{color:#010101;font-size:50px;padding:0 60px}.highlightContent{align-items:center;display:flex;justify-content:center;margin-right:50px}.colourImage{padding-right:20px;width:50%}.colourImage svg{display:block;height:80%;padding-left:40px;width:80%}.colourImage img{border-radius:10px;width:70%}.colourDesc{align-items:flex-start;display:flex;flex-direction:column;text-align:left}.spotlightName{color:#f37f20;font-size:50px;font-weight:700;margin-bottom:10px}.spotlightText{font-size:18px;margin:2px 0}.colourRecipe{background:#fff4ee;border:3px solid #f37f20;border-radius:15px;margin:20px 0;max-width:300px;padding:15px;transition:transform .25s ease,box-shadow .25s ease}.colourRecipe:hover{box-shadow:0 8px 20px #f37f202e;transform:translateY(-3px)}.recipeText1{font-weight:700;margin:5px 0}.recipeTextLocked{color:#999!important;font-style:italic}.recipeUnlockBtn{background:linear-gradient(135deg,#f05a28,#ff8e53);border:none;border-radius:20px;color:#fff;cursor:pointer;font-size:13px;font-weight:600;margin-top:10px;padding:8px 18px;transition:all .25s ease}.recipeUnlockBtn:hover{box-shadow:0 4px 12px #f05a284d;transform:translateY(-2px)}.colourLibrary{background:#fff4ee;padding-bottom:40px;padding-left:8em;padding-right:8em}.colourTopExp{display:flex;font-size:15px;font-weight:700;justify-content:center;padding:20px 0 10px}.colourTopExp p{background:#f37f20;border-radius:30px;color:#fff;display:inline-block;font-size:14px;font-weight:700;padding:5px 15px;width:-webkit-fit-content;width:fit-content}.colorGrid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(4,1fr);margin:50px auto 0;max-width:1200px}.colorCardImageWrapper{position:relative}.colorCard{background-color:#fff;border:2px solid #ddd;border-radius:8px;cursor:pointer;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.colorCard:hover{border-color:#f3c4a0;box-shadow:0 10px 22px #00000026;transform:translateY(-6px)}.colorCard:hover .colorCardSVGWrapper svg{transform:scale(1.06)}.colorCardSVGWrapper svg{transition:transform .3s ease}.colorCardInfo{padding:5px 15px 15px}.colorCardTitle{font-size:18px;font-weight:700;margin:0 0 5px}.colorCardCode,.colorCardSeries{color:#666;font-size:12px;margin:3px 0 0}.favoriteIconBtn{align-items:center;background:#fffffff2;border:none;border-radius:50%;cursor:pointer;display:flex;height:36px;justify-content:center;position:absolute;right:10px;top:10px;transition:all .3s;width:36px;z-index:10}.favoriteIconBtn svg{stroke:#f05a28;stroke-width:2;color:#f05a28;height:20px;transition:transform .3s ease;width:20px}.favoriteIconBtn:not(.active) svg{fill:none}.favoriteIconBtn.active svg{fill:#f05a28;stroke:#f05a28;animation:heartPop .4s ease}@keyframes heartPop{0%{transform:scale(1)}40%{transform:scale(1.35)}to{transform:scale(1)}}.favoriteIconBtn:hover{background:#fff;transform:scale(1.1)}.colorCardSVGWrapper{align-items:center;box-sizing:border-box;cursor:pointer;display:flex;height:150px;justify-content:center;overflow:hidden;padding:8px;width:100%}.colorCardSVGWrapper svg{height:100%;object-fit:contain;width:100%}.colourForm{gap:40px;justify-content:center;margin:0 auto;max-width:1200px;padding:60px 0 40px}.colourForm,.colourFormText{align-items:flex-start;display:flex}.colourFormText{flex-direction:column;padding:10px 20px 5px;text-align:left;width:40%}.colourText{padding:0 60px 0 40px}.formStepsList{display:flex;flex-direction:column;gap:18px;margin-top:30px;padding:20px 60px;width:100%}.formStep{align-items:flex-start;display:flex;gap:14px;opacity:0;transform:translateX(-15px)}.colourForm.is-visible .formStep{animation:formStepIn .5s ease forwards;animation-delay:0s;animation-delay:var(--step-delay,0s)}@keyframes formStepIn{0%{opacity:0;transform:translateX(-15px)}to{opacity:1;transform:translateX(0)}}.formStepIcon{align-items:center;background:#fff4ee;border:1.5px solid #f3c4a0;border-radius:12px;display:flex;flex-shrink:0;font-size:22px;height:48px;justify-content:center;transition:transform .25s ease,box-shadow .25s ease;width:48px}.formStep:hover .formStepIcon{box-shadow:0 6px 14px #f37f2033;transform:scale(1.08) rotate(-3deg)}.formStepContent{display:flex;flex-direction:column;gap:2px;text-align:left}.formStepTitle{color:#1a1a1a;font-size:16px;font-weight:700;margin:0}.formStepDesc{color:#999;font-size:13px;margin:0}.formDetails{background:#fff4ee;border:3px solid #f37f20;border-radius:12px;padding:40px;transition:box-shadow .4s ease;width:50%}.formDetails:hover{box-shadow:0 10px 30px #f37f2026}.formTitle{font-size:25px;font-weight:700;margin-bottom:30px}.formGrid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr}.fullWidth{grid-column:span 2}.formGroup{display:flex;flex-direction:column}.formGroup label{color:#333;font-size:15px;font-weight:500;margin-bottom:8px}.labelHint{color:#999;font-size:13px;font-weight:400}.formGroup input,.formGroup textarea{background:#fff;border:1.5px solid #f3c4a0;border-radius:10px;color:#111;font-family:inherit;font-size:15px;outline:none;padding:12px 16px;transition:border-color .15s,box-shadow .15s}.formGroup input:focus,.formGroup textarea:focus{border-color:#f37f20;box-shadow:0 0 0 3px #f37f201f}.formGroup textarea{line-height:1.6;min-height:120px;resize:none}.readonlyInput{background:#f5f5f5!important;border-color:#ddd!important;color:#555!important;cursor:default!important}.loginPrompt{padding:40px 20px;text-align:center}.loginPrompt p{color:#555;font-size:15px;margin-bottom:16px}.loginPrompt .submitBtnForm{display:inline-block;padding:12px 28px;width:auto}.uploadBox{background:#fff;border:2px dashed #f3c4a0;border-radius:14px;overflow:hidden;transition:border-color .2s,background .2s,transform .2s}.uploadBox.dragOver{background:#fff7f0;border-color:#f37f20;transform:scale(1.01)}.uploadHint{align-items:center;display:flex;flex-direction:column;gap:8px;justify-content:center;padding:26px 22px}.uploadIcon{animation:bobIcon 2.5s ease-in-out infinite;display:inline-block;font-size:36px;margin:0 20px 20px 0}@keyframes bobIcon{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.uploadHint p{color:#888;font-size:14px;margin:0;text-align:center}.uploadSub{color:#bbb!important;font-size:12px!important}.browseText{color:#f37f20;cursor:pointer;font-weight:600;text-decoration:underline}.canvasWrap{align-items:center;animation:canvasFadeIn .35s ease;display:flex;justify-content:center;padding:16px}@keyframes canvasFadeIn{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}.canvasInner{line-height:0;max-width:400px;position:relative;width:100%}.imgCanvas{display:block;height:auto;width:100%}.pickOverlay{height:100%;left:0;position:absolute;top:0;width:100%}.cursorPill{border:2.5px solid #fff;border-radius:50%;box-shadow:0 1px 6px #00000059;display:none;height:22px;pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:22px;z-index:10}.modeRow{animation:canvasFadeIn .3s ease;display:flex;gap:8px;margin-top:10px}.modeBtn{background:#fff;border:1.5px solid #e0e0e0;border-radius:8px;color:#555;cursor:pointer;flex:1 1;font-size:13px;font-weight:500;padding:8px 10px;transition:all .15s}.modeBtn:hover{background:#f7f7f7;transform:translateY(-1px)}.modeBtn.active{background:#fff4eb;border-color:#f37f20;color:#c45c00}.modeBtn.danger{border-color:#fdd;color:#c0392b}.modeBtn.danger:hover{background:#fff5f5}.swatchBar{align-items:center;background:#fff9f5;border:1.5px solid #f3c4a0;border-radius:10px;display:flex;gap:10px;margin-top:12px;padding:10px 14px}.swatchCircle{border:1.5px solid #0000001a;border-radius:50%;flex-shrink:0;height:26px;transition:background .2s ease;width:26px}.swatchLabel{color:#666;font-size:13px}.swatchLabel strong{color:#111;font-weight:600}.recipeRow{gap:8px;margin-bottom:8px}.recipeNum,.recipeRow{align-items:center;display:flex}.recipeNum{background:#faeeda;border-radius:50%;color:#633806;flex-shrink:0;font-size:13px;font-weight:500;height:28px;justify-content:center;width:28px}.recipeIng{appearance:none;-webkit-appearance:none;background:#fff;border:1.5px solid #f3c4a0;border-radius:10px;cursor:pointer;flex:1 1;font-family:inherit;font-size:14px;outline:none;padding:10px 14px}.recipeIng:focus{border-color:#f37f20;box-shadow:0 0 0 3px #f37f201f}.recipeAmt{background:#fff;border:1.5px solid #f3c4a0;border-radius:10px;flex-shrink:0;font-family:inherit;font-size:14px;outline:none;padding:10px 14px;width:90px}.recipeAmt:focus{border-color:#f37f20;box-shadow:0 0 0 3px #f37f201f}.recipeUnitLabel{color:#666;flex-shrink:0;font-size:14px}.recipeRemove{align-items:center;background:#fff;border:1.5px solid #fdd;border-radius:50%;color:#c0392b;cursor:pointer;display:flex;flex-shrink:0;font-size:16px;height:28px;justify-content:center;line-height:1;padding:0;transition:transform .2s ease,background .2s ease;width:28px}.recipeRemove:hover{background:#fff5f5;transform:rotate(90deg)}.recipeAdd{background:none;border:none;color:#f37f20;cursor:pointer;font-size:13px;font-weight:500;gap:8px;margin-top:4px;padding:0}.recipeAdd,.recipeAddCircle{align-items:center;display:flex}.recipeAddCircle{background:#f37f20;border-radius:50%;color:#fff;flex-shrink:0;font-size:18px;height:28px;justify-content:center;line-height:1;transition:transform .25s ease;width:28px}.recipeAdd:hover .recipeAddCircle{transform:rotate(90deg) scale(1.1)}.submitBtnForm{background:linear-gradient(135deg,#f05a28,#f37f20);border:none;border-radius:10px;color:#fff;cursor:pointer;font-size:16px;font-weight:600;letter-spacing:.01em;padding:14px 24px;transition:all .2s;width:100%}.submitBtnForm:hover:not(:disabled){box-shadow:0 6px 16px #f05a2859;opacity:.9;transform:translateY(-2px)}.submitBtnForm:active:not(:disabled){transform:translateY(0) scale(.98)}.submitBtnForm:disabled{cursor:not-allowed;opacity:.6;transform:none}@media screen and (max-width:1024px){.colourLibrary{padding-left:3em;padding-right:3em}.colorGrid{gap:18px;grid-template-columns:repeat(3,1fr)}}@media screen and (max-width:768px){.mainHeader{flex-direction:column;gap:20px;padding:20px;text-align:center}.headerImg{display:none}.colourContent{align-items:center;padding:0;width:100%}.smalltext{padding-left:0}.smalltext:before{display:none}.colourTitle1,.colourTitle2{font-size:42px;padding:0;text-align:center}.colourText{font-size:16px;padding:0;text-align:center}.submitButton{margin:20px 0;width:80%}.colourhighlight{box-sizing:border-box;padding:20px;width:92%}.colourTop{margin:0;padding:0}.colourTitle{font-size:36px;padding:20px 0;text-align:center}.highlightContent{flex-direction:column;gap:20px;margin-right:0;width:100%}.colourImage{box-sizing:border-box;display:flex;justify-content:center;padding-right:30px;width:100%}.colourImage img,.colourImage svg{height:auto;max-width:320px;width:100%}.colourDesc{align-items:center;text-align:center;width:100%}.spotlightName{font-size:38px}.colourRecipe{max-width:100%}.colourTopExp{display:flex;justify-content:center;margin:0;padding:20px 0 10px}.colourLibrary{padding-left:0;padding-right:0}.colorGrid{grid-gap:12px;box-sizing:border-box;display:grid;gap:12px;grid-template-columns:repeat(2,1fr);margin:24px auto 0;padding:0 16px}.colorCardSVGWrapper{height:150px}.colorCardTitle{font-size:14px;line-height:1.3;overflow-wrap:break-word;word-break:normal}.colorCardCode,.colorCardSeries{font-size:11px}.colorCardInfo{padding:10px}.colourForm{box-sizing:border-box;flex-direction:column;gap:40px;max-width:100%;padding:40px 20px}.colourFormText{align-items:center;padding:0;text-align:center;width:100%}.formStepsList{margin-top:20px}.formStep,.formStepsList{text-align:left}.formDetails{box-sizing:border-box;overflow:hidden;padding:25px;width:100%}.formGrid{grid-template-columns:1fr}.fullWidth{grid-column:span 1}.modeRow{flex-wrap:wrap}.modeBtn{flex-basis:calc(50% - 4px);flex-grow:1;flex-shrink:1}.recipeRow{flex-wrap:wrap}.recipeIng{flex:1 1 100%;order:1}.recipeNum{order:0}.recipeAmt{flex:1 1 auto;order:2;width:auto}.recipeUnitLabel{order:3}.recipeRemove{order:4}.uploadHint p{font-size:13px;word-break:break-word}.formGroup input,.formGroup textarea,.recipeAmt,.recipeIng{box-sizing:border-box;max-width:100%}}.verifyBanner{align-items:center;background-color:#fff3cd;border-bottom:1px solid #ffe69c;color:#664d03;display:flex;flex-wrap:wrap;font-size:14px;gap:12px;justify-content:center;padding:10px 16px;text-align:center}.verifyBanner button{background-color:#664d03;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:13px;padding:6px 14px}.verifyBanner button:disabled{cursor:not-allowed;opacity:.6}.verifyBannerError{color:#b02a37;font-size:13px}
/*# sourceMappingURL=main.2a463e20.css.map*/