.ldpp{position:relative;width:640px;height:600px;margin:auto;overflow:hidden;font-size:1rem}.ldpp{position:relative;width:100%;height:100%;display:flex;flex-direction:column}.ldpp>.header{flex:0 0 1px;padding:1em 1em;display:flex;flex-wrap:nowrap;align-items:start;justify-content:space-between}.ldpp>.header .btn[data-panel]{margin-left:.5em}.ldpp>.panels{flex:1 0 1%}.ldpp div[data-panel=view] .ldp,.ldpp div[data-panel=mypal] .ldp{width:calc(50% - 1em);margin:0 0 .75em;padding:0}.ldpp div[data-panel=view] .ldp .name,.ldpp div[data-panel=mypal] .ldp .name{font-size:.875em;text-align:left}.ldpp .panel:nth-child(1){transform:translate(0,0) translateZ(1px)}.ldpp .panel:nth-child(2){transform:translate(100%,0) translateZ(1px)}.ldpp .panel:nth-child(3){transform:translate(200%,0) translateZ(1px)}.ldpp [t]{text-transform:capitalize}.ldpp .panels{position:relative;transition:transform .5s ease-in-out;width:100%;height:100%;text-align:center}.ldpp .panel{position:absolute;top:0;left:0;padding:0;width:100%;height:100%;overflow-y:scroll;overflow-x:hidden;overscroll-behavior:contain}.ldpp .panel.active{display:block}.ldpp .panel>.inner{display:flex;flex-wrap:wrap;justify-content:space-between;text-align:center;padding:0 1em;align-content:start}.ldpp .panel>.inner:after{content:" ";display:inline-block;width:280px;height:1px;margin:0 10px 11px}.ldpp .panel>.inner>.clusterize-row{width:100%;display:flex;flex-wrap:nowrap;gap:2em;justify-content:space-between}.ldpp .panel[data-panel=edit]{padding-bottom:0;display:flex;flex-direction:column}.ldpp .panel[data-panel=edit] .edit{flex:1 0 1%}.ldpp .panel[data-panel=edit] .edit>.inner{padding:1em 1em 0}.ldpp .panel[data-panel=edit] .ldp{margin:7px 0;padding:0 1em 0}.ldpp .panel[data-panel=edit]>.foot{padding-bottom:1em !important}.ldpp .panel[data-panel=edit] .ldp,.ldpe .ldp{width:100%}.ldpp .panel[data-panel=edit] .ldp .name,.ldpe .ldp .name{display:none}.ldpp .panel[data-panel=edit] .ldp .colors,.ldpe .ldp .colors{height:120px;border:1px solid #fff;border-radius:5px;box-shadow:0 2px 4px rgba(0,0,0,0.2);overflow:visible}.ldpp .panel[data-panel=edit] .ldp .color:first-child,.ldpe .ldp .color:first-child{border-radius:5px 0 0 5px}.ldpp .panel[data-panel=edit] .ldp .color:last-child,.ldpe .ldp .color:last-child{border-radius:0 5px 5px 0}.ldpp .panel[data-panel=edit] .ldp .color,.ldpe .ldp .color{transition:flex .3s ease-in-out;position:relative}.ldpp .panel[data-panel=edit] .ldp .color.dark *[data-action],.ldpe .ldp .color.dark *[data-action]{color:#fff}.ldpp .panel[data-panel=edit] .ldp .color *[data-action],.ldpe .ldp .color *[data-action]{opacity:0;width:20px;margin:auto;padding:.25em 0;height:100%;text-align:center;display:flex;flex-direction:column;justify-content:space-around;color:#444}.ldpp .panel[data-panel=edit] .ldp .color *[data-action] i,.ldpe .ldp .color *[data-action] i{flex:0 0 auto;cursor:pointer}.ldpp .panel[data-panel=edit] .ldp .color.active *[data-action],.ldpe .ldp .color.active *[data-action]{opacity:1}.ldpp .panel[data-panel=edit] .ldp .color.active,.ldpe .ldp .color.active{transform:scale(1.02);border-radius:3px;border:2px solid #000;box-shadow:inset 0 0 0 4px #fff,0 2px 4px 0 rgba(0,0,0,0.3);z-index:1;position:relative}.ldpp .panel[data-panel=edit] .ldp .color.active:after,.ldpe .ldp .color.active:after{content:" ";width:20px;height:20px;position:absolute;bottom:0;transform:translate(-50%,50%) rotate(45deg);background:currentColor;left:50%;display:block;box-shadow:2px 2px 2px rgba(0,0,0,0.1);border-right:2px solid rgba(0,0,0,0.2);border-bottom:2px solid rgba(0,0,0,0.2);display:none}.ldpp .panel[data-panel=edit] .ldcolorpicker,.ldpe .ldcolorpicker{width:100%;height:calc(10.9875em + 1rem - 7px);display:inline-block;vertical-align:top;margin-top:0}.ldpp .panel[data-panel=edit] .ldcolorpicker .ldcp-panel,.ldpe .ldcolorpicker .ldcp-panel{padding:0}.ldpp .panel[data-panel=edit] .value,.ldpe .value{margin:1.2125em 0 .1em}.ldpp .panel[data-panel=edit] .value:last-child,.ldpe .value:last-child{margin-bottom:0}.ldpp .panel[data-panel=edit] .edit,.ldpe .edit{text-align:left;margin-top:0}.ldpp .panel[data-panel=edit] .edit>.inner,.ldpe .edit>.inner{padding-top:1em}.ldpp .panel[data-panel=edit]>.foot,.ldpe>.foot{padding:0 1em;width:100%;text-align:left}.ldpp .panel[data-panel=edit] .ldrs,.ldpe .ldrs{margin-top:-3px}.ldpp .panel[data-panel=edit] .label-group,.ldpe .label-group{position:relative;font-size:.75em;line-height:1.75em}.ldpp .panel[data-panel=mypal] .btn-load{position:relative;width:50%;margin:1em auto;cursor:pointer}.ldpe .ldp{padding:0;margin:0}.ldpp .config,.ldpe .config{display:none}.ldpp .config.active,.ldpe .config.active{display:flex}.ldpe .ldcolorpicker{z-index:1 !important}.ldp{display:inline-block;position:relative}.ldp .colors{cursor:pointer;position:relative;box-shadow:0 0 0 1px #fff,0 0 1px 1px rgba(0,0,0,0.2);width:100%;border-radius:3px;overflow:hidden;display:flex;flex-wrap:nowrap}.ldp .color{flex:1 1 0;display:inline-block;width:0;height:100%}.ldp .color:first-child,.ldp .ctrl+.color{border-radius:3px 0 0 3px}.ldp .color:last-child{border-radius:0 3px 3px 0}.ldp .ctrl{position:absolute;z-index:1;display:flex;flex-wrap:nowrap;justify-content:center;padding:3px;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);opacity:0;transition:opacity ease-in-out .2s;text-align:center}.ldp .ctrl *[data-action]{color:rgba(255,255,255,0.7);height:100%;flex:1 1 0;line-height:1em;font-size:.8em;display:flex;text-decoration:none;align-items:center;justify-content:center;flex-direction:column}.ldp .ctrl *[data-action] i{font-size:1em;margin-bottom:.2em}.ldp .ctrl *[data-action]:hover{color:#fff;background:rgba(255,255,255,0.3)}.ldp .ctrl *[data-action]:first-child,.ldp .ctrl .ctrl+*[data-action]{border-radius:3px 0 0 3px}.ldp .ctrl *[data-action]:last-child{border-radius:0 3px 3px 0}.ldp .name{text-transform:capitalize;width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.ldp:hover .ctrl{opacity:1;opacity:1}.ldp{width:100%}.ldp .colors{height:calc(1.5em + 0.75rem + 2px)}.ldp.ldp-sm{font-size:.875rem}.ldp.ldp-sm .colors{height:calc(1.5em + 0.5rem + 1.7px)}.ldp.ldp-lg{font-size:1.25rem}.ldp.ldp-lg .colors{height:calc(1.5em + 1rem + 2px)}