.example3.svelte-19qlk0c{position:relative;overflow-x:hidden;min-height:100%;display:flex;justify-content:center;align-items:stretch;background-color:var(--bgColor);padding:1rem}.example3.svelte-19qlk0c .content:where(.svelte-19qlk0c){width:100%;max-width:600px;min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;row-gap:1px}.example3.svelte-19qlk0c .palette[role=main].palette__custom{background-color:#fff}@media screen and (max-width: 640px){.example3.svelte-19qlk0c .palette[role=main].palette__custom .palette__cells{grid-template-columns:repeat(var(--num-columns),minmax(1rem,1fr));column-gap:0}}.example3.svelte-19qlk0c .header:where(.svelte-19qlk0c){width:100%}.example3.svelte-19qlk0c .header:where(.svelte-19qlk0c)>h1:where(.svelte-19qlk0c){font-size:1rem;font-weight:700;margin-bottom:.5rem}.example3.svelte-19qlk0c .slot:where(.svelte-19qlk0c){width:100%;display:flex;flex-direction:column;row-gap:.5rem}@media screen and (max-width: 320px){.example3.svelte-19qlk0c .slot:where(.svelte-19qlk0c){row-gap:0}}.example3.svelte-19qlk0c .slot__color:where(.svelte-19qlk0c){width:100%;max-width:50px;height:50px;background-color:var(--color)}.example3.svelte-19qlk0c .slot__color-rank:where(.svelte-19qlk0c){font-size:0,9rem;font-weight:700}@media screen and (max-width: 320px){.example3.svelte-19qlk0c .slot__color-rank:where(.svelte-19qlk0c){display:none}}.example3.svelte-19qlk0c .slot__color-label:where(.svelte-19qlk0c){font-size:.6rem;font-weight:400}@media screen and (max-width: 640px){.example3.svelte-19qlk0c .slot__color-label:where(.svelte-19qlk0c){display:none}}