:root{--pc-radius:10px;--pc-radius-sm:6px;--pc-radius-full:9999px;--pc-shadow:0 2px 8px rgba(0,0,0,.07),0 1px 2px rgba(0,0,0,.05);--pc-shadow-hover:0 8px 24px rgba(0,0,0,.13),0 2px 6px rgba(0,0,0,.07);--pc-trans:200ms cubic-bezier(0.16,1,0.3,1);--pc-text:#1a1a1a;--pc-text-muted:#6b7280;--pc-border:rgba(0,0,0,.09);--pc-bg:#fff;--pc-surface:#f5f5f5}
.pc-group-wrap{font-family:inherit;color:inherit;margin-block:2rem;direction:rtl}.pc-group-wrap *{font-family:inherit}
.pc-group-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.25rem;padding-bottom:1rem;border-bottom:1px solid var(--pc-border)}
.pc-group-thumb{width:48px;height:48px;border-radius:var(--pc-radius-sm);object-fit:cover;flex-shrink:0}
.pc-group-title{margin:0 0 .2rem;font-size:1.2rem;font-weight:700;color:var(--pc-text)}
.pc-group-desc{margin:0;font-size:.85rem;color:var(--pc-text-muted)}
.pc-selection-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;padding:10px 12px;background:#f8fafc;border:1px solid #e5e7eb;border-radius:10px}
.pc-selection-count{font-size:.9rem;color:#374151}
.pc-open-selection,.pc-action-btn{border:none;cursor:pointer;transition:all var(--pc-trans);background:#111827;color:#fff;padding:9px 14px;border-radius:999px;font-size:.84rem}
.pc-open-selection:hover,.pc-action-btn:hover{background:#000}
.pc-colors-grid{display:grid;grid-template-columns:repeat(var(--pc-cols,6),minmax(0,1fr));gap:.875rem}
@media(max-width:1280px){.pc-colors-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:1024px){.pc-colors-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:640px){.pc-colors-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}}
@media(max-width:400px){.pc-colors-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pc-selection-bar{flex-direction:column;align-items:stretch}}
.pc-color-card{background:var(--pc-bg);border-radius:var(--pc-radius);box-shadow:var(--pc-shadow);overflow:hidden;transition:transform var(--pc-trans),box-shadow var(--pc-trans);position:relative}
.pc-color-card:hover{transform:translateY(-3px);box-shadow:var(--pc-shadow-hover)}
.pc-color-card.is-selected{outline:2px solid #111827;outline-offset:2px}
.pc-swatch{position:relative;aspect-ratio:1/.9;width:100%;overflow:hidden}
.pc-sample-overlay{position:absolute;inset:0;opacity:0;transition:opacity var(--pc-trans)}
.pc-color-card:hover .pc-sample-overlay{opacity:1}
.pc-sample-overlay img{width:100%;height:100%;object-fit:cover;display:block}
.pc-copy-btn{position:absolute;bottom:7px;left:7px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.9);backdrop-filter:blur(4px);color:#111827;border:none;border-radius:var(--pc-radius-sm);cursor:pointer;opacity:0;transform:scale(.8);transition:opacity var(--pc-trans),transform var(--pc-trans),background var(--pc-trans);z-index:2}
.pc-color-card:hover .pc-copy-btn{opacity:1;transform:scale(1)}
.pc-copy-btn.pc-copied{background:#d1fae5;color:#059669}
.pc-select-btn{position:absolute;bottom:7px;right:7px;padding:5px 9px;font-size:.7rem;font-weight:700;background:rgba(255,255,255,.9);backdrop-filter:blur(4px);color:#111827;border:none;border-radius:var(--pc-radius-sm);cursor:pointer;transition:all var(--pc-trans);opacity:0;z-index:2}
.pc-color-card:hover .pc-select-btn{opacity:1}
.pc-select-btn.is-active{background:#111827;color:#fff;opacity:1}
.pc-color-card.is-selected .pc-select-btn{opacity:1}
.pc-color-info{padding:.55rem .65rem .65rem;display:flex;flex-direction:column;gap:2px}
.pc-color-name{font-size:.8rem;font-weight:700;color:var(--pc-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
.pc-color-code{font-size:.68rem;color:var(--pc-text-muted);letter-spacing:.03em}
.pc-finish-tag{display:inline-flex;align-items:center;margin-top:3px;font-size:.62rem;font-weight:700;letter-spacing:.06em;color:var(--pc-text-muted);background:var(--pc-surface);border-radius:var(--pc-radius-full);padding:2px 7px;width:fit-content;white-space:nowrap}
.pc-modal{position:fixed;inset:0;z-index:999999;display:none}
.pc-modal.is-open{display:block}
.pc-modal-backdrop{position:absolute;inset:0;background:rgba(17,24,39,.5)}
.pc-modal-dialog{position:relative;max-width:920px;margin:4vh auto;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.22);max-height:92vh;display:flex;flex-direction:column}
.pc-modal-header,.pc-modal-actions{padding:14px 18px;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;justify-content:space-between;gap:10px}
.pc-modal-actions{border-bottom:none;border-top:1px solid #e5e7eb;justify-content:flex-end;flex-wrap:wrap}
.pc-modal-title{margin:0;font-size:1rem}
.pc-modal-close{border:none;background:none;font-size:28px;line-height:1;cursor:pointer}
.pc-modal-body{padding:18px;overflow:auto}
.pc-print-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pc-print-card{border:1px solid #e5e7eb;border-radius:14px;overflow:hidden;background:#fff}
.pc-print-swatch{height:140px;position:relative}
.pc-print-swatch-inner{position:absolute;inset:0}
.pc-print-image-overlay{position:absolute;inset:0}
.pc-print-image-overlay img{width:100%;height:100%;object-fit:cover}
.pc-print-info{padding:12px}
.pc-print-name{font-size:.95rem;font-weight:700;margin:0 0 4px}
.pc-print-meta{font-size:.82rem;color:#4b5563;margin:0 0 3px}
.pc-action-btn[data-pc-share].is-hidden{display:none}
.pc-toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(70px);background:#1a1a1a;color:#fff;padding:.55rem 1.1rem;border-radius:999px;font-size:.82rem;pointer-events:none;z-index:1000000;transition:transform .28s cubic-bezier(.16,1,.3,1),opacity .28s;opacity:0;direction:rtl}
.pc-toast.pc-toast-show{transform:translateX(-50%) translateY(0);opacity:1}
.pc-error{color:#dc2626;font-size:.9rem;padding:.5rem;border-right:3px solid #dc2626;background:#fef2f2;border-radius:var(--pc-radius-sm)}
.pc-empty{color:var(--pc-text-muted);font-style:italic}