.pp-root .dm{position:relative;overflow:hidden;isolation:isolate}.pp-root .dm [data-pieza]{position:relative;z-index:2;will-change:transform}.pp-root .dm-reticula{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .7s ease}.pp-root .dm[data-fase=armado] .dm-reticula,.pp-root .dm[data-fase=color] .dm-reticula,.pp-root .dm[data-fase=moviendo] .dm-reticula{opacity:1}.pp-root .dm-cols{position:absolute;inset:24px;display:grid;grid-template-columns:repeat(6,1fr);gap:12px;background-image:repeating-linear-gradient(to bottom,color-mix(in srgb,var(--c-blue) 26%,transparent) 0 1px,transparent 1px 8px)}.pp-root .dm-cols span{background:color-mix(in srgb,var(--c-pink) 11%,transparent);box-shadow:inset 1px 0 0 color-mix(in srgb,var(--c-pink) 45%,transparent),inset -1px 0 0 color-mix(in srgb,var(--c-pink) 45%,transparent)}.pp-root .dm-cols span:nth-child(n+7){display:none}@media (min-width:768px){.pp-root .dm-cols{inset:40px;grid-template-columns:repeat(12,1fr);gap:16px}.pp-root .dm-cols span:nth-child(n+7){display:block}}.pp-root .dm-margen{position:absolute;inset:24px;box-shadow:0 0 0 1px color-mix(in srgb,var(--c-cyan) 90%,transparent)}@media (min-width:768px){.pp-root .dm-margen{inset:40px}}.pp-root .dm-centro{position:absolute;background-image:linear-gradient(var(--c-lilac) 50%,transparent 50%)}.pp-root .dm-centro.is-v{left:50%;top:0;bottom:0;width:1px;background-size:1px 8px}.pp-root .dm-centro.is-h{top:50%;left:0;right:0;height:1px;background-image:linear-gradient(90deg,var(--c-lilac) 50%,transparent 50%);background-size:8px 1px}.pp-root .dm-rotulo{position:absolute;font-family:var(--font-mono),ui-monospace,monospace;font-size:10px;letter-spacing:.06em;line-height:1;padding:3px 5px;border-radius:4px;background:var(--c-cyan);color:var(--pp-ink);white-space:nowrap}.pp-root .dm-rotulo.is-arriba{top:6px;left:24px}.pp-root .dm-rotulo.is-lado{top:50%;left:4px;transform:translateY(-50%)}@media (min-width:768px){.pp-root .dm-rotulo.is-arriba{top:14px;left:40px}.pp-root .dm-rotulo.is-lado{left:12px}}.pp-root .dm [data-sel]{z-index:4;outline:1.5px solid var(--sel);outline-offset:5px;border-radius:4px}.pp-root .dm [data-sel]:after{content:attr(data-medida);position:absolute;left:50%;bottom:-26px;transform:translateX(-50%);padding:2px 6px;border-radius:4px;background:var(--sel);color:var(--pp-ink);font-family:var(--font-mono),ui-monospace,monospace;font-size:10px;letter-spacing:.04em;white-space:nowrap;pointer-events:none}.pp-root .dm-guias{position:absolute;inset:0;z-index:5;pointer-events:none}.pp-root .dm-guia{position:absolute;display:block;background:var(--g);opacity:0}.pp-root .dm-guia.is-h{left:0;right:0;height:1px}.pp-root .dm-guia.is-v{top:0;bottom:0;width:1px}.pp-root .dm-cursor{position:absolute;left:0;top:0;z-index:6;display:none;pointer-events:none;will-change:transform}.pp-root .dm[data-fase=color] .dm-cursor,.pp-root .dm[data-fase=moviendo] .dm-cursor{display:block}.pp-root .dm-cursor svg{display:block;filter:drop-shadow(0 1px 1px rgba(17,17,17,.25));transition:transform .12s ease;transform-origin:2px 2px}.pp-root .dm-cursor path{fill:var(--c);stroke:#fff;stroke-width:1.5;stroke-linejoin:round}.pp-root .dm-cursor[data-agarra] svg{transform:scale(.86)}.pp-root .dm-cursor b{position:absolute;left:14px;top:17px;padding:3px 8px;border-radius:6px 6px 6px 2px;background:var(--c);color:var(--pp-ink);font-size:11px;font-weight:600;line-height:1.2;white-space:nowrap;box-shadow:0 1px 2px rgba(17,17,17,.12)}.pp-root .dm-splash{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;mix-blend-mode:multiply;background:radial-gradient(38% 28% at 12% 4%,var(--c-pink),transparent 70%),radial-gradient(34% 26% at 40% 0,var(--c-yellow),transparent 70%),radial-gradient(36% 30% at 66% 6%,var(--c-blue),transparent 70%),radial-gradient(34% 28% at 92% 2%,var(--c-lilac),transparent 70%),radial-gradient(40% 30% at 30% 40%,var(--c-green),transparent 70%),radial-gradient(40% 30% at 78% 46%,var(--c-orange),transparent 70%);clip-path:inset(0 0 100% 0)}.pp-root .dm[data-fase=color] .dm-splash{animation:dm-splash 1.5s cubic-bezier(.3,.7,.2,1) both}@keyframes dm-splash{0%{opacity:.85;clip-path:inset(0 0 100% 0)}45%{opacity:.7;clip-path:inset(0 0 0 0)}to{opacity:0;clip-path:inset(0 0 0 0)}}.pp-root .dm .dm-ico{background:linear-gradient(180deg,color-mix(in srgb,var(--ico) 62%,#fff) 0,var(--ico) 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 -1px 0 color-mix(in srgb,var(--ico) 70%,#000 8%),0 1px 2px rgba(17,17,17,.1);color:var(--pp-ink)}.pp-root .dm[data-fase=color] .dm-ico{transition:background .6s ease var(--d,0s),box-shadow .6s ease var(--d,0s),transform .6s cubic-bezier(.34,1.56,.64,1) var(--d,0s)}.pp-root .dm[data-fase=armado] .dm-ico,.pp-root .dm[data-fase=moviendo] .dm-ico{background:var(--nm-key);box-shadow:var(--nm-up-sm)}@media (prefers-reduced-motion:reduce){.pp-root .dm-cursor,.pp-root .dm-reticula,.pp-root .dm-splash{display:none!important}}