@import"https://fonts.googleapis.com/css?family=Fjalla+One:400,500,600,700";@import"https://fonts.googleapis.com/css?family=Noto+Sans:400,500,600,700";@import"https://fonts.googleapis.com/css?family=Andika:400,500,600,700";body{font-family:Andika,sans-serif}h1{text-align:center;font-family:Fjalla One,sans-serif;margin-bottom:24px}.description{text-align:center;padding:0 25%;margin-bottom:24px}@media (max-width: 768px){.description{padding:0 10%}}.search{display:flex;justify-content:center;gap:8px;padding:0 24px;margin-bottom:48px;flex-wrap:wrap}.search>input{border:1px solid #959595;border-radius:8px;padding:8px 12px;font-size:1rem;font-family:inherit;outline:none}.search>input:focus-visible{border:1px solid #e9dfe5}.search>.name-search{min-width:240px}.search>.hex-search{width:120px}.search>.search-delete-btn{position:absolute;top:0;right:8px;bottom:0;margin:auto;border:solid 1px transparent;border-radius:50%;width:24px;height:24px;font-size:.75rem;text-align:center;z-index:1}.search>.search-delete-btn:hover{cursor:pointer;border:solid 1px #ccc}.color-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.color{position:relative;display:block;height:240px;color:transparent;user-select:none;-webkit-user-select:none;-moz-user-select:none;padding:12px;transition:all .3s ease-out;overflow:hidden}.color:hover{color:#fdeff2;cursor:pointer;user-select:auto;-webkit-user-select:auto;-moz-user-select:auto}.color:hover>.color-background{filter:brightness(.5)}.color>.color-background{position:absolute;top:0;left:0;height:100%;width:100%;z-index:-1;transition:all .3s}.color>span{font-size:1rem;display:block;text-transform:uppercase;margin-bottom:4px}.color>.kanji{font-family:Noto Sans,sans-serif;font-size:1.75rem;font-weight:600;margin-bottom:8px}.color>.copy{margin-top:12px;text-transform:none}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1{font-size:3.2em;line-height:1.1}