:root{--brand:#db2777;--brand2:#8b5cf6}
.pv{position:relative;margin:10px 0}
.outc{display:block;max-width:100%;max-height:70vh;margin:0 auto;border-radius:12px;background:#0002;touch-action:manipulation;cursor:crosshair}
.outc.checker{background:repeating-conic-gradient(#ccc 0 25%,#fff 0 50%) 50%/20px 20px}
.pv .cmp{position:absolute;right:8px;bottom:8px;width:auto;padding:6px 10px;font-size:12px;opacity:.9;user-select:none;-webkit-user-select:none;touch-action:none}
.status{text-align:center;font-weight:600;min-height:1.2em}
.sliders{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:4px 16px;margin:8px 0}
.sl{display:flex;flex-direction:column;font-size:13px;font-weight:600;gap:2px}.sl input{accent-color:var(--brand);width:100%}
.swt{display:flex;flex-wrap:wrap;gap:8px}
.swt label{display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer;font-size:11px;color:var(--muted);width:58px;text-align:center}
.swt input[type=radio]{position:absolute;opacity:0;pointer-events:none}
.swt i{width:36px;height:36px;border-radius:50%;border:3px solid transparent;box-shadow:0 0 0 1px var(--line)}
.swt input:checked+i{border-color:var(--text)}
.swt .cust input{width:36px;height:36px;border-radius:50%;padding:0;border:1px solid var(--line);cursor:pointer}
.btnrow{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}.btnrow .btn{width:auto;flex:1 1 auto}
.chk{display:flex;gap:8px;align-items:center;font-size:14px;margin:8px 0}.chk input[type=color]{width:44px;height:32px;padding:0;border:0}