.index-module__HnR3bW__container{box-sizing:border-box;max-width:900px;margin:1rem auto 2rem;padding:2rem;overflow-x:hidden}.index-module__HnR3bW__recentColors{flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:1.5rem;display:flex}.index-module__HnR3bW__label{color:#666;font-size:.85rem;font-weight:600}.index-module__HnR3bW__labelDark{color:#aaa;font-size:.85rem;font-weight:600}.index-module__HnR3bW__recentSwatch{cursor:pointer;border:2px solid #00000026;border-radius:6px;width:28px;height:28px;padding:0;transition:transform .15s}.index-module__HnR3bW__recentSwatch:hover{transform:scale(1.2)}.index-module__HnR3bW__pickerSection{flex-direction:column;gap:1.5rem;display:flex}.index-module__HnR3bW__pickerRow{flex-wrap:wrap;align-items:center;gap:1.5rem;display:flex}.index-module__HnR3bW__nativeColorPicker{cursor:pointer;background:0 0;border:none;border-radius:12px;width:80px;height:80px;padding:0}.index-module__HnR3bW__nativeColorPicker::-webkit-color-swatch-wrapper{padding:0}.index-module__HnR3bW__nativeColorPicker::-webkit-color-swatch{border:2px solid #00000026;border-radius:12px}.index-module__HnR3bW__pickerInfo{align-items:center;gap:.5rem;display:flex}.index-module__HnR3bW__previewBox{border:2px solid #0000001a;border-radius:12px;justify-content:center;align-items:center;width:100%;height:100px;font-size:1.2rem;display:flex}.index-module__HnR3bW__colorDetails{flex-direction:column;gap:.5rem;display:flex}.index-module__HnR3bW__colorDistance{color:#999;font-size:.85rem;font-style:italic}.index-module__HnR3bW__converterSection{flex-direction:column;gap:1.5rem;display:flex}.index-module__HnR3bW__converterGroup h3{margin:0 0 .5rem;font-size:1rem}.index-module__HnR3bW__inputRow{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.index-module__HnR3bW__paletteSection{flex-direction:column;gap:1.5rem;display:flex}.index-module__HnR3bW__paletteControls{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.index-module__HnR3bW__miniColorPicker{cursor:pointer;background:0 0;border:none;border-radius:8px;width:36px;height:36px;padding:0}.index-module__HnR3bW__miniColorPicker::-webkit-color-swatch-wrapper{padding:0}.index-module__HnR3bW__miniColorPicker::-webkit-color-swatch{border:2px solid #00000026;border-radius:8px}.index-module__HnR3bW__paletteGrid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;display:grid}.index-module__HnR3bW__paletteCard{cursor:pointer;border:1px solid #0000001a;border-radius:12px;transition:transform .15s,box-shadow .15s;overflow:hidden}.index-module__HnR3bW__paletteCard:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000001f}.index-module__HnR3bW__paletteSwatch{width:100%;height:80px}.index-module__HnR3bW__paletteInfo{flex-direction:column;gap:.15rem;padding:.5rem .75rem;display:flex}.index-module__HnR3bW__paletteHex{color:#333;font-size:.85rem;font-weight:600}.index-module__HnR3bW__paletteHexDark{color:#ddd;font-size:.85rem;font-weight:600}.index-module__HnR3bW__paletteName{color:#999;font-size:.75rem}.index-module__HnR3bW__contrastSection{flex-direction:column;gap:1.5rem;display:flex}.index-module__HnR3bW__contrastInputs{flex-wrap:wrap;gap:2rem;display:flex}.index-module__HnR3bW__contrastColorInput{flex-direction:column;gap:.5rem;display:flex}.index-module__HnR3bW__contrastPreview{border:2px solid #0000001a;border-radius:12px;padding:2rem}.index-module__HnR3bW__contrastResults{flex-wrap:wrap;align-items:flex-start;gap:2rem;display:flex}.index-module__HnR3bW__ratioDisplay{flex-direction:column;align-items:center;gap:.25rem;display:flex}.index-module__HnR3bW__ratioValue{color:#333;font-size:2rem;font-weight:700}.index-module__HnR3bW__ratioValueDark{color:#fff;font-size:2rem;font-weight:700}.index-module__HnR3bW__ratioLabel{color:#999;font-size:.85rem}.index-module__HnR3bW__wcagGrid{gap:2rem;display:flex}.index-module__HnR3bW__wcagItem{flex-direction:column;gap:.5rem;display:flex}.index-module__HnR3bW__wcagLevel{color:#f88204;font-size:1.1rem;font-weight:700}.index-module__HnR3bW__seoSection{overflow-wrap:break-word;word-break:break-word;box-sizing:border-box;max-width:900px;margin:2rem auto;padding:2rem}.index-module__HnR3bW__seoSection p,.index-module__HnR3bW__seoSection li{line-height:1.7}.index-module__HnR3bW__seoSection ul{padding-left:1.5rem}:is(body.dark-mode .index-module__HnR3bW__seoSection h2,body.dark-mode .index-module__HnR3bW__seoSection h3){color:#eee!important}:is(body.dark-mode .index-module__HnR3bW__seoSection p,body.dark-mode .index-module__HnR3bW__seoSection li){color:#bbb!important}.index-module__HnR3bW__faqSection{overflow-wrap:break-word;word-break:break-word;box-sizing:border-box;background:#f9f9f9;border-radius:12px;max-width:900px;margin:3rem auto;padding:2rem}.index-module__HnR3bW__faqSection h2{color:#333;margin-top:0;font-size:1.5rem}.index-module__HnR3bW__faqSection summary{cursor:pointer;color:#333;padding:.5rem 0;font-size:1.05rem;font-weight:600}.index-module__HnR3bW__faqSection p{color:#555;margin:.5rem 0 0 1rem;line-height:1.6}body.dark-mode .index-module__HnR3bW__faqSection{background:#1a1a1a!important}:is(body.dark-mode .index-module__HnR3bW__faqSection h2,body.dark-mode .index-module__HnR3bW__faqSection summary){color:#eee!important}body.dark-mode .index-module__HnR3bW__faqSection p{color:#bbb!important}.index-module__HnR3bW__relatedSection{overflow-wrap:break-word;word-break:break-word;box-sizing:border-box;border-top:1px solid #8080804d;max-width:900px;margin:0 auto 2rem;padding:1rem 2rem}.index-module__HnR3bW__relatedSection a{font-weight:600;text-decoration:none}.index-module__HnR3bW__relatedSection .index-module__HnR3bW__internalLinks,.index-module__HnR3bW__relatedSection .index-module__HnR3bW__internalLinks a{color:#f88204}.index-module__HnR3bW__relatedSection .index-module__HnR3bW__externalLinks{color:#666;font-size:.9rem}.index-module__HnR3bW__relatedSection .index-module__HnR3bW__externalLinks a{color:#1e88e5}body.dark-mode .index-module__HnR3bW__relatedSection{border-top-color:#444}body.dark-mode .index-module__HnR3bW__relatedSection .index-module__HnR3bW__externalLinks{color:#aaa}body.dark-mode .index-module__HnR3bW__relatedSection .index-module__HnR3bW__externalLinks a{color:#64b5f6}body.dark-mode .index-module__HnR3bW__previewBox{border-color:#ffffff1a}body.dark-mode .index-module__HnR3bW__paletteCard{border-color:#444}body.dark-mode .index-module__HnR3bW__contrastPreview{border-color:#ffffff1a}body.dark-mode .index-module__HnR3bW__wcagItem{color:#ccc}body.dark-mode .index-module__HnR3bW__wcagItem div{color:#ccc}:is(body.dark-mode .index-module__HnR3bW__pickerInfo,body.dark-mode .index-module__HnR3bW__inputRow,body.dark-mode .index-module__HnR3bW__converterGroup){color:#ccc}@media (max-width:600px){.index-module__HnR3bW__container{padding:1rem}.index-module__HnR3bW__pickerRow{flex-direction:column;align-items:flex-start}.index-module__HnR3bW__contrastInputs{flex-direction:column;gap:1rem}.index-module__HnR3bW__contrastResults{flex-direction:column}.index-module__HnR3bW__paletteGrid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.index-module__HnR3bW__paletteControls{flex-direction:column;align-items:flex-start}.index-module__HnR3bW__inputRow{flex-wrap:wrap}.index-module__HnR3bW__wcagGrid{flex-direction:column;gap:1rem}}@media (max-width:360px){.index-module__HnR3bW__container{padding:.5rem}.index-module__HnR3bW__nativeColorPicker{width:60px;height:60px}.index-module__HnR3bW__previewBox{height:70px;font-size:1rem}.index-module__HnR3bW__paletteGrid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.5rem}.index-module__HnR3bW__paletteSwatch{height:60px}.index-module__HnR3bW__ratioValue,.index-module__HnR3bW__ratioValueDark{font-size:1.5rem}.index-module__HnR3bW__seoSection,.index-module__HnR3bW__faqSection,.index-module__HnR3bW__relatedSection{padding:1rem}}@media (max-width:260px){.index-module__HnR3bW__paletteGrid{grid-template-columns:1fr}.index-module__HnR3bW__inputRow{gap:.25rem}.index-module__HnR3bW__nativeColorPicker{width:48px;height:48px}.index-module__HnR3bW__previewBox{height:60px;font-size:.85rem}.index-module__HnR3bW__seoSection,.index-module__HnR3bW__faqSection,.index-module__HnR3bW__relatedSection{margin-left:0;margin-right:0;padding:.5rem}.index-module__HnR3bW__recentSwatch{width:22px;height:22px}.index-module__HnR3bW__contrastPreview{padding:1rem}.index-module__HnR3bW__contrastPreview p{font-size:.85rem!important}}
