/* ===== Warna Aksen Premium: sheet pilihan warna ===== */
.ac-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px 10px;padding:6px 2px 4px}
.ac-sw{display:flex;flex-direction:column;align-items:center;gap:7px;padding:0;background:transparent!important;border:0!important;box-shadow:none!important;color:var(--ink)!important;min-height:0;cursor:pointer}
.ac-sw:active{transform:scale(.94)!important}
.ac-dot{position:relative;width:52px;height:52px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 2px rgba(127,127,127,.4);display:grid;place-items:center}
.ac-sw.on .ac-dot{box-shadow:inset 0 0 0 2px rgba(127,127,127,.4),0 0 0 3px var(--paper,#fff),0 0 0 6px var(--c)}
.ac-dot svg{width:24px;height:24px;stroke:#111;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;opacity:0;transform:scale(.6);transition:opacity .15s,transform .15s}
.ac-sw.on .ac-dot svg{opacity:1;transform:none}
.ac-sw.lock .ac-dot::after{content:"";position:absolute;right:-2px;bottom:-2px;width:20px;height:20px;border-radius:50%;background:var(--card,#fff) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='9' rx='2.5'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") center/13px no-repeat;box-shadow:0 0 0 1.5px rgba(127,127,127,.4)}
.ac-sw small{font-size:12px;color:var(--mute);line-height:1.1;text-align:center}
.ac-sw.on small{color:var(--ink);font-weight:700}
.ac-cus{display:flex;align-items:center;gap:14px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(127,127,127,.22)}
.ac-cus .t3t{flex:1}
.ac-pick{position:relative;width:52px;height:52px;border-radius:50%;flex:none;overflow:hidden;box-shadow:inset 0 0 0 2px rgba(127,127,127,.4);background:conic-gradient(#ff6b6b,#ffd83d,#5be08a,#6cc4ff,#b99cff,#ff8fb8,#ff6b6b)}
.ac-pick input{position:absolute;inset:-8px;width:calc(100% + 16px);height:calc(100% + 16px);opacity:0;cursor:pointer;border:0;padding:0}
.ac-pv{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding:12px 14px;border:1.5px solid var(--fb);border-radius:14px}
.ac-pv i{display:block;width:34px;height:34px;border-radius:10px;background:var(--acc,#ffd83d);flex:none}
.ac-pv span{font-size:13.5px;line-height:1.4}

.ac-pick{display:block;border:0;padding:0;cursor:pointer;position:relative}
.ac-pick::after{content:"";position:absolute;inset:0;background:#111 center/26px 26px no-repeat;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/26px 26px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/26px 26px no-repeat;filter:drop-shadow(0 0 4px #fff)}
.ac-pick.on{box-shadow:inset 0 0 0 2px rgba(127,127,127,.4),0 0 0 3px var(--paper,#fff),0 0 0 6px currentColor}
/* ===== dialog pemilih warna ===== */
#acDlg{z-index:2147483000}
.cp-sv{position:relative;width:100%;height:190px;border-radius:16px;overflow:hidden;box-shadow:inset 0 0 0 1.5px rgba(127,127,127,.4);cursor:crosshair}
.cp-sv i,.cp-h i{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1.5px rgba(0,0,0,.55),0 2px 6px rgba(0,0,0,.4);pointer-events:none}
.cp-h{position:relative;width:100%;height:26px;margin:18px 0 6px;border-radius:99px;background:linear-gradient(to right,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00);box-shadow:inset 0 0 0 1.5px rgba(127,127,127,.4)}
.cp-h i{top:50%}
.cp-row{display:flex;align-items:center;gap:12px;margin-top:16px}
.cp-pv{width:48px;height:48px;border-radius:14px;flex:none;box-shadow:inset 0 0 0 2px rgba(127,127,127,.4)}
.cp-row input{flex:1;min-width:0;height:48px;padding:0 14px;font-size:17px;letter-spacing:.08em;text-transform:lowercase;border-radius:14px;border:2px solid var(--fb,#111);background:var(--card,#fff);color:var(--ink,#111)}
.cp-hint{margin:10px 2px 0;font-size:12.5px;line-height:1.4;color:var(--mute);min-height:0}
.cp-hint:empty{display:none}
.cp-btns{display:flex;gap:10px;margin-top:18px}
.cp-btns .ui-b{flex:1}