.board{font-family:var(--graphik);color:#111;-webkit-user-select:none;user-select:none;transition:background-color .6s;position:fixed;inset:0;overflow:hidden}.board button{font:inherit}.board button:focus-visible,.board [role=button]:focus-visible{outline:calc(var(--u) * 2) solid #111;outline-offset:calc(var(--u) * 2)}.board-tile{--board-move:.46s cubic-bezier(.3, .85, .2, 1);--board-delay:calc(var(--i,0) * 70ms + .12s);border-radius:calc(var(--u) * 24);background:var(--board-tile);transition:left var(--board-move), top var(--board-move), width var(--board-move), height var(--board-move), border-radius var(--board-move), background-color .6s ease, opacity .5s ease var(--board-delay), transform .62s cubic-bezier(.2, .8, .2, 1) var(--board-delay);position:absolute;overflow:hidden;container-type:size}.board-tall .board-tile{border-radius:calc(var(--u) * 20)}.board-tile-proof{z-index:5}.board-tile-zoom{z-index:20}.board-tile-hero{background:#e4dfd6}.board-tile-bar{z-index:4;color:#fff;background:#111}.board-entering .board-tile:not(.board-tile-bar),.board-reveal .board-tile:not(.board-tile-hero){opacity:0;transform:translateY(calc(var(--u) * 18)) scale(.97);pointer-events:none;transition-delay:0s}.board-reveal .board-tile-hero{z-index:30;border-radius:0}.board-tile-hero{--board-move:.8s cubic-bezier(.65, 0, .2, 1)}.board-unplaced{--u:clamp(.82px, 100vw / 390, 1.9px)}.board-unplaced .board-tile-bar{left:calc(var(--u) * 10);right:calc(var(--u) * 10);bottom:calc(var(--u) * 10 + env(safe-area-inset-bottom));height:calc(var(--u) * var(--board-bar-tall));border-radius:calc(var(--u) * 20)}@media (min-width:521px){.board-unplaced{--bw:min(100vw, 56vh);--u:clamp(.82px, var(--bw) / 390, 1.9px)}.board-unplaced .board-tile-bar{left:calc((100vw - var(--bw)) / 2 + var(--u) * 10);width:calc(var(--bw) - var(--u) * 20);right:auto}}@media (min-width:900px) and (min-aspect-ratio:6/5){.board-unplaced{--bw:min(100vw, 172vh);--u:clamp(.7px, min(100vw / 1440, 100vh / 900), 1.6px)}.board-unplaced .board-tile-bar{left:calc((100vw + var(--bw)) / 2 - var(--u) * 14 - var(--bw) * .262);width:calc(var(--bw) * .262);bottom:calc(var(--u) * 14);height:calc(var(--u) * var(--board-bar-wide));border-radius:calc(var(--u) * 24)}}.board-kicker{font-size:calc(var(--u) * 12.5);letter-spacing:.005em;opacity:.6;white-space:nowrap;font-weight:500;line-height:1.2}.board-dim{opacity:.36}.board-tile-head{justify-content:space-between;gap:calc(var(--u) * 8);display:flex}.board-empty{padding:calc(var(--u) * 20) calc(var(--u) * 22);flex-direction:column;justify-content:space-between;display:flex;position:absolute;inset:0}.board-empty p{max-width:17em;font-size:calc(var(--u) * 15);opacity:.36;margin:0;line-height:1.38}.board-tall .board-empty{padding:calc(var(--u) * 12) calc(var(--u) * 13)}.board-tall .board-empty p{font-size:calc(var(--u) * 12.5)}.board-hero{transition:color .3s;position:absolute;inset:0}.board-field{position:absolute;inset:0}.board-field-layer{will-change:clip-path;position:absolute;inset:0}.board-hero-mast{z-index:1;position:absolute;top:0;left:0;right:0}.board-hero-kicker{justify-content:space-between;align-items:flex-end;gap:calc(var(--u) * 12);padding-bottom:calc(var(--u) * 5);opacity:1;display:flex}.board-hero-kicker>span{opacity:.6}.board-hero-kicker,.board-cap-top,.board-cap-note{transition:font-size .8s cubic-bezier(.65,0,.2,1)}.board-reveal.board-wide .board-hero-kicker{font-size:calc(var(--u) * 17)}.board-reveal.board-wide .board-hero-headline{margin-top:calc(var(--u) * 10);font-size:calc(var(--u) * 26)}.board-reveal.board-wide .board-cap{padding:calc(var(--u) * 14) calc(var(--u) * 22) calc(var(--u) * 16);border-radius:calc(var(--u) * 20)}.board-reveal.board-wide .board-cap-top{font-size:calc(var(--u) * 30)}.board-reveal.board-wide .board-cap-top span{font-size:calc(var(--u) * 18)}.board-reveal.board-wide .board-cap-note{font-size:calc(var(--u) * 20)}.board-hero-kicker>.board-hero-aside{opacity:.5}.board-hero-name{letter-spacing:-.04em;white-space:nowrap;margin:0;font-weight:500;line-height:.98}.board-hero-status{letter-spacing:-.02em;opacity:.46;white-space:nowrap;margin:0;font-weight:400}.board-hero-headline{margin:calc(var(--u) * 5) 0 0;font-size:calc(var(--u) * 15.5);line-height:1.2}.board-hero-figure{z-index:2;pointer-events:none;position:absolute;inset:0}.board-fig{isolation:isolate;-webkit-mask-composite:source-in;position:absolute;-webkit-mask-composite:source-in;mask-composite:intersect}.board-fig-img{width:100%;height:100%;display:block;position:absolute;inset:0;-webkit-mask-size:100% 100%;mask-size:100% 100%}.board-fig-dye{isolation:isolate;transition:background-color .32s,opacity .3s;position:absolute;inset:0;-webkit-mask-size:100% 100%;mask-size:100% 100%}.board-fig-shade{mix-blend-mode:hard-light;width:100%;height:100%;display:block;position:absolute;inset:0}.board-fig-sheen{z-index:4;opacity:0;background:linear-gradient(100deg,#0000 38%,#ffffff57 50%,#0000 62%) 0 0/320% 100% no-repeat;transition:opacity .3s;position:absolute;inset:0;-webkit-mask-size:100% 100%;mask-size:100% 100%}.board-fig-sheen.board-on{opacity:1;animation:1.7s cubic-bezier(.45,0,.3,1) infinite board-sheen}@keyframes board-sheen{0%{background-position:120% 0}to{background-position:-20% 0}}.board-cap{z-index:3;border-radius:calc(var(--u) * 15);padding:calc(var(--u) * 9) calc(var(--u) * 15) calc(var(--u) * 11);transition:background-color .3s;position:absolute}.board-cap-top{font-size:calc(var(--u) * 21);white-space:nowrap;line-height:1.2;animation:.24s ease-out board-cap-in}.board-cap-top b{letter-spacing:-.01em;font-weight:500}.board-cap-top span{font-size:calc(var(--u) * 14);opacity:.72;margin-left:.55em}.board-cap-note{font-size:calc(var(--u) * 15.5);opacity:.9;margin-top:calc(var(--u) * 1);line-height:1.3;animation:.24s ease-out board-cap-in}.board-cap-making{align-items:center;gap:calc(var(--u) * 6);font-size:calc(var(--u) * 12.5);margin-top:calc(var(--u) * 5);opacity:.8;display:flex}.board-cap-making:before{content:"";width:calc(var(--u) * 6);height:calc(var(--u) * 6);background:currentColor;border-radius:50%;animation:1.2s ease-in-out infinite board-breathe}@keyframes board-cap-in{0%{opacity:.2;transform:translateY(3px)}}@keyframes board-breathe{50%{opacity:.3}}.board-tall .board-cap{border-radius:calc(var(--u) * 12);padding:calc(var(--u) * 7) calc(var(--u) * 11) calc(var(--u) * 8)}.board-tall .board-cap-top{font-size:calc(var(--u) * 17)}.board-tall .board-cap-top span{font-size:calc(var(--u) * 12.5)}.board-tall .board-cap-note{font-size:calc(var(--u) * 13.5)}.board-error{z-index:6;place-content:center;justify-items:center;gap:calc(var(--u) * 18);padding:calc(var(--u) * 28);text-align:center;color:#111;background:#f4f1eced;display:grid;position:absolute;inset:0}.board-error p{max-width:15em;font-size:calc(var(--u) * 22);letter-spacing:-.015em;margin:0;line-height:1.25}.board-reveal .board-error{background:var(--paper)}.board-error button{color:#fff;padding:calc(var(--u) * 13) calc(var(--u) * 24);font-size:calc(var(--u) * 16);background:#111;border:0;border-radius:999px;font-weight:500}.board-callouts{z-index:2;pointer-events:none;position:absolute;inset:0}.board-callouts-scrim{position:absolute;bottom:0;left:0;right:0}.board-callouts-lines{position:absolute;inset:0;overflow:visible}.board-callouts-lines path{fill:none;stroke-linecap:round}.board-callouts-halo{stroke:#ffffffbf;stroke-width:calc(var(--u) * 3.6)}.board-callouts-ink{stroke:#111;stroke-width:calc(var(--u) * 1.3)}.board-callouts-lines circle{fill:#111;stroke:#ffffffd9;stroke-width:calc(var(--u) * 1.6)}.board-callout{align-items:center;gap:calc(var(--u) * 5);text-align:center;flex-direction:column;display:flex;position:absolute}.board-callout .board-loupe-wrap{margin-bottom:calc(var(--u) * 4)}.board-callout .board-loupe{box-shadow:0 0 0 calc(var(--u) * 2) #ffffffe6;transition:box-shadow .3s}.board-callout .board-loupe-dot{box-shadow:0 0 0 calc(var(--u) * 2.5) #e4dfd6}.board-callout-on .board-loupe{box-shadow:0 0 0 calc(var(--u) * 2.5) #111}.board-callout-on .board-loupe img{transform:scale(1.5)}.board-callout .board-kicker{font-size:calc(var(--u) * 12)}.board-callout-name{max-width:100%;padding:0 calc(var(--u) * 3);font-weight:500;font-size:calc(var(--u) * 14.5);letter-spacing:-.01em;text-wrap:balance;line-height:1.15;display:block}.board-wide .board-callout .board-kicker{font-size:calc(var(--u) * 13.5)}.board-wide .board-callout-name{font-size:calc(var(--u) * 19)}.board-crop{aspect-ratio:1;border-radius:50%;display:block;position:relative;overflow:hidden}.board-crop img{max-width:none;transition:transform 1.4s cubic-bezier(.3,.6,.2,1);display:block;position:absolute}.board-coloring{padding:calc(var(--u) * 20) calc(var(--u) * 22) calc(var(--u) * 14);flex-direction:column;display:flex;position:absolute;inset:0}.board-coloring-rows{flex-direction:column;flex:1;justify-content:space-evenly;min-height:0;display:flex}.board-feature{align-items:center;gap:calc(var(--u) * 20);animation:.55s cubic-bezier(.2,.8,.2,1) both board-rise;display:flex}.board-loupe-wrap{width:min(calc(var(--u) * 100), 19cqh);flex:none;position:relative}.board-loupe{width:100%;box-shadow:0 0 0 calc(var(--u) * 1) #11111114}.board-loupe-dot{width:36%;height:36%;box-shadow:0 0 0 calc(var(--u) * 3) var(--board-tile);border-radius:50%;transition:box-shadow .6s;position:absolute;bottom:-3%;right:-7%}.board-feature-on .board-loupe img{transform:scale(1.6)}.board-feature-on .board-loupe{box-shadow:0 0 0 calc(var(--u) * 2.5) #111}.board-feature-text{gap:calc(var(--u) * 4);flex-direction:column;min-width:0;display:flex}.board-feature-name{font-size:calc(var(--u) * 23);letter-spacing:-.02em;line-height:1.12}.board-feature-hex{opacity:.34;font-variant-numeric:tabular-nums}@keyframes board-rise{0%{opacity:0;transform:translateY(calc(var(--u) * 12))}}.board-coloring-small{padding:calc(var(--u) * 12) calc(var(--u) * 13) calc(var(--u) * 10)}.board-coloring-small .board-coloring-rows{align-content:space-evenly;justify-items:center;gap:calc(var(--u) * 4);margin-top:calc(var(--u) * 6);grid-template-columns:1fr 1fr;display:grid}.board-coloring-small .board-feature{gap:calc(var(--u) * 4);flex-direction:column}.board-coloring-small .board-loupe-wrap{width:min(30cqw,27cqh)}.board-coloring-small .board-feature .board-kicker{font-size:calc(var(--u) * 11)}.board-coloring-small .board-loupe-dot{box-shadow:0 0 0 calc(var(--u) * 2) var(--board-tile)}.board-read{padding:calc(var(--u) * 20) calc(var(--u) * 22) calc(var(--u) * 22);flex-direction:column;display:flex;position:absolute;inset:0}.board-read-headline{margin:calc(var(--u) * 14) 0 0;font-size:calc(var(--u) * 37);letter-spacing:-.032em;text-wrap:balance;font-weight:500;line-height:1.04}.board-read-why{margin:calc(var(--u) * 12) 0 0;font-size:calc(var(--u) * 15.5);opacity:.7;text-wrap:pretty;line-height:1.42}.board-axes{gap:calc(var(--u) * 13);padding-top:calc(var(--u) * 12);flex-direction:column;margin-top:auto;display:flex}.board-axis{align-items:center;gap:calc(var(--u) * 10);font-size:calc(var(--u) * 12.5);opacity:.28;grid-template-columns:3em 1fr 3em;transition:opacity .4s;display:grid}.board-axis[data-on]{opacity:1}.board-axis span:last-child{text-align:right}.board-axis span{opacity:.6}.board-axis-line{height:calc(var(--u) * 2);background:#11111121;border-radius:2px;position:relative}.board-axis-line i{width:calc(var(--u) * 13);height:calc(var(--u) * 13);margin:calc(var(--u) * -6.5);background:#111;border-radius:50%;position:absolute;top:50%}.board-palette{padding:calc(var(--u) * 16) calc(var(--u) * 20) calc(var(--u) * 20);gap:calc(var(--u) * 22);touch-action:none;cursor:pointer;display:flex;position:absolute;inset:0}.board-group{gap:calc(var(--u) * 10);flex-direction:column;min-width:0;display:flex}.board-group-best{flex:12}.board-group-neutrals{flex:4}.board-group-metal{flex:1.5;align-items:flex-end}.board-group-metal .board-chips{align-self:stretch}.board-group-avoid{flex:4}.board-chips{gap:calc(var(--u) * 5);flex:1;align-items:flex-end;min-height:0;display:flex}.board-chip{border-radius:calc(var(--u) * 9);cursor:pointer;border:0;flex:1;min-width:0;height:76%;padding:0;transition:height .28s cubic-bezier(.3,1.5,.4,1),flex-grow .28s cubic-bezier(.3,1.2,.4,1);animation:.42s cubic-bezier(.2,1.3,.3,1) both board-chip-in;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #11111112}.board-chip-on{flex-grow:1.7;height:100%}.board-chip-empty{box-shadow:none;background:#1111110e;animation:none;display:block}span.board-chip-empty{cursor:default}.board-waiting .board-chip-empty{animation:1.9s ease-in-out infinite board-wait}@keyframes board-wait{0%,60%,to{background:#1111110e}25%{background:#11111126}}.board-chip-struck:after{content:"";opacity:.75;background:linear-gradient(to top right,#0000 calc(50% - .8px),currentColor calc(50% - .8px) calc(50% + .8px),#0000 calc(50% + .8px));position:absolute;inset:0}.board-metal{aspect-ratio:1;border-radius:50%;align-self:center;width:min(100%,56cqh);margin:0 auto;display:block;box-shadow:inset 0 0 0 1px #1111111a}@keyframes board-chip-in{0%{opacity:0;transform:translateY(40%)scale(.7)}}.board-palette-small{padding:calc(var(--u) * 10) calc(var(--u) * 11);gap:calc(var(--u) * 10)}.board-palette-small .board-chips{gap:calc(var(--u) * 3.5)}.board-palette-small .board-chip{border-radius:calc(var(--u) * 7);height:78%}.board-palette-small .board-chip-on{flex-grow:1.9;height:100%}.board-avoid{padding:calc(var(--u) * 20) calc(var(--u) * 22) calc(var(--u) * 12);flex-direction:column;display:flex;position:absolute;inset:0}.board-avoid-rows{min-height:0;margin-top:calc(var(--u) * 6);flex-direction:column;flex:1;justify-content:space-evenly;display:flex}.board-avoid-row{align-items:center;gap:calc(var(--u) * 12);width:calc(100% + var(--u) * 16);margin:0 calc(var(--u) * -8);padding:calc(var(--u) * 4) calc(var(--u) * 8);border-radius:calc(var(--u) * 12);text-align:left;color:inherit;background:0 0;border:0;transition:background-color .2s;animation:.45s cubic-bezier(.2,.8,.2,1) both board-rise;display:flex}.board-avoid-row:hover,.board-avoid-on{background:#1111110f}.board-avoid-wait{height:calc(var(--u) * 40);animation:none}.board-avoid-row i{width:calc(var(--u) * 30);height:calc(var(--u) * 30);border-radius:calc(var(--u) * 8);width:calc(var(--u) * 34);height:calc(var(--u) * 34);border-radius:calc(var(--u) * 9);flex:none;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #1111111a}.board-avoid-row div{gap:calc(var(--u) * 1);flex-direction:column;min-width:0;display:flex}.board-avoid-row b{font-weight:500;font-size:calc(var(--u) * 15.5);white-space:nowrap;letter-spacing:-.005em;line-height:1.15}.board-avoid-row span{font-size:calc(var(--u) * 13);opacity:.56;white-space:nowrap;text-overflow:ellipsis;line-height:1.2;overflow:hidden}.board-proof{cursor:pointer;touch-action:manipulation;outline:none;position:absolute;inset:0}.board-proof-drag{touch-action:none;cursor:ew-resize}.board-proof-side{transition:background-color .4s;position:absolute;inset:0}.board-proof-line{z-index:4;width:calc(var(--u) * 2);margin-left:calc(var(--u) * -1);pointer-events:none;background:#fff;position:absolute;top:0;bottom:0}.board-proof-line i{width:calc(var(--u) * 36);height:calc(var(--u) * 36);margin:calc(var(--u) * -18);color:#111;box-shadow:0 calc(var(--u) * 2) calc(var(--u) * 10) #0000002e;background:#fff;border-radius:50%;place-items:center;display:grid;position:absolute;top:72%;left:50%}.board-proof-line svg{width:calc(var(--u) * 20);height:calc(var(--u) * 20)}.board-proof-label{z-index:5;top:calc(var(--u) * 10);border-radius:calc(var(--u) * 13);max-width:47%;padding:calc(var(--u) * 8) calc(var(--u) * 12) calc(var(--u) * 10);pointer-events:none;flex-direction:column;display:flex;position:absolute}.board-proof-best{left:calc(var(--u) * 10)}.board-proof-worst{right:calc(var(--u) * 10);text-align:right;align-items:flex-end}.board-proof-label b{font-weight:500;font-size:calc(var(--u) * 19);letter-spacing:-.02em;margin-top:calc(var(--u) * 2);line-height:1.08}.board-proof-label em{font-style:normal;font-size:calc(var(--u) * 15);opacity:.88;margin-top:calc(var(--u) * 5);line-height:1.25;display:none}.board-proof-status{z-index:5;bottom:calc(var(--u) * 12);padding:calc(var(--u) * 5) calc(var(--u) * 11);color:#fff;font-size:calc(var(--u) * 12);white-space:nowrap;background:#111111b8;border-radius:999px;animation:1.6s ease-in-out infinite board-breathe;position:absolute;left:50%;transform:translate(-50%)}.board-proof-done{z-index:6;top:calc(var(--u) * 16);right:calc(var(--u) * 16);color:#111;padding:calc(var(--u) * 10) calc(var(--u) * 20);font-size:calc(var(--u) * 15.5);box-shadow:0 calc(var(--u) * 4) calc(var(--u) * 18) #0000001f;background:#f4f1ec;border-radius:999px;font-weight:500;position:absolute}.board-proof-open .board-proof-label{top:auto;bottom:calc(var(--u) * 22);padding:calc(var(--u) * 14) calc(var(--u) * 20) calc(var(--u) * 17);border-radius:calc(var(--u) * 20);max-width:44%}.board-proof-open .board-proof-best{left:calc(var(--u) * 22)}.board-proof-open .board-proof-worst{right:calc(var(--u) * 22)}.board-proof-open .board-proof-label b{font-size:calc(var(--u) * 44)}.board-proof-open .board-proof-label em{font-size:calc(var(--u) * 17);display:block}.board-proof-open .board-proof-label .board-kicker{font-size:calc(var(--u) * 14)}.board-proof-open .board-proof-line i{width:calc(var(--u) * 52);height:calc(var(--u) * 52);margin:calc(var(--u) * -26)}.board-tall .board-proof:not(.board-proof-open) .board-proof-line i{display:none}.board-tall .board-proof:not(.board-proof-open) .board-proof-label{top:calc(var(--u) * 6);padding:calc(var(--u) * 5) calc(var(--u) * 8) calc(var(--u) * 6);border-radius:calc(var(--u) * 9);max-width:48%}.board-tall .board-proof:not(.board-proof-open) .board-proof-best{left:calc(var(--u) * 6)}.board-tall .board-proof:not(.board-proof-open) .board-proof-worst{right:calc(var(--u) * 6)}.board-tall .board-proof:not(.board-proof-open) .board-proof-label b{display:none}.board-tall .board-proof:not(.board-proof-open) .board-proof-label .board-kicker{font-size:calc(var(--u) * 10)}.board-proof-open .board-proof-status{bottom:auto;top:calc(var(--u) * 20);font-size:calc(var(--u) * 13.5)}.board-tall .board-proof:not(.board-proof-open) .board-proof-status{font-size:calc(var(--u) * 10);bottom:calc(var(--u) * 7);padding:calc(var(--u) * 3) calc(var(--u) * 8)}.board-tall .board-proof-open .board-proof-label{bottom:calc(var(--u) * 12);padding:calc(var(--u) * 10) calc(var(--u) * 13) calc(var(--u) * 12);border-radius:calc(var(--u) * 15);max-width:47%}.board-tall .board-proof-open .board-proof-best{left:calc(var(--u) * 10)}.board-tall .board-proof-open .board-proof-worst{right:calc(var(--u) * 10)}.board-tall .board-proof-open .board-proof-label b{font-size:calc(var(--u) * 25)}.board-tall .board-proof-open .board-proof-label em{font-size:calc(var(--u) * 13.5)}.board-tall .board-proof-open .board-proof-label .board-kicker{font-size:calc(var(--u) * 12)}@media (prefers-reduced-motion:reduce){.board-tile,.board-chip,.board-crop img{transition:none}.board-entering .board-tile,.board-reveal .board-tile{transform:none}.board-chip,.board-feature,.board-avoid-row,.board-fig-sheen.board-on,.board-proof-status,.board-cap-making:before,.board-waiting .board-chip-empty{animation:none}}