#page-product-card{--pc-action:#2563eb;--pc-action-soft:#eff6ff}
#page-product-card .pc-actions button,#page-product-card .pc-link-btn{color:var(--pc-action)}#page-product-card .pc-actions button.danger{color:#dc3545}
.pc-drawer{width:min(1180px,82vw)}
.pc-library-layer{position:fixed;z-index:4100;inset:0;visibility:hidden;pointer-events:none}.pc-library-layer.show{visibility:visible;pointer-events:auto}
.pc-library-mask{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(24,28,40,.48)}
.pc-library-modal{position:absolute;top:50%;left:50%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(1040px,calc(100vw - 48px));height:min(720px,calc(100vh - 48px));overflow:hidden;border-radius:14px;background:#fff;box-shadow:0 28px 78px rgba(24,28,40,.26);transform:translate(-50%,-50%)}
.pc-library-modal>header{display:flex;align-items:flex-start;justify-content:space-between;padding:17px 20px 14px;border-bottom:1px solid var(--pc-line)}.pc-library-modal>header small{color:var(--pc-action);font-size:10px}.pc-library-modal>header h2{margin:4px 0 0;font-size:18px}
.pc-library-main{display:grid;grid-template-columns:190px minmax(0,1fr);min-height:0}.pc-library-main>aside{overflow:auto;padding:12px 9px;border-right:1px solid var(--pc-line);background:#fafbfc}.pc-library-main>aside button{display:flex;width:100%;height:36px;align-items:center;justify-content:space-between;padding:0 10px;border:0;border-radius:7px;background:transparent;color:#626878;font-size:12px;cursor:pointer}.pc-library-main>aside button:hover{background:#f2f4f8}.pc-library-main>aside button.active{background:var(--pc-action-soft);color:var(--pc-action);font-weight:700}.pc-library-main>aside b{font-size:10px;font-weight:500}
.pc-library-main>main{display:grid;grid-template-rows:auto minmax(0,1fr);min-width:0}.pc-library-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;border-bottom:1px solid var(--pc-line)}.pc-library-toolbar>span{color:#9095a3;font-size:10px}.pc-library-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;align-content:start;overflow:auto;padding:14px}.pc-library-card{display:grid;gap:6px;min-width:0;padding:7px;border:1px solid #e1e4eb;border-radius:9px;background:#fff;color:#4e5463;text-align:left;cursor:pointer}.pc-library-card:hover{border-color:#9dbbf8;box-shadow:0 5px 15px rgba(37,99,235,.08)}.pc-library-card.selected{border-color:var(--pc-action);background:#f8fbff;box-shadow:0 0 0 2px rgba(37,99,235,.1)}.pc-library-cover{position:relative;display:grid;aspect-ratio:1/1;place-items:center;overflow:hidden;border-radius:6px}.pc-library-cover i{position:absolute;top:6px;right:6px;display:grid;width:19px;height:19px;place-items:center;border-radius:50%;background:var(--pc-action);color:#fff;font-size:11px;font-style:normal}.pc-library-cover em{opacity:0;padding:4px 7px;border-radius:5px;background:rgba(29,35,48,.7);color:#fff;font-size:10px;font-style:normal;transition:.15s}.pc-library-card:hover .pc-library-cover em{opacity:1}.pc-library-card strong{overflow:hidden;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.pc-library-card small{overflow:hidden;color:#969baa;font-size:9px;text-overflow:ellipsis;white-space:nowrap}.pc-library-empty{grid-column:1/-1;padding:90px 20px;color:#969baa;text-align:center;font-size:12px}.pc-library-modal>footer{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;border-top:1px solid var(--pc-line)}.pc-library-modal>footer>span{color:#7f8594;font-size:11px}.pc-library-modal>footer>div{display:flex;gap:8px}
.pc-tone-1{background:linear-gradient(135deg,#dbeafe,#bfdbfe)}.pc-tone-2{background:linear-gradient(135deg,#dcfce7,#bbf7d0)}.pc-tone-3{background:linear-gradient(135deg,#fef3c7,#fde68a)}.pc-tone-4{background:linear-gradient(135deg,#fce7f3,#fbcfe8)}.pc-tone-5{background:linear-gradient(135deg,#e0e7ff,#c7d2fe)}.pc-tone-6{background:linear-gradient(135deg,#cffafe,#a5f3fc)}
.pc-source-picker{display:grid;grid-template-columns:90px minmax(0,1fr);gap:12px;align-items:center;min-height:104px;padding:12px;border:1px dashed #cfd5df;border-radius:10px;background:#fbfcfe}.pc-source-preview{display:grid;width:80px;aspect-ratio:1/1;place-items:center;overflow:hidden;border-radius:8px;background:#eff4ff;color:#6680b8;font-size:10px;text-align:center}.pc-source-preview img{width:100%;height:100%;object-fit:cover}.pc-source-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.pc-source-actions strong{flex-basis:100%;color:#4b5262;font-size:12px}.pc-source-actions small{flex-basis:100%;color:#9298a6;font-size:10px}.pc-source-actions button{height:31px;padding:0 10px;border:1px solid #d7dfed;border-radius:7px;background:#fff;color:var(--pc-action);font-size:11px;cursor:pointer}.pc-source-actions button:hover{border-color:#8bb0f6;background:#f8fbff}
.pc-rule-table{overflow:hidden;border:1px solid #e3e6ed;border-radius:9px;background:#fff}.pc-rule-table .pc-rule-head,.pc-rule-table .pc-rule-row{grid-template-columns:32px 220px minmax(300px,1fr) 82px 132px}.pc-rule-table .pc-rule-head{height:37px;align-items:center;padding:0 10px;border-bottom:1px solid #e3e6ed;background:#f7f8fa}.pc-rule-table .pc-rule-list{gap:0}.pc-rule-table .pc-rule-row{min-height:104px;padding:10px;border:0;border-bottom:1px solid #eceef2;border-radius:0}.pc-rule-table .pc-rule-row:last-child{border-bottom:0}.pc-rule-table .pc-rule-row:hover{background:#fbfdff}.pc-rule-table .pc-rule-row.is-new{background:#f5f9ff;animation:pc-new-row 1.2s ease}.pc-rule-table .pc-rule-row.selected{background:#f5f9ff}
.pc-rule-images{display:flex;min-width:0;align-items:center;gap:6px;overflow-x:auto;padding:2px}.pc-rule-thumb{position:relative;display:grid;flex:0 0 68px;aspect-ratio:1/1;place-items:center;overflow:hidden;border:1px solid #dde2ea;border-radius:7px}.pc-rule-thumb img{width:100%;height:100%;object-fit:cover}.pc-rule-thumb>span{width:100%;height:100%}.pc-rule-thumb-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:6px;background:rgba(20,28,43,.54);opacity:0;transition:.15s}.pc-rule-thumb:hover .pc-rule-thumb-overlay{opacity:1}.pc-rule-thumb-overlay button{display:grid;width:25px;height:25px;place-items:center;border:0;border-radius:6px;background:#fff;color:#334155;font-size:13px;cursor:pointer}.pc-rule-thumb-overlay button:last-child{color:#dc3545}.pc-rule-image-add{display:grid;flex:0 0 68px;aspect-ratio:1/1;place-items:center;border:1px dashed #c9d2e1;border-radius:7px;background:#fafcff;color:var(--pc-action);font-size:10px;cursor:pointer}.pc-rule-image-add:hover{border-color:#86aaf2;background:#f4f8ff}.pc-rule-image-menu{display:grid;gap:4px;min-width:70px}.pc-rule-image-menu button{padding:0;border:0;background:transparent;color:var(--pc-action);font-size:10px;text-align:left;cursor:pointer}
.pc-rule-prompt-wrap{position:relative;min-height:72px}.pc-rule-prompt-wrap .pc-rule-prompt{height:72px}.pc-prompt-skeleton{position:absolute;inset:0;overflow:hidden;border-radius:7px;background:#f0f2f6}.pc-prompt-skeleton:before,.pc-prompt-skeleton:after{position:absolute;left:10px;height:8px;border-radius:4px;background:#dfe3ea;content:""}.pc-prompt-skeleton:before{top:18px;width:82%}.pc-prompt-skeleton:after{top:39px;width:58%}.pc-prompt-skeleton i{position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.72),transparent);animation:pc-skeleton 1.1s infinite}.pc-prompt-error{display:flex;height:72px;align-items:center;justify-content:center;gap:8px;border:1px solid #f0c9ce;border-radius:7px;background:#fff6f7;color:#b94b58;font-size:10px}.pc-prompt-error button{padding:0;border:0;background:transparent;color:var(--pc-action);cursor:pointer}
.pc-rule-table .pc-rule-actions{display:flex;align-items:flex-start;flex-direction:column;gap:7px}.pc-rule-table .pc-rule-actions button{height:auto;padding:0;border:0;border-radius:0;background:transparent;color:var(--pc-action);font-size:11px;text-align:left}.pc-rule-table .pc-rule-actions button:last-child{color:#dc3545}.pc-rule-table .pc-inline-insert{gap:4px}.pc-rule-table .pc-inline-input{width:38px;height:24px}.pc-rule-table .pc-rule-qty{height:32px}.pc-rule-empty{padding:45px 20px;color:#979caa;text-align:center;font-size:11px}
.pc-source-preview>span,.pc-rule-thumb>span{display:block}.pc-rule-thumb>.pc-rule-thumb-overlay{position:absolute;display:flex}
.pc-upload-error{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid #f1c6cc;border-radius:8px;background:#fff5f6;color:#b53e4d;font-size:11px;line-height:1.55}.pc-upload-error span{min-width:0}.pc-upload-error b{display:block;margin-bottom:2px;color:#a83342}.pc-upload-error button{flex:0 0 auto;width:24px;height:24px;border:0;border-radius:6px;background:#ffe7ea;color:#b53e4d;font-size:16px;cursor:pointer}
.pc-rule-hover-preview{position:fixed;z-index:3800;display:none;width:322px;overflow:hidden;border:1px solid #dfe3ea;border-radius:10px;background:#fff;box-shadow:0 18px 46px rgba(20,28,43,.24);pointer-events:none}.pc-rule-hover-preview.show{display:block}.pc-rule-hover-image{display:grid;width:320px;aspect-ratio:1/1;place-items:center;overflow:hidden;background:#f3f5f8}.pc-rule-hover-image img{width:100%;height:100%;object-fit:contain}.pc-rule-hover-image>span{display:block;width:100%;height:100%}.pc-rule-hover-meta{display:flex;height:36px;align-items:center;justify-content:space-between;gap:10px;padding:0 10px;border-top:1px solid #e7e9ee}.pc-rule-hover-meta strong{min-width:0;overflow:hidden;color:#414756;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.pc-rule-hover-meta span{flex:0 0 auto;color:#9196a4;font-size:10px}
.pc-rule-table .pc-rule-head,.pc-rule-table .pc-rule-row{grid-template-columns:32px 44px 220px minmax(300px,1fr) 82px 132px}.pc-rule-seq{color:#697080;font-size:11px;text-align:center}
@keyframes pc-skeleton{from{transform:translateX(-100%)}to{transform:translateX(100%)}}@keyframes pc-new-row{0%{box-shadow:inset 0 0 0 2px #60a5fa}100%{box-shadow:inset 0 0 0 2px transparent}}
@media(max-width:1100px){.pc-library-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.pc-rule-table .pc-rule-head,.pc-rule-table .pc-rule-row{grid-template-columns:30px 40px 190px minmax(260px,1fr) 72px 118px}}
@media(max-width:760px){.pc-library-main{grid-template-columns:1fr}.pc-library-main>aside{display:flex;overflow-x:auto;border-right:0;border-bottom:1px solid var(--pc-line)}.pc-library-main>aside button{min-width:110px}.pc-library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pc-source-picker{grid-template-columns:74px 1fr}.pc-source-preview{width:68px}}
@media(max-width:800px){.pc-drawer{width:100vw}}