@import"https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&family=Fira+Sans:wght@300;400;500;600&display=swap";:root{font-family:Fira Sans,sans-serif;font-size:10px;line-height:1;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;--color-dark: #222222;--color-light: #d0d2d4;--color-gray-100: #aaa;--color-gray-200: #eee;--color-blue-400: darkblue;--palette-clr-1: hsla(359, 94%, 62%, 1);--palette-clr-2: hsla(21, 89%, 56%, 1);--palette-clr-3: hsla(33, 94%, 55%, 1);--palette-clr-4: hsla(20, 94%, 63%, 1);--palette-clr-5: hsla(42, 93%, 64%, 1);--palette-clr-6: hsla(94, 38%, 59%, 1);--palette-clr-7: hsla(162, 43%, 46%, 1);--palette-clr-8: hsla(178, 30%, 43%, 1);--palette-clr-9: hsla(208, 25%, 45%, 1);--palette-clr-10: hsla(198, 61%, 39%, 1)}*{margin:0;padding:0;box-sizing:border-box}body{display:grid;grid-template-rows:8rem 1fr 3rem;place-items:center;flex-direction:column;min-width:100vw;min-height:100vh}header{display:grid;grid-template-rows:1fr 1.5rem;place-items:center;width:100%;height:100%;border-bottom:1px solid var(--color-gray-200)}header #palette{display:grid;grid-template-columns:repeat(10,1fr);width:100%;height:100%;min-height:.1rem}header #palette .palette-item{display:grid;height:100%;min-height:1rem;min-width:1rem}h1{font-size:4rem;line-height:1.1}main{display:grid;grid-template-columns:20rem 1fr;width:100vw;height:100%}main aside{display:flex;flex-direction:column;gap:.5rem;padding:5rem 0;height:100%;border-right:1px solid var(--color-gray-200);background-color:var(--color-gray-200);color:var(--color-dark)}main aside label{width:100%;padding:0 1rem;font-size:1.6rem;text-align:right}main aside input#initials{font-size:2rem;padding:0 1rem;border:none;border-bottom:1px solid var(--color-gray-100);color:var(--color-blue-400);text-align:center}main .avatars{display:flex;width:100%;overflow-x:hidden;overflow-y:auto;gap:2rem;justify-content:space-around;justify-items:space-around;align-items:center}main .avatars .avatar-container{display:grid;place-items:center;width:50rem;height:50rem;border-radius:1rem;font-size:3rem}footer{display:flex;gap:2rem;font-size:1.2rem;place-items:center;place-content:center;width:100%;height:100%;background-color:var(--color-gray-200);color:var(--color-gray-100);border-top:1px solid var(--color-gray-200)}footer a{text-decoration:none;color:var(--color-blue-400)}footer a:hover{text-decoration:underline}.palette-clr-bg-1{background-color:var(--palette-clr-1)}.palette-clr-1{color:var(--palette-clr-1)}.palette-clr-bg-2{background-color:var(--palette-clr-2)}.palette-clr-2{color:var(--palette-clr-2)}.palette-clr-bg-3{background-color:var(--palette-clr-3)}.palette-clr-3{color:var(--palette-clr-3)}.palette-clr-bg-4{background-color:var(--palette-clr-4)}.palette-clr-4{color:var(--palette-clr-4)}.palette-clr-bg-5{background-color:var(--palette-clr-5)}.palette-clr-5{color:var(--palette-clr-5)}.palette-clr-bg-6{background-color:var(--palette-clr-6)}.palette-clr-6{color:var(--palette-clr-6)}.palette-clr-bg-7{background-color:var(--palette-clr-7)}.palette-clr-7{color:var(--palette-clr-7)}.palette-clr-bg-8{background-color:var(--palette-clr-8)}.palette-clr-8{color:var(--palette-clr-8)}.palette-clr-bg-9{background-color:var(--palette-clr-9)}.palette-clr-9{color:var(--palette-clr-9)}.palette-clr-bg-10{background-color:var(--palette-clr-10)}.palette-clr-10{color:var(--palette-clr-10)}.dark-bg-clr,.dark-bloc{background-color:var(--color-dark)}.dark-clr,.light-bloc{color:var(--color-dark)}.light-bg-clr,.light-bloc{background-color:var(--color-light)}.light-clr,.dark-bloc{color:var(--color-light)}