/* studio-toolkit / product-studio 统一版面:宽度与头部、页脚、其他工具页一致(1840px),配色统一森林绿 */
body main.w-full{max-width:1840px!important;padding:16px 24px 28px!important}
body .pv-hd-in,body .st-subnav-in{max-width:1840px!important;padding-left:24px!important;padding-right:24px!important}
body .sf-wrap,body .sf-bottom{max-width:1840px!important}
@media (max-width:1024px){
  body main.w-full{padding:12px 14px 22px!important}
  body .pv-hd-in,body .st-subnav-in{padding-left:14px!important;padding-right:14px!important}
}
/* 子导航 / 主按钮 / 卡片 */
body .st-subnav{background:linear-gradient(135deg,#09110d 0%,#0f2018 55%,#14301f 100%)!important}
body .tool-tab.active{color:#12281f!important;background:linear-gradient(135deg,#f5f8f5,#e3e9e4)!important}
body .tool-tab.active .tab-icon{background:linear-gradient(135deg,#bff0dc,#2fbf90)!important;box-shadow:0 2px 7px -2px rgba(28,154,115,.55)!important}
body .btn-primary{background:linear-gradient(135deg,#12281f,#1f7d5d)!important;color:#eaf5ef!important}
body .btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#0b1410,#17634a)!important;box-shadow:0 10px 26px -10px rgba(18,40,31,.5)!important}
body .btn-terra{background:linear-gradient(135deg,#f2bd5b,#e0a02f)!important;color:#2b1d03!important}
body .size-preset.active{background:linear-gradient(135deg,#12281f,#1f7d5d)!important;border-color:#12281f!important;color:#eaf5ef!important}
body .size-preset:hover,body .ref-add:hover,body .dropzone:hover{border-color:#2fbf90!important}
body .dropzone.dragover{border-color:#2fbf90!important;background:rgba(47,191,144,.08)!important}
body .panel{border-radius:18px!important;background:#fff!important;border:1px solid #dce4de!important;box-shadow:none!important;backdrop-filter:none!important}
body .brand-gradient,body .login-hero{background:linear-gradient(135deg,#09110d 0%,#0f2018 55%,#14301f 100%)!important}
body .section-label{font-family:'Noto Serif SC','Songti SC',Georgia,serif!important;font-style:normal!important;font-weight:800!important;color:#12281f!important}
body .brand-badge{color:#2a9a74!important}
body .role-badge{background:linear-gradient(135deg,#f2bd5b,#e0a02f)!important;color:#2b1d03!important}
body .toast{background:#0b1410!important;border-color:#1c4a39!important}
body .toast.warn{background:#9c6414!important;border-color:#c07f1f!important}
/* 宽屏下让预览/结果更大 */
@media (min-width:1536px){
  body .dropzone.has-image img{max-height:560px}
  body .result-frame img{max-height:620px}
}

/* ===== 精修工作台 (studio-pro.js) ===== */
#tpWB{position:fixed;inset:0;z-index:9000;background:rgba(8,16,12,.72);display:none;align-items:center;justify-content:center;padding:18px;backdrop-filter:blur(3px)}
#tpWB.on{display:flex}
#tpWB .tp-card{width:min(1680px,100%);height:min(940px,100%);background:#fff;border-radius:16px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.45);color:#0b1410;font-size:13px}
#tpWB header{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#12281f;color:#eaf5ef}
#tpWB header b{font-size:15px;letter-spacing:.02em}
#tpWB .tp-info{font-size:12px;color:#9fc9b6;margin-left:8px}
#tpWB .tp-sp{flex:1}
#tpWB header button{background:rgba(255,255,255,.1);color:#eaf5ef;border:0;border-radius:8px;padding:6px 11px;cursor:pointer;font-size:12px}
#tpWB header button:hover{background:rgba(255,255,255,.2)}
#tpWB header button.on{background:#2fbf90;color:#06150f}
#tpWB header button.x{background:transparent;font-size:16px}
#tpWB .tp-sm{border:1px solid #dce4de;border-radius:8px;padding:5px 8px;font-size:12px;background:#fff;color:#0b1410}
#tpWB header .tp-sm{background:#17382c;color:#eaf5ef;border-color:#2a5442}
#tpWB .tp-body{flex:1;display:flex;min-height:0}
#tpWB .tp-stage{flex:1;background:#eef2ee;background-image:linear-gradient(45deg,#e3e9e4 25%,transparent 25%,transparent 75%,#e3e9e4 75%),linear-gradient(45deg,#e3e9e4 25%,transparent 25%,transparent 75%,#e3e9e4 75%);background-size:20px 20px;background-position:0 0,10px 10px;display:flex;align-items:center;justify-content:center;overflow:auto;position:relative;min-width:0}
#tpEmpty{display:flex;flex-direction:column;align-items:center;gap:10px;color:#506055}
#tpWrap{position:relative;display:none;line-height:0;max-width:100%;max-height:100%}
#tpWrap canvas{max-width:100%;max-height:calc(100vh - 300px);width:auto;height:auto}
#tpWrap #tpCv{display:block;box-shadow:0 4px 24px rgba(0,0,0,.18)}
#tpWrap #tpOv,#tpWrap #tpMk{position:absolute;left:0;top:0;width:100%;height:100%;touch-action:none}
#tpMk{opacity:.7;cursor:crosshair;display:none}
#tpOv{cursor:crosshair}
#tpCmp{display:none}
.tp-cmp{position:relative;overflow:hidden;box-shadow:0 4px 24px rgba(0,0,0,.18);cursor:ew-resize;touch-action:none;user-select:none}
.tp-cmp img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none}
.tp-cmp .ln{position:absolute;top:0;bottom:0;width:2px;background:#fff;box-shadow:0 0 6px rgba(0,0,0,.5);transform:translateX(-1px)}
.tp-cmp em{position:absolute;top:8px;font-style:normal;font-size:11px;background:rgba(11,20,16,.75);color:#fff;padding:2px 8px;border-radius:99px}
.tp-cmp em.l{left:8px}.tp-cmp em.r{right:8px}
#tpWB .tp-side{width:320px;border-left:1px solid #dce4de;display:flex;flex-direction:column;overflow-y:auto;background:#fff}
#tpTabs{display:flex;flex-wrap:wrap;gap:4px;padding:10px;border-bottom:1px solid #eef2ee;position:sticky;top:0;background:#fff;z-index:2}
#tpTabs button{flex:1;padding:7px 4px;border:1px solid #dce4de;border-radius:8px;background:#fff;cursor:pointer;font-size:12px;color:#17382c;white-space:nowrap}
#tpTabs button.on{background:#12281f;color:#fff;border-color:#12281f}
#tpWB .tp-pn{display:none;padding:12px 14px 18px}
#tpWB .tp-pn.on{display:block}
#tpWB .tp-h{font-size:12px;font-weight:700;color:#17382c;margin:12px 0 6px}
#tpWB .tp-note{font-size:12px;color:#506055;background:#eef2ee;border-radius:8px;padding:8px 10px;line-height:1.55;margin:4px 0 8px}
#tpWB .tp-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
#tpWB .tp-chip{border:1px solid #dce4de;background:#fff;border-radius:99px;padding:4px 10px;font-size:12px;cursor:pointer;color:#17382c}
#tpWB .tp-chip.on,#tpWB .tp-chip:hover{background:#eaf5ef;border-color:#2fbf90;color:#1f7d5d}
#tpWB .tp-g2{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
#tpWB .tp-g2 .full{grid-column:1/3}
#tpWB .tp-b{border:1px solid #dce4de;background:#fff;border-radius:9px;padding:8px 10px;font-size:12px;cursor:pointer;color:#0b1410}
#tpWB .tp-b:hover{border-color:#2fbf90}
#tpWB .tp-b.on{background:#eaf5ef;border-color:#2fbf90;color:#1f7d5d}
#tpWB .tp-b.pri{background:#1f7d5d;border-color:#1f7d5d;color:#fff}
#tpWB .tp-b.pri:hover{background:#17382c}
#tpWB .tp-b:disabled{opacity:.55;cursor:wait}
#tpWB .tp-full,#tpWB button.full{width:100%}
#tpWB .tp-in{width:100%;border:1px solid #dce4de;border-radius:8px;padding:7px 9px;font-size:12px;background:#fff;color:#0b1410}
#tpWB textarea.tp-in,#tpWB #tpPPrompt{width:100%;border:1px solid #dce4de;border-radius:8px;padding:8px;font-size:12px;resize:vertical}
#tpWB .tp-row{display:flex;align-items:center;gap:8px;margin:6px 0}
#tpWB .tp-ck{display:flex;align-items:center;gap:6px;font-size:12px;color:#17382c;margin:5px 0}
#tpWB .tp-sl{display:block;margin:8px 0}
#tpWB .tp-sl span{display:flex;justify-content:space-between;font-size:12px;color:#17382c}
#tpWB .tp-sl b{font-weight:600;color:#1f7d5d}
#tpWB .tp-sl input{width:100%;accent-color:#1f7d5d}
#tpWB input[type=color]{width:36px;height:30px;border:1px solid #dce4de;border-radius:6px;padding:0;background:#fff}
#tpWB .tp-pl{display:flex;align-items:center;margin-bottom:5px}
#tpWB .tp-pl button{flex:1;text-align:left;border:1px solid #dce4de;background:#fff;border-radius:8px;padding:7px 10px;font-size:12px;cursor:pointer}
#tpWB .tp-pl button:hover{border-color:#2fbf90;background:#eaf5ef}
#tpWB .tp-pl a{padding:4px 8px;color:#9aa89f;cursor:pointer}
#tpWB .tp-pl a:hover{color:#c0392b}
#tpWB .tp-foot{display:flex;align-items:center;gap:12px;padding:8px 14px;border-top:1px solid #dce4de;background:#f5f8f5}
#tpStrip{flex:1;display:flex;gap:8px;overflow-x:auto;min-width:0}
.tp-th{flex:0 0 auto;width:64px;cursor:pointer;border:2px solid transparent;border-radius:8px;overflow:hidden;background:#fff;text-align:center}
.tp-th.on{border-color:#2fbf90}
.tp-th img{width:100%;height:46px;object-fit:cover;display:block}
.tp-th span{display:block;font-size:10px;color:#506055;padding:1px 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#tpWB .tp-out{display:flex;align-items:center;gap:8px}
#tpOpenTab{margin-left:auto}
body .tp-edit{margin-left:0}
@media (max-width:900px){#tpWB .tp-body{flex-direction:column}#tpWB .tp-side{width:100%;max-height:45%;border-left:0;border-top:1px solid #dce4de}#tpWB{padding:0}#tpWB .tp-card{border-radius:0}}

/* ===== 套图 · 加字 · 方案 (product-pro.js) ===== */
#ppPanel .pp-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:14px}
#ppPanel .pp-tabs{display:flex;gap:6px;flex-wrap:wrap}
#ppPanel .pp-tabs button{border:1px solid #dce4de;background:#fff;border-radius:99px;padding:6px 14px;font-size:12px;cursor:pointer;color:#17382c}
#ppPanel .pp-tabs button.on{background:#12281f;color:#fff;border-color:#12281f}
#ppPanel .pp-pn{display:none}#ppPanel .pp-pn.on{display:block}
#ppPanel .pp-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
#ppPanel .pp-chip{border:1px solid #dce4de;background:#fff;border-radius:99px;padding:5px 12px;font-size:12px;cursor:pointer;color:#17382c}
#ppPanel .pp-chip.on,#ppPanel .pp-chip:hover{background:#eaf5ef;border-color:#2fbf90;color:#1f7d5d}
#ppPanel .pp-note{font-size:12px;color:#506055;background:#eef2ee;border-radius:8px;padding:8px 10px;line-height:1.55;margin-bottom:10px}
#ppPanel .pp-shots{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px;margin-bottom:10px}
#ppPanel .pp-shot{display:flex;align-items:center;gap:6px;border:1px solid #dce4de;border-radius:8px;padding:6px 9px;font-size:12px;cursor:pointer;background:#fff}
#ppPanel .pp-shot small{margin-left:auto;color:#8a998f}
#ppPanel .pp-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0}
#ppPanel .pp-st{font-size:12px;color:#506055}
#ppPanel .pp-b{border:1px solid #dce4de;background:#fff;border-radius:9px;padding:7px 14px;font-size:12px;cursor:pointer;color:#0b1410}
#ppPanel .pp-b:hover{border-color:#2fbf90}
#ppPanel .pp-b.pri{background:#1f7d5d;border-color:#1f7d5d;color:#fff}
#ppPanel .pp-b:disabled{opacity:.5;cursor:not-allowed}
#ppPanel .pp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-top:10px}
#ppPanel .pp-it{border:1px solid #dce4de;border-radius:12px;overflow:hidden;background:#fff}
#ppPanel .pp-it img{width:100%;aspect-ratio:1/1;object-fit:contain;background:#f5f8f5;display:block}
#ppPanel .pp-ph{aspect-ratio:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-size:12px;color:#8a998f;text-align:center;padding:10px;background:#f5f8f5}
#ppPanel .pp-it.err .pp-ph{color:#c0392b}
#ppPanel .pp-sp{width:22px;height:22px;border:3px solid #cfe3d8;border-top-color:#1f7d5d;border-radius:50%;animation:spin .7s linear infinite;display:inline-block}
#ppPanel .pp-cap{display:flex;justify-content:space-between;padding:6px 10px;font-size:12px;color:#17382c}
#ppPanel .pp-cap span{color:#8a998f}
#ppPanel .pp-ac{display:flex;gap:6px;padding:0 10px 10px}
#ppPanel .pp-ac button{flex:1;border:1px solid #dce4de;background:#fff;border-radius:7px;padding:4px 0;font-size:11px;cursor:pointer}
#ppPanel .pp-ac button:hover{border-color:#2fbf90;color:#1f7d5d}
#ppPanel .pp-tx{display:grid;grid-template-columns:320px 1fr;gap:18px}
@media(max-width:900px){#ppPanel .pp-tx,#ppPanel .pp-two{grid-template-columns:1fr!important}}
#ppPanel .pp-tx-r{background:#eef2ee;border-radius:12px;display:flex;align-items:center;justify-content:center;min-height:360px;padding:12px}
#ppPanel #ppCv{max-width:100%;max-height:640px;display:none;box-shadow:0 4px 20px rgba(0,0,0,.15)}
#ppPanel .pp-h{font-size:12px;font-weight:700;color:#17382c;margin:12px 0 6px}
#ppPanel .pp-in{width:100%;border:1px solid #dce4de;border-radius:8px;padding:7px 9px;font-size:12px;background:#fff;color:#0b1410}
#ppPanel .pp-srcs{display:flex;gap:6px;flex-wrap:wrap;max-height:130px;overflow:auto}
#ppPanel .pp-srcs img{width:54px;height:54px;object-fit:cover;border-radius:6px;border:2px solid transparent;cursor:pointer}
#ppPanel .pp-srcs img:hover{border-color:#2fbf90}
#ppPanel .pp-up{display:inline-block;margin-top:6px;font-size:12px;color:#1f7d5d;cursor:pointer;text-decoration:underline}
#ppPanel .pp-mut{font-size:12px;color:#8a998f;padding:8px 0}
#ppPanel .pp-sw{display:flex;gap:6px;align-items:center}
#ppPanel .pp-sw i{width:24px;height:24px;border-radius:50%;border:1px solid #cdd8d0;cursor:pointer;display:inline-block}
#ppPanel .pp-sw input{width:32px;height:26px;padding:0;border:1px solid #dce4de;border-radius:6px}
#ppPanel .pp-two{display:grid;grid-template-columns:1fr 1fr;gap:20px}
#ppPanel .pp-list{max-height:340px;overflow:auto;margin:8px 0}
#ppPanel .pp-li{display:flex;align-items:center;gap:8px;border:1px solid #e3e9e4;border-radius:9px;padding:7px 10px;margin-bottom:6px;background:#fff}
#ppPanel .pp-li-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
#ppPanel .pp-li-t b{font-size:12px;font-weight:600;overflow:hidden;text-overflow:ellipsis}
#ppPanel .pp-li-t small{font-size:11px;color:#8a998f}
#ppPanel .pp-li-a{display:flex;gap:4px}
#ppPanel .pp-li-a button{border:1px solid #dce4de;background:#fff;border-radius:6px;padding:3px 8px;font-size:11px;cursor:pointer;white-space:nowrap}
#ppPanel .pp-li-a button:hover{border-color:#2fbf90;color:#1f7d5d}
