.pb-board{background:var(--surface);padding:1.25rem .75rem 1.5rem}@media (min-width:48rem){.pb-board{padding:2.5rem}}.pb-head{gap:1rem;padding-inline:.25rem;display:grid}@media (min-width:64rem){.pb-head{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:2rem}}.pb-actions{flex-wrap:wrap;gap:.5rem;display:flex}.pb-actions .btn{flex:auto}@media (min-width:48rem){.pb-actions .btn{flex:none}}.pb-act{position:relative}.pb-act-label{transition:opacity var(--dur) var(--ease-out);align-items:center;gap:.5rem;display:inline-flex}.pb-act:after{content:var(--pb-copied);opacity:0;color:var(--ok);transition:opacity var(--dur) var(--ease-out);pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.pb-act[data-copied] .pb-act-label{opacity:0}.pb-act[data-copied]:after{opacity:1}.pb-act:disabled{opacity:.6}.pb-act[data-palette-action=download]:after{content:"✓";font-size:1.125rem}.pb-group{--stage:6.25rem;--zig:5px;margin-top:2rem}@media (min-width:48rem){.pb-group{--zig:7px;margin-top:2.5rem}}.pb-group-neutrals{--stage:7rem}.pb-group-accents{--stage:7.5rem}@media (min-width:48rem){.pb-group-neutrals{--stage:11rem}.pb-group-lights{--stage:7.25rem}.pb-group-mids{--stage:9rem}.pb-group-deeps{--stage:10rem}.pb-group-accents{--stage:12.5rem}}.pb-group-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.25rem 1rem;margin-bottom:.625rem;padding-inline:.25rem;display:flex}.pb-group-meta{font-family:var(--font-mono);color:var(--muted);font-size:.75rem}.pb-rail{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:1.125rem;margin:0;padding:0;list-style:none;display:grid}.pb-rail>li{border-top:2px solid var(--ink);min-width:0;padding-inline:2px}@media (min-width:48rem){.pb-rail{row-gap:0;display:flex}.pb-rail>li{flex:var(--g,1) 1 0;padding-inline:3px}}.pb-swatch{text-align:left;cursor:copy;-webkit-tap-highlight-color:transparent;border-radius:.25rem;width:100%;display:block}.pb-stage{height:var(--stage);display:block}.pb-hang{height:calc(var(--len,1) * 100%);transform:rotate(var(--tilt,0deg));transform-origin:50% 0;filter:drop-shadow(0 1.5px 1.5px #2c305c47);transition:transform .32s var(--ease-out);display:block}.pb-fabric{--fold-shade:linear-gradient(90deg, transparent calc(var(--fold) - 9%), #00000013 var(--fold), #ffffff1a calc(var(--fold) + 1.5%), transparent calc(var(--fold) + 11%));--rail-shade:linear-gradient(180deg, #0000002b 0, #0000000b .75rem, transparent 1.75rem);background-color:var(--c);background-image:var(--rail-shade), var(--fold-shade), var(--weave);height:100%;-webkit-mask:linear-gradient(#000 0 0) 0 0 / 100% calc(100% - var(--zig) + .5px) no-repeat, conic-gradient(from -45deg at 50% 100%, #000 90deg, #0000 0) 0 100% / calc(var(--zig) * 2) var(--zig) repeat-x;mask:linear-gradient(#000 0 0) 0 0 / 100% calc(100% - var(--zig) + .5px) no-repeat, conic-gradient(from -45deg at 50% 100%, #000 90deg, #0000 0) 0 100% / calc(var(--zig) * 2) var(--zig) repeat-x;display:block;position:relative}.pb-fabric:before{content:"";background:linear-gradient(#ffffff1f,#0000001a);height:.5rem;position:absolute;inset:0 0 auto;box-shadow:0 1px #0000001a}.pb-linen{--weave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath d='M0 .5h12M0 3.5h12M0 9.5h12' stroke='%23fff' stroke-opacity='.13'/%3E%3Cpath d='M0 6.5h12' stroke='%23fff' stroke-opacity='.2'/%3E%3Cpath d='M1.5 0v12M7.5 0v12M10.5 0v12' stroke='%23000' stroke-opacity='.06'/%3E%3Cpath d='M4.5 0v12' stroke='%23000' stroke-opacity='.09'/%3E%3C/svg%3E")}.pb-silk{--weave:linear-gradient(102deg, #00000009 8%, #ffffff4d 40%, #fff0 62%, #00000008 92%), repeating-linear-gradient(90deg, #ffffff0d 0 1px, transparent 1px 2px)}.pb-wool{--weave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .55 0 0 0 -.16'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}.pb-twill{--weave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Cpath d='M-1 1 1-1M0 6l6-6M5 7l2-2' stroke='%23fff' stroke-opacity='.11' stroke-width='1.1'/%3E%3Cpath d='M-1 4l5-5M2 7l5-5' stroke='%23000' stroke-opacity='.13' stroke-width='1.1'/%3E%3C/svg%3E")}.pb-satin{--weave:linear-gradient(112deg, #00000012 4%, #ffffff5c 33%, #ffffff05 46%, #fff3 66%, #00000017 96%), repeating-linear-gradient(0deg, #ffffff0a 0 1px, transparent 1px 3px)}.pb-name{color:var(--ink);-webkit-hyphens:auto;hyphens:auto;overflow-wrap:anywhere;margin-top:.5rem;font-size:.71875rem;font-weight:500;line-height:1.25;display:block}.pb-hex{font-family:var(--font-mono);color:var(--muted);opacity:0;transition:color var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);margin-top:.125rem;font-size:.65625rem;line-height:1.4;display:block;position:relative}.pb-swatch:hover .pb-hex,.pb-swatch:focus-visible .pb-hex,.pb-swatch[data-copied] .pb-hex{opacity:1}@media (min-width:48rem){.pb-name{font-size:.8125rem}.pb-hex{font-size:.75rem}}.pb-hex:after{background:var(--surface);color:var(--ok);font-weight:600;position:absolute;inset:0}.pb-swatch[data-copied] .pb-hex:after{content:var(--pb-copied)}.pb-swatch:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.pb-foot{flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem;margin-top:2.25rem;padding-inline:.25rem;display:flex}.pb-hold{width:100%}@media (min-width:40rem){.pb-hold{width:auto}}@media (hover:hover){.pb-swatch:hover .pb-hex{color:var(--ink)}}@media (hover:hover) and (prefers-reduced-motion:no-preference){.pb-swatch:hover .pb-hang{animation:pb-sway 1.1s var(--ease-out)}}@media (prefers-reduced-motion:no-preference){.pb-swatch:active .pb-hang{transform:rotate(var(--tilt,0deg)) scaleY(.985)}}@keyframes pb-sway{0%{transform:rotate(var(--tilt,0deg))}22%{transform:rotate(calc(var(--tilt,0deg) + 2.4deg))}48%{transform:rotate(calc(var(--tilt,0deg) - 1.3deg))}72%{transform:rotate(calc(var(--tilt,0deg) + .6deg))}to{transform:rotate(var(--tilt,0deg))}}.hb-block{border:1px solid var(--hairline);background:var(--paper);border-radius:.75rem;padding:.75rem .75rem .5rem}.hb-head{justify-content:space-between;align-items:center;gap:.75rem;padding:0 .25rem .5rem;display:flex}.hb-copy{min-height:2.75rem;padding-inline:.875rem;font-size:.875rem}.hb-list{grid-template-columns:minmax(0,1fr);margin:0;padding:0;list-style:none;display:grid}@media (min-width:30rem){.hb-list{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:.5rem}}.prose-ff .hb-list,.prose-ff .hb-list>li{margin:0;padding:0}.prose-ff .hb-list>li:before{content:none}.hb-row{text-align:left;cursor:copy;width:100%;min-height:2.75rem;transition:background-color var(--dur) var(--ease-out);-webkit-tap-highlight-color:transparent;border-radius:.5rem;align-items:center;gap:.625rem;padding:.25rem;display:flex;position:relative}.hb-chip{border-radius:.375rem;flex:none;width:1.75rem;height:1.75rem;box-shadow:inset 0 0 0 1px #0d0d121a}.hb-code{font-family:var(--font-mono);color:var(--ink);flex:none;font-size:.8125rem}.hb-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--muted);font-size:.8125rem;overflow:hidden}@media (hover:hover){.hb-row:hover{background:var(--surface)}}.hb-row[data-copied] .hb-name{color:#0000}.hb-row[data-copied]:after{content:var(--pb-copied);color:var(--ok);font-size:.8125rem;font-weight:600;position:absolute;left:7.1rem}