.c-button{--icon-size:var(--space);--text-font:"PT Root UI",system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;--text-boldness:500;display:inline-block;-webkit-text-decoration:none;text-decoration:none;.c-button__icon,.c-button__text{display:inline-block;vertical-align:middle}.c-button__text{padding-inline:var(--space-sm)}}.c-button__icon[data-glyph]:before{vertical-align:baseline}.c-button__text{--text-boldness:medium;text-transform:uppercase}[role=toolbar] .c-button{margin-inline-start:var(--space)}:root{--base-duration:160ms;--base-easing:cubic-bezier(0.3,0,0.2,1);--unit:1.6rem;--rpx:max(0.0625 * var(--unit));--space:max(1.5 * var(--unit));--space-xxs:max(0.125 * var(--unit));--space-xs:max(0.25 * var(--unit));--space-sm:max(0.5 * var(--unit));--space-md:max(2.5 * var(--unit));--space-lg:max(4 * var(--unit));--space-xl:max(8 * var(--unit));--space-xxl:max(20 * var(--unit));--base-text-boldness:var(--font-normal);--base-text-font:var(--font-sans);--base-text-width:max(36 * var(--unit));--base-line-thickness:max(1.25 * var(--rpx));--base-interligne:1.5;--interligne-xs:1.1;--interligne-sm:1.2;--interligne-md:1.4;--interligne-lg:1.2;--interligne-xl:1.2;--interligne-xxl:1.3;--interligne-xxxl:1.3;--base-text-size:var(--unit);--text-xs:max(0.6875 * var(--unit));--text-sm:max(0.875 * var(--unit));--text-md:max(1.125 * var(--unit));--text-lg:max(1.25 * var(--unit));--text-xl:max(1.75 * var(--unit));--text-xxl:max(2.25 * var(--unit));--text-xxxl:max(3 * var(--unit));--font-thin:100;--font-extra-light:200;--font-light:300;--font-normal:400;--font-medium:500;--font-semi-bold:600;--font-bold:700;--font-extra-bold:800;--font-heavy:900;--font-cursive:"Marck Script",cursive;--font-monospace:"JetBrains Mono",monospace;--font-sans:"PT Sans",sans-serif;--font-serif:"PT Serif",serif;--accent-font:"PT Sans Caption",sans-serif;--icon-font:"Iconic";--read-font:var(--font-sans);--ui-font:"PT Root UI",system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;--shadow-sharp:0 1px 1px rgb(var(--fore-color)/0.25),0 2px 2px rgb(var(--fore-color)/0.2),0 4px 4px rgb(var(--fore-color)/0.15),0 8px 8px rgb(var(--fore-color)/0.1),0 16px 16px rgb(var(--fore-color)/0.05);--inset-shadow-sharp:inset 0 -2px 1px rgb(var(--fore-color)/0.25),inset 0 -3px 2px rgb(var(--fore-color)/0.2),inset 0 -4px 4px rgb(var(--fore-color)/0.15),inset 0 -9px 8px rgb(var(--fore-color)/0.1),inset 0 -18px 16px rgb(var(--fore-color)/0.05);--shadow-diffuse:0 1px 1px rgb(var(--fore-color)/0.08),0 2px 2px rgb(var(--fore-color)/0.12),0 4px 4px rgb(var(--fore-color)/0.16),0 8px 8px rgb(var(--fore-color)/0.2);--shadow-dreamy:0 1px 2px rgb(var(--fore-color)/0.07),0 2px 4px rgb(var(--fore-color)/0.07),0 4px 8px rgb(var(--fore-color)/0.07),0 8px 16px rgb(var(--fore-color)/0.07),0 16px 32px rgb(var(--fore-color)/0.07),0 32px 64px rgb(var(--fore-color)/0.07);--shadow-shorter:0 1px 1px rgb(var(--fore-color)/0.11),0 2px 2px rgb(var(--fore-color)/0.11),0 4px 4px rgb(var(--fore-color)/0.11),0 6px 8px rgb(var(--fore-color)/0.11),0 8px 16px rgb(var(--fore-color)/0.11);--shadow-longer:0 2px 1px rgb(var(--fore-color)/0.09),0 4px 2px rgb(var(--fore-color)/0.09),0 8px 4px rgb(var(--fore-color)/0.09),0 16px 8px rgb(var(--fore-color)/0.09),0 32px 16px rgb(var(--fore-color)/0.09);--shadow-key-umbra-opacity:0.2;--shadow-key-penumbra-opacity:0.14;--shadow-ambient-shadow-opacity:0.12;--shadow-2dp:0 2px 2px 0 rgb(var(--fore-color)/var(--shadow-key-penumbra-opacity)),0 3px 1px -2px rgb(var(--fore-color)/var(--shadow-key-umbra-opacity)),0 1px 5px 0 rgb(var(--fore-color)/var(--shadow-ambient-shadow-opacity));--shadow-3dp:0 3px 4px 0 rgb(var(--fore-color)/var(--shadow-key-penumbra-opacity)),0 3px 3px -2px rgb(var(--fore-color)/var(--shadow-key-umbra-opacity)),0 1px 8px 0 rgb(var(--fore-color)/var(--shadow-ambient-shadow-opacity));--shadow-4dp:0 4px 5px 0 rgb(var(--fore-color)/var(--shadow-key-penumbra-opacity)),0 1px 10px 0 rgb(var(--fore-color)/var(--shadow-ambient-shadow-opacity)),0 2px 4px -1px rgb(var(--fore-color)/var(--shadow-key-umbra-opacity));--shadow-6dp:0 6px 10px 0 rgb(var(--fore-color)/var(--shadow-key-penumbra-opacity)),0 1px 18px 0 rgb(var(--fore-color)/var(--shadow-ambient-shadow-opacity)),0 3px 5px -1px rgb(var(--fore-color)/var(--shadow-key-umbra-opacity));--shadow-8dp:0 8px 10px 1px rgb(var(--fore-color)/var(--shadow-key-penumbra-opacity)),0 3px 14px 2px rgb(var(--fore-color)/var(--shadow-ambient-shadow-opacity)),0 5px 5px -3px rgb(var(--fore-color)/var(--shadow-key-umbra-opacity));--shadow-16dp:0 16px 24px 2px rgb(var(--fore-color)/var(--shadow-key-penumbra-opacity)),0 6px 30px 5px rgb(var(--fore-color)/var(--shadow-ambient-shadow-opacity)),0 8px 10px -5px rgb(var(--fore-color)/var(--shadow-key-umbra-opacity));--shadow-24dp:0 9px 46px 8px rgb(var(--fore-color)/var(--shadow-key-penumbra-opacity)),0 11px 15px -7px rgb(var(--fore-color)/var(--shadow-ambient-shadow-opacity)),0 24px 38px 3px rgb(var(--fore-color)/var(--shadow-key-umbra-opacity));--focus-shadow:0 0 8px rgb(var(--fore-color)/0.18),0 8px 16px rgb(var(--fore-color)/0.36);--inset-shadow-2dp:inset 0 2px 2px 0 rgb(var(--fore-color)/var(--shadow-key-penumbra-opacity)),inset 0 3px 1px -2px rgb(var(--fore-color)/var(--shadow-key-umbra-opacity)),inset 0 1px 5px 0 rgb(var(--fore-color)/var(--shadow-ambient-shadow-opacity));--text-shadow:0 0 1px rgb(var(--fore-color)/0.6),0 1px 2px rgb(var(--fore-color)/0.6)}.o-color{--color:dimgray;--text-font:var(--caption-font);--width:var(--cell-width);.c-list .c-tile{--vertical-space:0;--text-interligne:1;&:after{--text-font:var(--caption-font)}}.c-tile{--icon-code:"\e231";--icon-color:currentColor;--icon-font:"Iconic";--icon-size:var(--unit);--icon-weight:var(--font-normal)}}.o-color{inline-size:var(--width);transition-delay:.16s;transition-property:width;transition-timing-function:var(--easing,ease-in);.c-list{font-feature-settings:"cpsp","salt","ss02","tnum","zero";font-variation-settings:"wght" 250;inline-size:inherit;margin-block-end:unset;margin-block-start:var(--space-xs);padding-inline-start:unset;.c-tile+.c-tile{margin-top:0}.c-tile{align-items:center;background-color:var(--color);block-size:max(2.5 * var(--unit));box-sizing:border-box;-moz-column-gap:var(--unit);column-gap:var(--unit);display:flex;flex-flow:row nowrap;inline-size:inherit;justify-content:space-between;min-block-size:max(2.5 * var(--unit));padding-left:var(--space-sm);padding-right:var(--unit);text-align:right;&:first-child{font-variation-settings:"wght" 440}&:nth-child(2){font-variation-settings:"wght" 420}&:nth-child(3){font-variation-settings:"wght" 380}&:nth-child(4){font-variation-settings:"wght" 330}&:nth-child(5){font-variation-settings:"wght" 300}&:nth-child(6){font-variation-settings:"wght" 280}&:nth-child(7){font-variation-settings:"wght" 260}&:nth-child(8){font-variation-settings:"wght" 240}&:nth-child(9){font-variation-settings:"wght" 200}&:nth-child(10){font-variation-settings:"wght" 150}&:before{margin-left:var(--space)}&:empty:after{all:unset;content:attr(data-tone-wght);font-variation-settings:inherit}}&:last-child{.c-tile{font-variation-settings:"wght" 380}&:empty{background-color:var(--clr-gray-100);border-radius:var(--space-sm);color:var(--clr-green-a700);line-height:max(4 * var(--unit));text-align:center;&:after{content:"NO ACCENTS";font-size:1.2rem;font-variation-settings:"wght" 500}}}}.o-color__head+.c-list{margin-top:var(--space);@container (max-height: 68rem){margin-top:var(--space-sm)}}.c-tile{cursor:pointer;&:before{box-sizing:content-box;color:var(--icon-color);display:inline-block;font-family:var(--icon-font);font-size:var(--icon-size);font-style:normal;font-weight:var(--icon-weight);height:var(--icon-size);line-height:1;text-align:center;text-rendering:geometricPrecision;vertical-align:baseline;width:var(--icon-size);speak:none;content:"\e191";opacity:0;transition:opacity .16s ease}&:hover:before{opacity:1}&.has-copied:before{--icon-size:var(--space);content:"\e153";opacity:1}}}.o-color__head{align-items:flex-start;display:flex;gap:initial;justify-content:stretch;justify-items:stretch;.c-tile{align-items:center;background-color:var(--color);color:var(--clr-white);display:flex;justify-content:center}}.o-color__name{all:unset;border-top:var(--space-sm) solid var(--color);border-top-style:double;color:var(--color);cursor:default;font-feature-settings:"cpsp","ss03";font-size:2.2rem;font-variation-settings:"wght" 500;line-height:1;padding-left:var(--space);padding-top:var(--space-xs);text-align:right;text-transform:uppercase;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}.o-palette{--caption-font:"PT Root VF";--text-font:"PT Root VF";--cell-count:0;--cell-per-row:0;--cell-width:28rem;--color-count:0;--text-interligne:1;--gap-horz:max(2.125 * var(--unit));--gap-vert:max(2.5 * var(--unit));align-items:flex-start;block-size:calc(100dvh - 56rem);display:flex;margin-inline:max(1 * var(--space-lg));overflow:scroll;position:relative;z-index:5}.o-palette__overview{display:grid;grid-auto-flow:row;grid-auto-rows:auto;grid-column-gap:var(--gap-horz);-moz-column-gap:var(--gap-horz);column-gap:var(--gap-horz);grid-row-gap:var(--gap-vert);block-size:-moz-max-content;block-size:max-content;box-sizing:content-box;padding-block-end:max(1 * var(--space));position:relative;row-gap:var(--gap-vert);transition-duration:var(--duration,.16s);transition-property:top,padding,transform,width;transition-timing-function:var(--easing,ease-in);z-index:1}.o-palette{container-name:paletteViewport;container-type:size;@media (--device-handset ){display:block}.o-palette__overview{align-items:flex-start;grid-template-columns:repeat(var(--cell-per-row),var(--cell-width));@media (--device-handset ){position:static}}.c-cell{height:100%;outline:max(1 * var(--pixel)) dashed var(--clr-amber);-webkit-user-select:none;-moz-user-select:none;user-select:none}@container (max-width: 180rem){--cell-width:26rem}@container (min-width: 160rem) and (max-width: 220rem){--cell-width:32rem;--gap-v:2vw}@container (max-height: 86rem){.o-palette__overview{grid-template-columns:repeat(var(--color-count),var(--cell-width));.c-cell{display:contents}}}@container (max-width: 58rem){.o-palette__overview{grid-template-columns:var(--cell-width);.c-cell{display:contents}}}}.o-color__head{@container (max-height: 68rem) AND (max-width: 128rem){min-width:var(--space-lg)}@container (max-height: 92rem){height:max(3 * var(--unit));min-height:0;min-height:auto}}