/* PaintColorKE colour mixing (Creative 1.70.0, 1.71.0): the mixer page, the Mixing guide and the colour recipes page. GPL-2.0-or-later. */
.pcke-mixing,.pcke-mx-host{--gs-shadow:0 1px 2px rgba(17,17,19,.06),0 10px 28px -16px rgba(17,17,19,.3)}
html[data-theme="dark"] .pcke-mixing,html[data-theme="dark"] .pcke-mx-host{--gs-shadow:inset 0 0 0 1px rgba(255,255,255,.07),0 10px 26px -16px rgba(0,0,0,.7)}
.pcke-mixing__app:has(>.pcke-gen__loading){min-height:1100px}
.pcke-mx__modes{margin:0 0 18px}
.pcke-mx-blob{display:block;width:100%;height:auto;filter:drop-shadow(0 6px 6px rgba(40,30,20,.22)) drop-shadow(0 1px 1px rgba(40,30,20,.25))}
.pcke-mx-smear{display:block;width:100%;height:100%;filter:drop-shadow(0 10px 12px rgba(40,30,20,.22))}
.pcke-mx-tube{display:block;width:100%;height:auto;filter:drop-shadow(0 3px 3px rgba(0,0,0,.2))}
.pcke-mx-studio{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:24px;align-items:start}
.pcke-mx-board{display:grid;gap:18px;padding:24px;border-radius:26px;background:radial-gradient(120% 90% at 30% 0%,#FFFDF8,#F2EDE3);box-shadow:var(--gs-shadow)}
html[data-theme="dark"] .pcke-mx-board,html[data-theme="dark"] .pcke-mx-vs,html[data-theme="dark"] .pcke-mx-pal{background:radial-gradient(120% 90% at 30% 0%,#2C2A27,#1F1E1C)}
.pcke-mx-board__palette{position:relative;aspect-ratio:1.45;border-radius:48% 52% 46% 54%/56% 50% 50% 44%;background:radial-gradient(90% 80% at 40% 30%,#FFFFFF,#F4F1EA 70%,#E6E0D4);box-shadow:inset 0 -10px 30px rgba(120,100,70,.18),inset 0 4px 10px rgba(255,255,255,.9),0 26px 40px -24px rgba(60,45,25,.55)}
.pcke-mx-board__palette::after{content:"";position:absolute;left:9%;bottom:16%;width:12%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 30%,#D9D1C2,#EFE9DD);box-shadow:inset 0 6px 12px rgba(70,50,25,.5),0 1px 0 rgba(255,255,255,.9)}
.pcke-mx-well{position:absolute;left:calc(50% + 39% * cos(var(--a) - 90deg) - 7%);top:calc(50% + 36% * sin(var(--a) - 90deg) - 10%);width:14%;display:grid;justify-items:center}
.pcke-mx-well b{font:700 13px/1 var(--pcke-font);color:#5A4E3E;margin-top:2px}
.pcke-mx-well.is-empty i{display:block;width:76%;aspect-ratio:1;margin-top:12%;border-radius:50%;background:radial-gradient(circle at 50% 35%,#ECE7DD,#FBF9F4 70%);box-shadow:inset 0 5px 9px rgba(90,70,40,.22),0 1px 0 rgba(255,255,255,.9)}
.pcke-mx-board__mix{position:absolute;left:31%;top:24%;width:38%}
.pcke-mx-res{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:18px;align-items:center}
.pcke-mx-res__smear{aspect-ratio:2/1}
.pcke-mx-res__info{display:grid;gap:4px;min-width:0}
.pcke-mx-res__info b{font:700 22px/1.2 "PCKE Poppins",var(--pcke-font);color:var(--pcke-ink)}
.pcke-mx-res__info code{font:600 15px var(--pcke-mono,ui-monospace,monospace);color:var(--pcke-ink);background:none;padding:0}
.pcke-mx-res__info small{font-size:13px;color:var(--pcke-muted)}
.pcke-mx-res__info .pcke-cr-actions{margin-top:8px}
.pcke-mx-side{display:grid;gap:14px;min-width:0}
.pcke-mx-on{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.pcke-mx-on li{display:grid;grid-template-columns:40px minmax(0,1fr) 34px 30px 34px;gap:8px;align-items:center;padding:4px 6px;border-radius:12px;background:var(--pcke-bg-soft)}
.pcke-mx-on li>span{font-weight:600;font-size:14px;color:var(--pcke-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pcke-mx-on li>b{text-align:center;font:700 15px var(--pcke-font);color:var(--pcke-ink)}
html body .pcke-mx-on button{width:34px;height:34px;min-height:0;margin:0;padding:0;border:0;border-radius:50%;background:var(--pcke-surface,#fff);color:var(--pcke-ink);font:700 18px/1 var(--pcke-font);cursor:pointer;box-shadow:inset 0 0 0 1px var(--pcke-line)}
html body .pcke-mx-on button:hover{background:var(--pcke-ink);color:var(--pcke-surface,#fff)}
.pcke-mx-tubes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:2px}
.pcke-mx-g{grid-column:1/-1;margin:10px 0 2px;font:700 12px/1.2 var(--pcke-font);letter-spacing:.06em;text-transform:uppercase;color:var(--pcke-muted)}
html body .pcke-mx-t{display:grid;justify-items:center;align-content:start;gap:8px;min-height:0;margin:0;padding:12px 4px 10px;border:0;border-radius:14px;background:none;color:var(--pcke-ink);font:600 12.5px/1.25 var(--pcke-font);text-align:center;cursor:pointer;box-shadow:none}
html body .pcke-mx-t:hover{background:var(--pcke-bg-soft);color:var(--pcke-ink)}
.pcke-mx-t .pcke-mx-tube{width:38px;transition:transform .3s cubic-bezier(.22,1,.36,1)}
.pcke-mx-t:hover .pcke-mx-tube{transform:translateY(-4px) rotate(-6deg)}
.pcke-mx-t:focus-visible,.pcke-mx-cell:focus-visible,.pcke-mx-rc:focus-visible{outline:3px solid var(--pcke-primary);outline-offset:2px}
.pcke-mx-own{position:relative;display:inline-flex;align-items:center;gap:6px;margin-top:6px;padding:8px 14px;border-radius:999px;background:var(--pcke-bg-soft);font-weight:600;font-size:14px;cursor:pointer}
.pcke-mx-own input{position:absolute;inset:0;opacity:0;cursor:pointer}
.pcke-mx-own svg{width:16px;height:16px}
.pcke-mx-empty{color:var(--pcke-muted);margin:8px 0}
.pcke-mx-lads{margin-top:22px;display:grid;gap:14px}
.pcke-mx-lads--sm{margin-top:6px;gap:10px}
.pcke-mx-lads--sm .pcke-mx-lad{grid-template-columns:84px minmax(0,1fr)}
.pcke-mx-lads--sm .pcke-mx-lad>span{font-size:13px}
.pcke-mx-lad{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;align-items:center}
.pcke-mx-lad>span{font-weight:700;font-size:14px;color:var(--pcke-ink)}
.pcke-mx-lad>div{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
html body .pcke-mx-lad button{position:relative;aspect-ratio:1.3;min-height:0;margin:0;padding:0;border:0;border-radius:10px;cursor:pointer;box-shadow:inset 0 -6px 12px rgba(0,0,0,.12),inset 0 3px 6px rgba(255,255,255,.35),0 4px 10px -6px rgba(0,0,0,.4)}
.pcke-mx-lad button b{position:absolute;left:0;right:0;bottom:5px;text-align:center;font:600 10.5px var(--pcke-mono,ui-monospace,monospace);opacity:0;transition:opacity .15s}
/* 1.72.0: the colour-page shade hover: the chip lifts and shows its HEX */
html body .pcke-mx-lad button{transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s}
html body .pcke-mx-lad button:hover,html body .pcke-mx-lad button:focus-visible{transform:translateY(-3px);box-shadow:inset 0 -6px 12px rgba(0,0,0,.12),inset 0 3px 6px rgba(255,255,255,.35),0 10px 18px -8px rgba(0,0,0,.45)}
.pcke-mx-lad button:hover b,.pcke-mx-lad button:focus-visible b{opacity:1}
@media (prefers-reduced-motion:reduce){html body .pcke-mx-lad button{transition:none}html body .pcke-mx-lad button:hover{transform:none}}
.pcke-mx-match__in{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px}
.pcke-mx-pick{position:relative;width:52px;height:52px;margin:0;cursor:pointer}
.pcke-mx-pick input{position:absolute;inset:0;opacity:0;cursor:pointer}
.pcke-mx-pick span{display:block;width:100%;height:100%;border-radius:14px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1),0 4px 12px -6px rgba(0,0,0,.4)}
html body .pcke-mx-hex{width:130px;min-height:48px;margin:0;padding:0 12px;border-radius:12px;font:700 16px var(--pcke-mono,ui-monospace,monospace)}
.pcke-mx-ex{display:flex;flex-wrap:wrap;gap:6px}
html body .pcke-mx-ex button{width:34px;height:34px;min-height:0;margin:0;padding:0;border:0;border-radius:50%;cursor:pointer;box-shadow:inset 0 0 0 2px rgba(255,255,255,.5),0 2px 6px rgba(0,0,0,.2)}
.pcke-mx-match__opts{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.pcke-mx-match__body,.pcke-mx-guide__body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:26px;align-items:start}
.pcke-mx-vs{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:24px;border-radius:24px;background:radial-gradient(120% 90% at 30% 0%,#FFFDF8,#F2EDE3);box-shadow:var(--gs-shadow)}
.pcke-mx-vs figure{margin:0;display:grid;gap:8px}
.pcke-mx-vs figure>svg{aspect-ratio:2.2}
.pcke-mx-vs figcaption{display:grid;font-weight:700;font-size:14px;color:var(--pcke-ink)}
.pcke-mx-vs figcaption code{font:600 13px var(--pcke-mono,ui-monospace,monospace);background:none;padding:0;color:var(--pcke-muted)}
.pcke-mx-close{grid-column:1/-1;margin:0;text-align:center}
.pcke-mx-close b{display:inline-block;padding:6px 14px;border-radius:999px;background:var(--pcke-surface,#fff);font-size:14px;color:var(--pcke-ink);box-shadow:inset 0 0 0 1px var(--pcke-line)}
.pcke-mx-guide__side{display:grid;gap:12px;min-width:0}
.pcke-mx-list__head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.pcke-mx-list__head>span{font:700 13px/1 var(--pcke-font);letter-spacing:.08em;text-transform:uppercase;color:var(--pcke-muted)}
.pcke-mx-list__head svg{width:15px;height:15px;vertical-align:-3px}
.pcke-mx-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.pcke-mx-list li{display:grid;grid-template-columns:48px minmax(0,1fr) minmax(70px,120px) 54px;gap:14px;align-items:center;padding:12px 16px 12px 10px;border-radius:18px;background:var(--pcke-bg-soft)}
.pcke-mx-list li>span{display:grid;min-width:0}
.pcke-mx-list li b{font:700 16px/1.3 var(--pcke-font);color:var(--pcke-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pcke-mx-list li small{font-size:13px;color:var(--pcke-muted)}
.pcke-mx-list li>i{height:8px;border-radius:999px;background:linear-gradient(90deg,var(--c) var(--w),var(--pcke-line) var(--w))}
.pcke-mx-list li em{font:800 18px/1 var(--pcke-font);font-style:normal;text-align:right;color:var(--pcke-ink)}
.pcke-mx-cov{margin:0;font-weight:700;color:var(--pcke-ink)}
.pcke-mx-cmyk{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}
.pcke-mx-cmyk li{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:14px;background:var(--pcke-bg-soft);font-weight:600;color:var(--pcke-ink)}
.pcke-mx-cmyk i{width:16px;height:16px;border-radius:50%}
.pcke-mx-chart__opts{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:16px}
.pcke-mx-ratio{min-width:200px;margin:0}
.pcke-mx-chart{display:grid;grid-template-columns:120px repeat(var(--n),minmax(0,1fr));gap:4px;padding:18px;border-radius:24px;background:radial-gradient(120% 90% at 30% 0%,#FFFDF8,#F2EDE3);box-shadow:var(--gs-shadow);overflow:auto}
html[data-theme="dark"] .pcke-mx-chart{background:#242322}
.pcke-mx-chart__top,.pcke-mx-chart__h{display:grid;justify-items:center;align-content:end;gap:4px;font:600 11px/1.2 var(--pcke-font);color:#4A4237;text-align:center}
html[data-theme="dark"] .pcke-mx-chart__top,html[data-theme="dark"] .pcke-mx-chart__h{color:#D8D2C6}
.pcke-mx-chart__top svg{width:34px}
.pcke-mx-chart__h{grid-template-columns:30px minmax(0,1fr);align-items:center;align-content:center;justify-items:start;text-align:left}
html body .pcke-mx-cell{aspect-ratio:1.35;min-height:0;margin:0;padding:0;border:0;border-radius:8px;cursor:pointer;box-shadow:inset 0 -5px 10px rgba(0,0,0,.14),inset 0 3px 6px rgba(255,255,255,.3)}
html body .pcke-mx-cell:hover{transform:scale(1.08);position:relative;z-index:1}
.pcke-mx-rec{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
html body .pcke-mx-rc{display:grid;gap:10px;min-height:0;margin:0;padding:14px;border:0;border-radius:20px;background:radial-gradient(120% 90% at 30% 0%,#FFFFFF,#F5F1E9);color:#1B1B1F;font:inherit;text-align:left;cursor:pointer;box-shadow:var(--gs-shadow);transition:transform .25s cubic-bezier(.22,1,.36,1)}
html[data-theme="dark"] body .pcke-mx-rc{background:#242322;color:#F2F2F2}
html body .pcke-mx-rc:hover{transform:translateY(-3px)}
.pcke-mx-rc__in{display:grid;grid-template-columns:1fr auto 1fr auto;gap:6px;align-items:center}
.pcke-mx-rc__in figure{margin:0;display:grid;justify-items:center;gap:2px}
.pcke-mx-rc__in svg{width:44px}
.pcke-mx-rc__in figcaption{font:600 11px/1.2 var(--pcke-font);text-transform:uppercase;letter-spacing:.04em;color:var(--pcke-muted)}
.pcke-mx-rc__in i{font:700 18px/1 var(--pcke-font);font-style:normal;color:var(--pcke-muted)}
.pcke-mx-rc__out{display:grid;gap:2px}
.pcke-mx-rc__out svg{aspect-ratio:2.4}
.pcke-mx-rc__out b{font:700 15px/1.2 "PCKE Poppins",var(--pcke-font)}
.pcke-mx-rc__out code{font:600 12px var(--pcke-mono,ui-monospace,monospace);background:none;padding:0;color:var(--pcke-muted)}
.pcke-mx-guide{border-radius:24px;background:var(--pcke-surface,#fff);box-shadow:var(--gs-shadow);overflow:hidden}
.pcke-mx-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--pcke-line)}
html body .pcke-mx-tabs button{min-height:56px;margin:0;border:0;border-bottom:3px solid transparent;border-radius:0;background:none;color:var(--pcke-ink);font:700 16px var(--pcke-font);cursor:pointer;box-shadow:none}
html body .pcke-mx-tabs button[aria-selected="true"]{border-bottom-color:var(--pcke-ink)}
html body .pcke-mx-tabs button:hover{background:var(--pcke-bg-soft);color:var(--pcke-ink)}
.pcke-mx-guide__body{padding:24px}
.pcke-mx-pal{position:relative;display:grid;justify-items:center;gap:14px;padding:22px;border-radius:22px;background:radial-gradient(120% 90% at 30% 0%,#FFFDF8,#F4EEE2)}
.pcke-mx-pal__k{justify-self:start;font:800 12px/1 var(--pcke-font);letter-spacing:.08em;text-transform:uppercase;color:#B5651D}
.pcke-mx-pal__main{width:min(220px,60%)}
.pcke-mx-pal__row{display:flex;justify-content:center;gap:14px}
.pcke-mx-pal__row figure{margin:0;width:64px;display:grid;justify-items:center;gap:2px}
.pcke-mx-pal__row figcaption{font:800 14px/1 var(--pcke-font);color:#3A332A}
html[data-theme="dark"] .pcke-mx-pal__row figcaption,html[data-theme="dark"] .pcke-mx-pal__vs b{color:#EDE6D8}
.pcke-mx-pal__vs{display:flex;align-items:center;gap:6px}
.pcke-mx-pal__vs span{width:34px;height:22px;border-radius:6px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}
.pcke-mx-pal__vs b{margin-left:4px;font-size:13px;color:#3A332A}
.pcke-mx-guide .pcke-gs__seg{justify-self:start}
.pcke-mixing [hidden]{display:none!important}
@media (max-width:1100px){.pcke-mx-rec{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1000px){.pcke-mx-studio,.pcke-mx-match__body,.pcke-mx-guide__body{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){.pcke-mx-lad button b{display:none}.pcke-mx-res__smear{aspect-ratio:2.6}.pcke-mx-rec{grid-template-columns:repeat(2,minmax(0,1fr))}.pcke-mx-res{grid-template-columns:1fr}.pcke-mx-lad{grid-template-columns:1fr;gap:6px}.pcke-mx-board{padding:14px}.pcke-mx-list li{grid-template-columns:40px minmax(0,1fr) 46px;gap:10px}.pcke-mx-list li i{grid-column:1/-1;grid-row:2}.pcke-mx-cmyk{grid-template-columns:repeat(2,minmax(0,1fr))}.pcke-mx-chart{grid-template-columns:84px repeat(var(--n),minmax(28px,1fr));padding:10px}.pcke-mx-chart__h span{font-size:10px}.pcke-mx-rc__in svg{width:34px}.pcke-mx-guide__body{padding:14px}}
@media (prefers-reduced-motion:reduce){.pcke-mx-rc,.pcke-mx-t .pcke-mx-tube{transition:none}}

/* 1.71.0: whole-number ratio, paint roles, amounts, adjust fixes, live target, photo pick */
.pcke-mx-ratio{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 14px;margin:0;padding:14px 18px;border-radius:18px;background:var(--pcke-bg-soft,#F4F4F2)}
.pcke-mx-ratio b{font:800 30px/1.1 "PCKE Poppins",var(--pcke-font,system-ui);color:var(--pcke-ink,#1B1B1F);letter-spacing:-.01em}
.pcke-mx-ratio b i{font-style:normal;font-weight:600;color:var(--pcke-muted,#6B6B73)}
.pcke-mx-ratio span{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;color:var(--pcke-ink,#1B1B1F)}
.pcke-mx-ratio em{font-style:normal;padding:4px 10px;border-radius:999px;background:var(--pcke-surface,#fff);font:700 12.5px var(--pcke-mono,ui-monospace,monospace);box-shadow:inset 0 0 0 1px var(--pcke-line,#E4E4E0)}
.pcke-mx-list li small{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.pcke-mx-role{display:inline-flex;align-items:center;height:20px;box-sizing:border-box;font-style:normal;padding:0 8px;border-radius:999px;background:var(--pcke-surface,#fff);font:700 11px/1 var(--pcke-font,system-ui);letter-spacing:.03em;text-transform:uppercase;color:var(--pcke-muted,#6B6B73);box-shadow:inset 0 0 0 1px var(--pcke-line,#E4E4E0)}
.pcke-mx-units{justify-self:start}
.pcke-mx-fix{display:grid;gap:8px}
.pcke-mx-fix>div{display:flex;flex-wrap:wrap;gap:8px}
html body .pcke-mx-fix button{display:grid;grid-template-columns:auto auto auto;grid-template-rows:auto auto;align-items:center;column-gap:8px;min-height:0;margin:0;padding:8px 14px 8px 10px;border:0;border-radius:16px;background:var(--pcke-surface,#fff);color:var(--pcke-ink,#1B1B1F);font:inherit;text-align:left;cursor:pointer;box-shadow:inset 0 0 0 1px var(--pcke-line,#E4E4E0)}
html body .pcke-mx-fix button:hover{box-shadow:inset 0 0 0 2px var(--pcke-ink,#1B1B1F);background:var(--pcke-surface,#fff);color:var(--pcke-ink,#1B1B1F)}
.pcke-mx-fix button i{grid-row:1/3;width:22px;height:34px;border-radius:8px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.pcke-mx-fix button i+i{margin-left:-8px;width:22px}
.pcke-mx-fix button b{font-size:14px;line-height:1.2}
.pcke-mx-fix button small{grid-column:3;font-size:12px;color:var(--pcke-muted,#6B6B73);white-space:nowrap}
.pcke-mx-aim{display:flex;align-items:center;gap:6px;margin:6px 0 0}
.pcke-mx-aim span{width:30px;height:22px;border-radius:6px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}
.pcke-mx-aim b{margin-left:4px;font-size:13px;color:var(--pcke-ink,#1B1B1F)}
html body .pcke-mx-aim__x{width:26px;height:26px;min-height:0;margin:0 0 0 2px;padding:0;border:0;border-radius:50%;background:var(--pcke-bg-soft,#F4F4F2);color:var(--pcke-muted,#6B6B73);font:700 16px/1 var(--pcke-font,system-ui);cursor:pointer;box-shadow:none}
.pcke-mx-photo{position:relative;overflow:hidden;cursor:pointer}
.pcke-mx-photo input{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:0}
.pcke-mx-shot{margin:0 0 16px;border-radius:18px;overflow:hidden;background:var(--pcke-bg-soft,#F4F4F2);box-shadow:var(--gs-shadow)}
.pcke-mx-shot canvas{display:block;width:100%;height:auto;max-height:360px;object-fit:contain;cursor:crosshair}
/* the guide on Core paint-shade pages, where creative.css is not loaded */
.pcke-mx-guide .pcke-gs__seg{display:inline-flex;flex-wrap:wrap;gap:2px;width:max-content;max-width:100%;padding:3px;border-radius:999px;background:var(--pcke-bg-soft,#F4F4F2)}
html body .pcke-mx-guide .pcke-gs__seg button{min-height:34px;margin:0;padding:0 15px;border:0;border-radius:999px;background:none;color:var(--pcke-muted,#6B6B73);font:600 13.5px/1 var(--pcke-font,system-ui);cursor:pointer;box-shadow:none}
html body .pcke-mx-guide .pcke-gs__seg button[aria-checked="true"]{background:var(--pcke-surface,#fff);color:var(--pcke-ink,#1B1B1F);box-shadow:0 1px 2px rgba(17,17,19,.1),0 2px 8px -4px rgba(17,17,19,.25)}
html[data-theme="dark"] body .pcke-mx-guide .pcke-gs__seg button[aria-checked="true"]{background:#3A3A3A}
.pcke-mx-guide .pcke-po__status{min-height:1.2em;margin:0;font-size:13px;color:var(--pcke-muted,#6B6B73)}
.pcke-mx-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.pcke-mx-head h2{margin:0}
html[data-theme="dark"] .pcke-mx-ratio em,html[data-theme="dark"] .pcke-mx-role,html[data-theme="dark"] body .pcke-mx-fix button{background:#2A2A2A}
@media (max-width:640px){.pcke-mx-ratio b{font-size:24px}.pcke-mx-fix button{flex:1 1 calc(50% - 8px)}}

/* 1.71.0: Colour recipes page */
.pcke-rx__bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:22px 0 12px}
.pcke-rx__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.pcke-rx__item[hidden]{display:none!important}
.pcke-rx-card{display:grid;grid-template-rows:auto 1fr;height:100%;border-radius:22px;overflow:hidden;background:var(--pcke-surface,#fff);color:var(--pcke-ink,#1B1B1F);text-decoration:none;box-shadow:0 1px 2px rgba(17,17,19,.06),0 10px 28px -16px rgba(17,17,19,.3);transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s}
.pcke-rx-card:hover{transform:translateY(-3px);box-shadow:0 2px 4px rgba(17,17,19,.06),0 18px 34px -16px rgba(17,17,19,.36);color:var(--pcke-ink,#1B1B1F)}
.pcke-rx-card:focus-visible{outline:3px solid var(--pcke-primary,#2457E7);outline-offset:3px}
.pcke-rx-card__paint{position:relative;display:block;height:118px;background:radial-gradient(120% 90% at 30% 0%,#FFFDF8,#F1ECE2)}
.pcke-rx-card__paint::before{content:"";position:absolute;inset:14px 14px 12px;background:repeating-linear-gradient(178deg,rgba(255,255,255,.18) 0 2px,transparent 2px 8px,rgba(0,0,0,.07) 8px 9.5px,transparent 9.5px 15px),linear-gradient(180deg,rgba(255,255,255,.3),transparent 30%,transparent 72%,rgba(0,0,0,.2)),var(--c);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 100' preserveAspectRatio='none'%3E%3Cpath d='M16 24C6 34 4 64 14 78L40 81L70 77L100 82L130 78L160 81L184 77L191 70L185 62L194 54L186 46L195 38L187 30L192 22L162 19L130 23L100 18L70 22L40 18Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 100' preserveAspectRatio='none'%3E%3Cpath d='M16 24C6 34 4 64 14 78L40 81L70 77L100 82L130 78L160 81L184 77L191 70L185 62L194 54L186 46L195 38L187 30L192 22L162 19L130 23L100 18L70 22L40 18Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;filter:drop-shadow(0 6px 6px rgba(60,45,25,.22))}
.pcke-rx__item:nth-child(even) .pcke-rx-card__paint::before{transform:scaleX(-1)}
.pcke-rx-card__paint::after{content:"";position:absolute;left:18%;right:24%;top:30%;height:4px;border-radius:999px;background:rgba(255,255,255,.42);filter:blur(1px)}
html[data-theme="dark"] .pcke-rx-card__paint{background:radial-gradient(120% 90% at 30% 0%,#2E2C29,#232220)}
.pcke-rx-card__body{display:grid;align-content:start;gap:10px;padding:14px 16px 16px}
.pcke-rx-card__name{display:grid;gap:2px;min-width:0}
.pcke-rx-card__name b{font:700 16px/1.25 "PCKE Poppins",var(--pcke-font,system-ui);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pcke-rx-card__name code{font:600 12px var(--pcke-mono,ui-monospace,monospace);background:none;padding:0;color:var(--pcke-muted,#6B6B73)}
[data-rx-body]{display:grid;gap:10px}
.pcke-rx-card__ratio{font:800 22px/1 "PCKE Poppins",var(--pcke-font,system-ui);letter-spacing:-.01em}
.pcke-rx-card__paints{display:grid;gap:6px;margin:0;padding:0;list-style:none;font-size:13.5px;line-height:1.3}
.pcke-rx-card__paints li{display:flex;align-items:center;gap:8px;min-width:0}
.pcke-rx-card__paints i{flex:none;width:16px;height:16px;border-radius:50% 45% 52% 48%;box-shadow:inset 0 -3px 4px rgba(0,0,0,.18),inset 0 2px 3px rgba(255,255,255,.4),0 0 0 1px rgba(0,0,0,.06)}
.pcke-rx-card__paints b{flex:none;min-width:1.1em;font-weight:800}
.pcke-rx-card__fit{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--pcke-muted,#6B6B73)}
.pcke-rx-card__fit em{font-style:normal;padding:3px 9px;border-radius:999px;background:var(--pcke-bg-soft,#F4F4F2);font:700 11.5px var(--pcke-mono,ui-monospace,monospace);color:var(--pcke-ink,#1B1B1F)}
.pcke-rx__live{margin:0 0 18px}
.pcke-rx-live{display:grid;grid-template-columns:220px minmax(0,1fr) auto;gap:22px;align-items:center;padding:18px;border-radius:24px;background:var(--pcke-surface,#fff);box-shadow:0 1px 2px rgba(17,17,19,.06),0 10px 28px -16px rgba(17,17,19,.3)}
.pcke-rx-live__vs{display:grid;grid-template-columns:1fr 1fr;height:120px;border-radius:16px;overflow:hidden}
.pcke-rx-live__body{display:grid;gap:10px;min-width:0}
.pcke-rx-live__body [class*="__paints"]{grid-template-columns:repeat(auto-fit,minmax(170px,max-content));column-gap:18px}
html[data-theme="dark"] .pcke-rx-card,html[data-theme="dark"] .pcke-rx-live{background:#242424;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
html[data-theme="dark"] .pcke-rx-card__fit em{background:#2F2F2F}
.pcke-mx-host:empty{min-height:560px}
@media (max-width:1100px){.pcke-rx__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:800px){.pcke-rx__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pcke-rx-live{grid-template-columns:1fr}.pcke-rx-live__vs{height:90px}}
@media (max-width:480px){.pcke-rx__grid{gap:10px}.pcke-rx-card__paint{height:84px}.pcke-rx-card__body{padding:12px}.pcke-rx-card__ratio{font-size:19px}.pcke-rx-card__paints{font-size:12.5px}.pcke-mx-host:empty{min-height:900px}}
@media (prefers-reduced-motion:reduce){.pcke-rx-card{transition:none}}
.pcke-mx-allrx{justify-content:center;margin-top:22px}
.pcke-rx-card__ratio.is-pure{font-size:16px;font-weight:700}
.pcke-mx-ratio b.is-pure{font-size:20px}