:root{--side:#101923;--side-2:#172430;--side-line:#263746;--side-text:#aab9c7;--content:#edf2f5;--paper:#fff;--ink:#172431;--muted:#718190;--line:#dbe4ea;--brand:#0f8a91;--brand-2:#d9f3f1;--accent:#e0a34d;--shadow:0 10px 28px rgba(24,47,61,.08);--radius:12px}
*{box-sizing:border-box}body{background:var(--content);color:var(--ink);font-family:"Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;font-size:14px;line-height:1.55}button,input,textarea,select{font:inherit}button{border-radius:9px;min-height:38px;padding:9px 14px;transition:background .18s ease,transform .18s ease,box-shadow .18s ease}button:hover{transform:translateY(-1px)}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid rgba(15,138,145,.25);outline-offset:2px}.shell{min-height:100vh;background:var(--content)}
.topbar{height:68px;padding:0 28px;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);box-shadow:0 3px 14px rgba(15,32,45,.05);gap:14px}.brand{display:flex;align-items:center;gap:10px;font-size:18px;letter-spacing:.01em;color:var(--ink)}.brand:before{content:"";width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,#16a8ad,#0d737c);box-shadow:0 5px 12px rgba(15,138,145,.28)}.brand small{display:block;font-size:9px;letter-spacing:.16em;color:var(--muted);margin-top:1px}.userbox{font-size:13px;color:var(--muted)}.userbox .ghost{background:#eef8f7;color:var(--brand);border:1px solid #cce9e6}
.layout{grid-template-columns:230px minmax(0,1fr);min-width:0}.nav{background:var(--side);border-right:1px solid var(--side-line);padding:20px 12px;min-width:0;gap:5px}.nav:before{content:"工作台";padding:3px 13px 13px;color:#65798b;font-size:10px;letter-spacing:.22em;font-weight:700}.nav button{display:flex;align-items:center;gap:11px;width:100%;min-height:42px;margin:0;padding:10px 13px;background:transparent;color:var(--side-text);border-radius:9px;text-align:left;font-size:14px;font-weight:500}.nav button svg{width:19px!important;height:19px!important;max-width:19px;max-height:19px;flex:0 0 19px;stroke-width:1.7}.nav button:hover{background:var(--side-2);color:#edf7fa}.nav button.active{background:linear-gradient(90deg,rgba(15,138,145,.32),rgba(15,138,145,.08));color:#e9ffff;font-weight:650;box-shadow:inset 3px 0 0 var(--brand)}
.main{max-width:1500px;padding:30px 34px;min-width:0}.page-title{align-items:center;margin-bottom:22px}.page-title h1{font-size:26px;letter-spacing:-.01em;margin:0;color:#172734}.page-title p{color:var(--muted);margin:5px 0 0}.page-title>button{background:var(--brand-2);color:#08777e;border:1px solid #c9e9e5}.grid{gap:16px}.card{border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);box-shadow:var(--shadow);padding:18px}.metric{min-height:108px;position:relative;overflow:hidden}.metric:after{content:"";position:absolute;right:-22px;bottom:-26px;width:88px;height:88px;border:1px solid rgba(15,138,145,.13);border-radius:50%}.metric span{font-size:12px;color:var(--muted);letter-spacing:.03em}.metric strong{font-size:27px;line-height:1.1;margin-top:13px;color:#172734}.admin-stats{margin-bottom:16px}.admin-tabs{display:flex;gap:5px;flex-wrap:wrap;margin:0 0 17px;padding:5px;background:#e5ecef;border:1px solid #d6e0e5;border-radius:10px}.admin-tabs button{background:transparent;color:#657683;border:1px solid transparent;min-height:36px;padding:8px 13px;font-size:13px}.admin-tabs button.active{background:#fff;color:var(--brand);border-color:#cfe3e5;box-shadow:0 2px 7px rgba(26,55,67,.08)}.admin-box{margin-bottom:16px}.admin-box h2{font-size:16px;letter-spacing:.01em}.admin-list-row,.admin-table-row{min-height:54px;padding:11px 0;border-bottom:1px solid #edf1f3}.admin-list-row:last-child,.admin-table-row:last-child{border-bottom:0}.admin-list-row b,.admin-table-row b{font-weight:650;color:#20313d}.admin-list-row .muted,.admin-table-row .muted{color:#81909b;font-size:12px}.status{font-size:11px;padding:4px 8px;border-radius:999px;background:#e5f6eb;color:#237345;font-weight:650}.status.off{background:#f0f3f5;color:#7c8992}.admin-table-row button{min-height:31px;padding:5px 9px;font-size:12px}.form-grid{gap:10px}label{font-size:12px;color:#637785}input,textarea,select{border:1px solid #d6e0e5;border-radius:8px;padding:9px 10px;background:#fbfdfe}input:focus,textarea:focus,select:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(15,138,145,.12);outline:0}.empty{padding:28px;color:#82919b;background:#fbfdfe;border-color:#d6e1e6}.notice{border:1px solid #f0dfbc}.positive{color:#238044}.negative{color:#bd4a4a}.toast{box-shadow:0 8px 25px rgba(14,28,38,.18)}.image-layout{grid-template-columns:minmax(260px,340px) minmax(0,1fr)}.preview{min-height:280px}.result{gap:14px}
@media(max-width:900px){.main{padding:22px 18px}.topbar{padding:0 18px}.layout{grid-template-columns:1fr}.nav{width:100%;max-width:100vw;flex-direction:row;overflow-x:auto;padding:8px;border-right:0;border-bottom:1px solid var(--side-line)}.nav:before{display:none}.nav button{width:auto;min-width:max-content;min-height:38px;padding:8px 11px}.nav button svg{width:17px!important;height:17px!important;flex-basis:17px}.page-title{align-items:flex-start}.page-title h1{font-size:23px}}
@media(max-width:620px){.main{padding:17px 13px}.topbar{height:60px;padding:0 13px}.brand{font-size:16px}.brand:before{width:24px;height:24px}.userbox{gap:7px;font-size:12px}.admin-tabs{overflow-x:auto;flex-wrap:nowrap}.admin-tabs button{white-space:nowrap}.admin-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}.admin-stats .metric{min-height:88px;padding:14px}.admin-stats .metric strong{font-size:21px}.admin-list-row,.admin-table-row,.provider-config,.plugin-row{grid-template-columns:minmax(0,1fr) auto}.admin-table-row>button{grid-column:2}.admin-table-row>strong,.admin-table-row>.status{grid-column:2;grid-row:1}.admin-box{padding:14px}.page-title{gap:10px}.page-title>button{white-space:nowrap}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.login{position:relative;isolation:isolate;overflow:hidden;background:#0c1622;color:#e9f4f5;padding:42px}.login:before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 18% 12%,rgba(17,169,174,.22),transparent 34%),linear-gradient(135deg,#0b1622 0%,#102b3a 48%,#0b1824 100%)}.login:after{content:"";position:absolute;inset:0;z-index:-1;opacity:.18;background-image:linear-gradient(rgba(145,213,215,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(145,213,215,.24) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(90deg,#000,transparent 72%)}.login-grid{width:min(1120px,100%);display:grid;grid-template-columns:1.12fr .88fr;gap:72px;align-items:center}.login-brand{padding:28px 0}.login-brand .brand{color:#eefbfc;font-size:23px}.login-brand .brand small{color:#8baeba}.login-kicker{color:#65d2d0;font-size:11px;letter-spacing:.24em;margin:34px 0 18px}.login-brand h1{font-size:clamp(36px,4.6vw,64px);line-height:1.08;letter-spacing:-.04em;margin:0;max-width:620px}.login-brand h1 strong{color:#63d2cf;font-weight:750}.login-brand>p{color:#a4bbc6;font-size:16px;max-width:470px;margin:24px 0}.login-flow{display:flex;gap:13px;align-items:center;color:#9cb6c1;font-size:12px}.login-flow span{display:flex;gap:6px;align-items:center}.login-flow b{color:#65d2d0;font-size:11px}.login-flow i{color:#557988;font-style:normal}.login-card{width:min(420px,100%);padding:30px;background:rgba(247,252,253,.97);border:1px solid rgba(151,218,219,.5);border-radius:16px;box-shadow:0 24px 70px rgba(0,0,0,.28)}.login-card-head{display:flex;justify-content:space-between;align-items:center;color:#213947;font-size:14px;font-weight:700}.login-card-head em{font-size:10px;letter-spacing:.16em;color:#0d8c92;font-style:normal}.login-card h2{font-size:29px;margin:28px 0 5px;color:#182d3a}.login-card p{color:#718490;margin:0 0 18px}.login-card label{color:#59707c;margin:13px 0 5px}.login-card input{min-height:44px;background:#fff}.login-card button{width:100%;margin-top:17px;background:#0f8a91;color:#fff;box-shadow:0 10px 22px rgba(15,138,145,.23)}.login-card button span{float:right;font-size:18px;line-height:1}.login-note{margin-top:18px;color:#7b8d97;font-size:12px}.collect-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:16px;background:linear-gradient(125deg,#fff 0%,#f0fbfa 100%);border-color:#cbe6e4}.collect-hero h2{margin:5px 0 2px;font-size:18px}.eyebrow{font-size:10px;letter-spacing:.18em;color:var(--brand);font-weight:700}.collect-hero .primary{background:var(--brand);color:#fff;white-space:nowrap}@media(max-width:760px){.login{padding:22px}.login-grid{grid-template-columns:1fr;gap:16px}.login-brand{padding:5px 0}.login-brand h1{font-size:38px}.login-kicker{margin-top:18px}.login-flow{display:none}.collect-hero{align-items:flex-start;flex-direction:column}.collect-hero .primary{width:100%}}
:root{--motion-fast:180ms}
@keyframes loginGlow{0%{transform:scale(1)}100%{transform:scale(1.08);filter:hue-rotate(18deg)}}
@keyframes gridDrift{from{background-position:0 0}to{background-position:42px 42px}}
@keyframes loginEnter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes cardPulse{0%,100%{box-shadow:0 24px 70px rgba(0,0,0,.28)}50%{box-shadow:0 24px 70px rgba(0,0,0,.28),0 0 28px rgba(99,210,207,.14)}}
.login:before{animation:loginGlow 12s ease-in-out infinite alternate}.login:after{animation:gridDrift 24s linear infinite}.login-grid{animation:loginEnter .65s ease-out both}.login-card{animation:cardPulse 5s ease-in-out infinite}
.login-particles{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:-1}.login-particles i{position:absolute;width:5px;height:5px;border-radius:50%;background:#6be0dc;box-shadow:0 0 16px #6be0dc;animation:particleFloat 8s linear infinite}.login-particles i:nth-child(1){left:12%;top:72%;animation-delay:-2s}.login-particles i:nth-child(2){left:36%;top:18%;animation-delay:-5s}.login-particles i:nth-child(3){left:68%;top:76%;animation-delay:-1s}.login-particles i:nth-child(4){left:88%;top:30%;animation-delay:-6s}.login-scan{position:absolute;left:0;right:0;top:-20%;height:2px;background:linear-gradient(90deg,transparent,#6be0dc,transparent);box-shadow:0 0 18px #6be0dc;animation:scanLine 7s ease-in-out infinite}@keyframes particleFloat{0%{transform:translateY(30px);opacity:0}20%,80%{opacity:.8}100%{transform:translateY(-160px);opacity:0}}@keyframes scanLine{0%,100%{top:-5%;opacity:0}20%,80%{opacity:.65}50%{top:105%}}
.module-subnav{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px;padding:7px;border:1px solid var(--line);border-radius:11px;background:#f7fafb}.module-subnav button{background:transparent;border:1px solid transparent;color:var(--muted);display:flex;gap:7px;align-items:center}.module-subnav button b{color:var(--brand);font-size:10px}.module-subnav button.active,.module-subnav button:hover{background:#fff;color:var(--brand);border-color:#cbe6e4}.studio-mode-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0 0 16px}.studio-mode-cards button{text-align:left;border:1px solid var(--line);background:#fff;padding:15px}.studio-mode-cards button strong,.studio-mode-cards button span{display:block}.studio-mode-cards button span{font-size:12px;color:var(--muted);margin-top:4px}.studio-mode-cards button.active{border-color:var(--brand);box-shadow:0 0 0 3px rgba(15,138,145,.1)}.collect-thumb{width:70px;height:70px;flex:0 0 70px;border-radius:9px;overflow:hidden;background:#edf3f5;display:grid;place-items:center;color:#8b9aa3;font-size:11px}.collect-thumb img{width:100%;height:100%;object-fit:cover}.growth-actions{margin-top:16px}.action-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.action-grid button{background:#f1faf9;border:1px solid #cbe6e4;color:#08777e}@media(max-width:760px){.studio-mode-cards,.action-grid{grid-template-columns:1fr 1fr}}@media(max-width:520px){.studio-mode-cards,.action-grid{grid-template-columns:1fr}}
.studio-nav-group{margin:0}.studio-nav-group .nav-parent{position:relative}.studio-nav-group .nav-caret{margin-left:auto;font-size:16px;transition:transform .2s}.studio-nav-group.open .nav-caret{transform:rotate(180deg)}.studio-nav-group .nav-sub{display:none;padding:3px 0 6px 30px}.studio-nav-group.open .nav-sub{display:grid;gap:2px}.studio-nav-group .nav-sub button{display:flex;align-items:center;gap:9px;width:100%;padding:8px 10px;border:0;border-radius:7px;background:transparent;color:var(--side-muted,#91a9b4);font-size:13px;text-align:left}.studio-nav-group .nav-sub button:hover{background:var(--side-2,#173543);color:#e9ffff}.studio-nav-group .nav-sub button span{font-size:10px;color:#6e8b98;font-family:monospace}
.studio-nav-group{margin:0}.studio-nav-group .nav-parent{position:relative}.studio-nav-group .nav-caret{margin-left:auto;font-size:16px;line-height:1;transition:transform .2s}.studio-nav-group.open .nav-caret{transform:rotate(180deg)}.studio-nav-group .nav-sub{display:none;padding:3px 0 6px 32px}.studio-nav-group.open .nav-sub{display:grid;gap:2px}.studio-nav-group .nav-sub button{display:flex;align-items:center;gap:9px;width:100%;padding:9px 10px;border:0;border-radius:7px;background:transparent;color:var(--side-muted,#91a9b4);font-size:13px;text-align:left}.studio-nav-group .nav-sub button:hover,.studio-nav-group .nav-sub button:focus{background:var(--side-2,#173543);color:#e9ffff}.studio-nav-group .nav-sub button span{font-size:10px;color:#6e8b98;font-family:monospace}.studio-nav-group.open .nav-parent{background:var(--side-2,#173543);color:#e9ffff}
.collect-form{display:flex;gap:10px}.collect-form input{min-width:0;flex:1}.form-hint{font-size:12px;margin-top:8px}.studio-empty{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}.studio-empty strong{color:var(--ink);font-size:17px}.studio-empty-actions{display:flex;gap:8px;margin-top:8px}
@media(max-width:620px){.collect-form{flex-direction:column}.collect-form button{width:100%}.studio-empty-actions{width:100%;flex-direction:column}.studio-empty-actions button{width:100%}}
.wb-pipe{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:0 0 16px;padding:12px 16px;background:linear-gradient(90deg,#eafaf8,#f4fbfa);border:1px solid #cbe6e4;border-radius:12px}.wb-pipe-title{font-weight:700;color:#0d737c}.wb-switch{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:#2d4a52;cursor:pointer;user-select:none}.wb-switch input{width:18px;height:18px;accent-color:var(--brand)}.wb-pipe .ghost{background:#fff;border:1px solid #cbe6e4;color:#0d737c}.wb-pipe #wbJob{font-size:13px}.status.builtin{background:#eef2f6;color:#5a6b78;font-weight:600}

/* 采集列表缩略图：规则已合并到下方 2026-10-10 修正块（旧 5 列定义与 6 子元素不匹配，已删除） */

/* ===== 精铺功能模块 ===== */
.nav-group{margin:0}
.nav-parent{display:flex;align-items:center;justify-content:space-between;width:100%;background:transparent;color:var(--side-text);border-radius:9px;text-align:left;font-size:14px;font-weight:500}
.nav-parent:hover{background:var(--side-2);color:#edf7fa}
.nav-parent .caret{font-style:normal;font-size:10px;transition:transform .18s ease}
.nav-group.open .nav-parent{background:var(--side-2);color:#e9ffff}
.nav-group.open .caret{transform:rotate(180deg)}
.nav-sub{display:none;padding:3px 0 3px 12px;margin:0 0 3px;border-left:1px solid var(--side-line)}
.nav-group.open .nav-sub{display:block}
.nav-sub button{display:block;width:100%;min-height:34px;margin:2px 0;padding:7px 11px;background:transparent;color:#93a6b5;border-radius:8px;text-align:left;font-size:13px}
.nav-sub button:hover{background:var(--side-2);color:#e9ffff}
.nav-sub button.active{background:linear-gradient(90deg,rgba(15,138,145,.28),rgba(15,138,145,.06));color:#e9ffff;font-weight:600}

/* ================================================================
   2026-10-08 · 右侧操作窗口自适应（老张反馈：内容超出可视区要下拉滚动）
   根因：.main 固定 max-width + 栅格子项缺 min-width:0，长内容/长串文本
        会把列撑破，导致整页出现横向滚动条、右侧面板被迫内部滚动。
   方案：容器流式自适应 + 栅格子项 min-width:0 + 文本/图片自适应换行，
        只在真正需要时才出现滚动（长代码/长 URL 用局部滚动替代整页滚动）。
   ================================================================ */
.main{width:100%;max-width:none;margin:0;padding:28px clamp(14px,2.2vw,34px);min-width:0}
.layout{grid-template-columns:230px minmax(0,1fr)}
/* 栅格/弹性子项默认 min-width:auto 会被内容撑破 → 统一归零，这是横向溢出的头号元凶 */
.grid>*,.form-grid>*,.layout>*,.main>*,.card{min-width:0}
/* 卡片与标题不再因长内容外扩 */
.card{max-width:100%;overflow-wrap:anywhere;word-break:break-word}
.page-title{flex-wrap:wrap}
.page-title>div{min-width:0}
/* 所有栅格列改用 minmax(0,1fr)，窄屏自动降列，杜绝固定列宽溢出 */
.grid.cols-4{grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}
.grid.cols-2{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.form-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.action-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.image-layout{grid-template-columns:minmax(0,1fr)}
/* 长文本类内容自适应：URL/长串不再撑破，只在局部滚动 */
.store-row,.admin-table-row,.admin-list-row,.prod-row,.version-card{min-width:0}
.store-row>div,.admin-table-row>div{min-width:0}
.store-row b,.admin-table-row b,.prod-row b{overflow-wrap:anywhere}
.store-row .muted,.plugin-row .muted,.admin-table-row .muted{
  white-space:normal;overflow:visible;text-overflow:clip;
  overflow-wrap:anywhere;word-break:break-word}
/* 采集列表（2026-10-10 修正老张反馈"格式不如之前"）：
   行内实际 6 个子元素（缩略图/标题/图片数/日期/进入精铺/删除），
   每档列数必须和可见元素数一致，否则按钮被挤到第二行、"删除"横跨多列变成大色块。
   1180 以下藏"图片数"（剩 5 元素 5 列）；760 以下再藏日期（剩 4 元素 4 列）。 */
.store-row{grid-template-columns:auto minmax(0,1.6fr) auto auto auto auto;gap:12px;align-items:center}
.store-row .collect-thumb{width:56px;height:56px;flex:0 0 56px}
.store-row .danger{white-space:nowrap}
@media(max-width:1180px){
  .store-row{grid-template-columns:auto minmax(0,1fr) auto auto auto}
  .store-row>span.muted:nth-of-type(1){display:none}
}
@media(max-width:760px){
  .store-row{grid-template-columns:auto minmax(0,1fr) auto auto}
  .store-row>span.muted{display:none}
}
/* 表单控件与结果区自适应 */
input,textarea,select{max-width:100%}
textarea{resize:vertical;min-height:64px}
.result{grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr))}
.result img,.collect-thumb img{max-width:100%;height:auto}
.version-image img,.preview img{max-width:100%;height:auto;max-height:min(56vh,420px);object-fit:contain}
/* 空状态与提示块自适应宽度，长提示不撑破 */
.empty,.notice,.banner,.login-note{overflow-wrap:anywhere;word-break:break-word;max-width:100%}
/* 长 URL / 错误详情用局部滚动兜底，而不是把整页撑宽 */
#stPrompt,#prompt,#growthPlan pre,.detail-scroll{
  max-width:100%;overflow-x:auto;overflow-wrap:anywhere;white-space:pre-wrap}
/* 顶部栏窄屏下允许换行，避免挤压菜单 */
@media(max-width:900px){
  .topbar{height:auto;min-height:60px;flex-wrap:wrap;padding:10px 16px}
  .userbox{flex-wrap:wrap}
  .main{padding:18px 14px}
}
@media(max-width:620px){
  .main{padding:14px 11px}
  .grid.cols-4,.grid.cols-2{grid-template-columns:minmax(0,1fr)}
}
/* 左侧菜单：分组可点区域扩大，避免误触；子项可点区域足够大（触屏友好） */
.nav-group{margin:0 0 2px}
.nav-parent{min-height:42px}
.nav-sub{display:none}
.nav-group.open .nav-sub{display:block}
.nav-sub button{min-height:38px;width:100%}
.nav-group .caret{flex:0 0 auto;margin-left:auto;padding-left:6px;font-size:11px;opacity:.75}
.nav-item{margin:0 0 2px}
/* 2026-10-08：ERP 下拉子项图标与父项统一尺寸/对齐（老张反馈子项无图标）。
   父项 .nav button svg 已被强制 19px，这里让 .nav-sub button 的 svg 走同一套规则，
   保证「会员店铺 ERP / 增长诊断 / 店铺经营数据 / 竞品采集」图标大小一致、文字左对齐成一条线。 */
.nav-sub button{display:flex;align-items:center;gap:9px}
.nav-sub button svg{width:17px!important;height:17px!important;min-width:17px;min-height:17px;flex:0 0 17px;stroke-width:1.7;opacity:.85}
.nav-sub button:hover svg,.nav-sub button.active svg{opacity:1}
.nav-group.open .nav-sub button span{font-size:13px;line-height:1.4}
@media(max-width:900px){.nav-sub button svg{width:16px!important;height:16px!important;min-width:16px;min-height:16px;flex-basis:16px}}
/* 子项点击后的定位高亮（配合 focusStudioSection） */
.flash-on{animation:flashOn 1.4s ease}
@keyframes flashOn{0%{box-shadow:0 0 0 0 rgba(15,138,145,.55)}40%{box-shadow:0 0 0 5px rgba(15,138,145,.16)}100%{box-shadow:0 0 0 0 rgba(15,138,145,0)}}
/* 任务进度条（executeJob 渲染） */
.job-progress{display:flex;align-items:center;gap:10px;margin:2px 0 12px}
.job-progress-bar{flex:1;height:8px;border-radius:999px;background:#e7eef1;overflow:hidden;min-width:0}
.job-progress-bar>i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--brand),#3fc6bf);transition:width .35s ease}
.job-progress-num{font-size:12px;color:var(--muted);min-width:38px;text-align:right;font-variant-numeric:tabular-nums}
.job-step{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;align-items:center;padding:9px 0;border-bottom:1px solid #edf1f4}
.job-step:last-child{border-bottom:0}
.job-step b{font-weight:650;color:#20313d;min-width:0}
.job-step .muted{grid-column:1/-1;font-size:12px;color:#81909b}
.job-step-status{font-size:12px;border-radius:999px;padding:3px 9px;background:#eef2f6;color:#5a6b78;white-space:nowrap}
.job-step-done .job-step-status{background:#e5f6eb;color:#237345}
.job-step-error .job-step-status{background:#fdecec;color:#b5352f}
.job-step-running .job-step-status{background:#fff4e2;color:#8a5a12}
.job-step-skipped .job-step-status{background:#f2f3f5;color:#7c8992}
@media(max-width:620px){.job-step{grid-template-columns:minmax(0,1fr)}.job-step-status{grid-column:1;justify-self:start}}
/* 2026-10-08 精铺「选择图片」入口（老张：应由我们来选图片）
   复用 .card/.ghost/.toolbar 既有样式，保证与其它页面一致，不新增视觉语言。 */
.studio-img-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0 12px}
.studio-img-toolbar .muted{font-size:12px;min-width:0;flex:1 1 180px}
.studio-img-toolbar .ghost{white-space:nowrap}
/* 图区单元格：图 + 角标（区分「采集图」/「本机选图」/「主图」/「副图N」） */
.studio-img-cell{position:relative;min-width:0;border:2px solid transparent;border-radius:10px;padding:2px;
  background:#fff;transition:border-color .18s ease,box-shadow .18s ease}
.studio-img-cell.is-main{border-color:var(--brand);box-shadow:0 0 0 3px rgba(15,138,145,.12)}
.studio-img-cell img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;background:#eef2f4;display:block}
.studio-img-tag{position:absolute;left:6px;top:6px;padding:2px 7px;border-radius:999px;
  background:rgba(23,36,49,.72);color:#fff;font-size:11px;line-height:1.5;backdrop-filter:blur(2px)}
.studio-img-tag.main{background:var(--brand)}
.studio-img-tag.sub{background:#3f6ea8}
/* 每张图下方两个小按钮：设为主图 / 设为副图 */
.studio-img-ops{display:flex;gap:6px;margin-top:6px}
.studio-img-ops .mini{flex:1;min-height:28px;padding:4px 6px;font-size:12px;font-weight:600;
  background:#f1f5f6;color:#5b6b76;border:1px solid #dde5e8;white-space:nowrap}
.studio-img-ops .mini:hover{background:#e7eef0}
.studio-img-ops .mini.on{background:var(--brand);color:#fff;border-color:var(--brand)}
.studio-img-ops .mini:disabled{opacity:.42;cursor:not-allowed}
/* 生成模式二选一卡片（老张：可定先出1张主图 还是 一主7副） */
.gen-mode-field{margin:14px 0 4px}
.gen-mode-label{display:block;font-size:13px;color:var(--muted);margin-bottom:7px}
.gen-mode-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.gen-mode-card{text-align:left;border:1px solid var(--line);background:#fff;padding:12px;
  display:flex;flex-direction:column;gap:3px;min-height:0}
.gen-mode-card strong{font-size:14px;font-weight:700;color:var(--ink)}
.gen-mode-card span{font-size:12px;color:var(--muted);line-height:1.5}
.gen-mode-card em{font-style:normal;font-size:12px;font-weight:700;color:var(--brand);margin-top:2px}
.gen-mode-card.active{border-color:var(--brand);background:#f4fdfc;box-shadow:0 0 0 3px rgba(15,138,145,.1)}
.gen-mode-card.active strong{color:var(--brand)}
@media(max-width:760px){.gen-mode-cards{grid-template-columns:1fr}}
@media(max-width:620px){.studio-img-toolbar{flex-direction:column;align-items:stretch}.studio-img-toolbar .ghost{width:100%}}

.jp-card{margin-bottom:14px}
.jp-sec-title{font-size:15px;margin:0 0 14px;padding-left:10px;border-left:3px solid var(--brand)}
.jp-fields{display:grid;gap:14px}
.jp-field span{display:block;font-size:12px;color:#637785;margin-bottom:5px}
.jp-field textarea{min-height:88px;resize:vertical}
.jp-hint{font-size:12px;color:var(--muted);margin-top:5px}
.jp-list-rows,.jp-kv-rows{display:grid;gap:6px;margin-bottom:8px}
.jp-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 10px;background:#f4f8f9;border:1px solid #e3ebee;border-radius:8px;font-size:13px}
.jp-row button{min-height:24px;padding:0 8px;background:transparent;color:#97a5ae;border:0;font-size:15px}
.jp-list-add,.jp-kv-add{display:flex;gap:8px}
.jp-kv-add input{flex:1;min-width:0}
.jp-model-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:end}
.jp-price{font-size:13px;color:#4a5c68;padding-bottom:8px}
.jp-run-row{display:flex;align-items:center;gap:14px}
.jp-run-row button{background:var(--brand);color:#fff;border:0;padding:10px 20px}
.jp-run-row button:disabled{background:#c9d3d8;cursor:not-allowed}
.jp-balance{font-size:13px;color:var(--muted)}
.jp-result{margin-top:14px}
.jp-loading{padding:14px;background:#f2f8fa;border:1px solid #d9e9ec;border-radius:9px;color:#0c7480;font-size:13px}
.jp-warn{padding:14px;background:#fdf3f2;border:1px solid #f0d5d2;border-radius:9px;color:#a03a34;font-size:13px;line-height:1.7}
.jp-ok{padding:10px 14px;background:#eef8ef;border:1px solid #cfe6d1;border-radius:9px;color:#2b7043;font-size:13px}
.jp-out{display:grid;gap:12px}
.jp-out-row span{display:block;font-size:12px;color:var(--muted);margin-bottom:4px}
.jp-out-row>div,.jp-out-row ul{padding:11px 13px;background:#f7fafb;border:1px solid #e3ebee;border-radius:9px;font-size:14px;line-height:1.7;word-break:break-word}
.jp-out-row ul{margin:0;padding-left:28px}
.jp-out-row code{display:inline-block;margin:0 5px 5px 0;padding:3px 8px;background:#eef4f6;border-radius:6px;font-size:12px}
.jp-copy{cursor:pointer}
.jp-pending{padding:11px 13px;background:#fdf8ec;border:1px solid #ecdcb8;border-radius:9px;font-size:13px;color:#8a6318}
.jp-imgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.jp-imgs figure{margin:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.jp-imgs img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover}
.jp-imgs figcaption{padding:7px 10px;font-size:12px;color:var(--muted)}
.jp-meta{margin-top:10px;font-size:12px;color:var(--muted)}
.jp-img-preview{width:150px;height:150px;border:1px dashed #cdd8dd;border-radius:10px;display:grid;place-items:center;color:#9aa8b1;font-size:12px;overflow:hidden;background:#f7fafb}
.jp-img-preview img{width:100%;height:100%;object-fit:cover}
.jp-prev-name{font-size:11px;padding:2px 6px;text-align:center}
.jp-img-actions{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}
.jp-img-actions input[type=file]{font-size:12px}
@media(max-width:760px){.jp-model-row{grid-template-columns:1fr}.jp-run-row{flex-direction:column;align-items:stretch}.jp-run-row button{width:100%}}

/* ===== 精铺工作箱（状态流看板）===== */
.wb-tabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:12px;padding:4px;background:#eef3f5;border:1px solid #dce6ea;border-radius:10px}
.wb-tabs button{background:transparent;border:1px solid transparent;color:#5d707d;min-height:34px;padding:7px 14px;font-size:13px}
.wb-tabs button.active{background:#fff;color:var(--brand);border-color:#cfe3e5;box-shadow:0 2px 7px rgba(26,55,67,.08);font-weight:650}
.wb-filter{display:flex;gap:9px;margin-bottom:13px;flex-wrap:wrap}
.wb-filter select,.wb-filter input{min-height:38px}
.wb-filter input{flex:1;min-width:180px;max-width:320px}
.wb-filter button{background:var(--brand);color:#fff;border:0;padding:9px 18px}
.wb-filter button.ghost{background:#eef8f7;color:var(--brand);border:1px solid #cce9e6}
.wb-table{width:100%;border-collapse:collapse;font-size:13px}
.wb-table th{text-align:left;padding:9px 8px;color:#7a8a95;font-weight:600;font-size:12px;border-bottom:1px solid #e6edf0;white-space:nowrap}
.wb-table td{padding:12px 8px;border-bottom:1px solid #f0f4f6;vertical-align:middle}
.wb-table tr:hover td{background:#f9fbfc}
.wb-prod{display:flex;gap:12px;align-items:center;min-width:280px}
.wb-prod .collect-thumb{width:52px;height:52px;flex-basis:52px}
.wb-titles{display:grid;gap:2px;min-width:0}
.wb-titles b{font-size:13.5px;color:#20313d;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:360px}
.wb-titles i{font-style:normal;color:#5c7180;font-size:12.5px}
.wb-titles i.wb-dim{color:#a5b3bc}
.wb-titles small{color:#93a3ad;font-size:11.5px}
.wb-badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:11.5px;font-weight:650;background:#eef2f4;color:#71828c}
.wb-badge.wb-approved{background:#e8f4fb;color:#1f6f9e}
.wb-badge.wb-listed{background:#e5f6eb;color:#237345}
.wb-badge.wb-failed{background:#fdecea;color:#b3403a}
.wb-badge.wb-reviewing{background:#fdf6e7;color:#9a7524}
.wb-match{font-size:11px;color:#9aa8b1;margin-top:4px}
.wb-note{font-size:11px;color:#b3403a;margin-top:3px}
.wb-cat{color:#5d707d;font-size:12.5px}
.wb-ops{white-space:nowrap}
.wb-link{background:transparent;border:0;color:var(--brand);min-height:26px;padding:3px 7px;font-size:12.5px}
.wb-link:hover{text-decoration:underline;transform:none;box-shadow:none}
.wb-empty{text-align:center;color:#93a3ad;padding:26px 0!important}
.wb-pager{margin-top:12px;font-size:12.5px;color:var(--muted)}
.wb-mask{position:fixed;inset:0;background:rgba(12,22,30,.42);z-index:60}
.wb-panel{position:fixed;top:0;right:0;bottom:0;width:min(520px,94vw);background:#fff;z-index:61;box-shadow:-16px 0 44px rgba(12,30,40,.18);display:flex;flex-direction:column;animation:wbIn .22s ease-out}
@keyframes wbIn{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}
.wb-panel-head{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line)}
.wb-panel-body{padding:18px 20px;overflow:auto;display:grid;gap:12px}
.wb-dl{font-size:15px;font-weight:650;color:#20313d;line-height:1.5}
.wb-dr{font-size:13.5px;color:#33475a;line-height:1.6}
.wb-dim{color:#a5b3bc;font-size:12.5px}
.wb-meta{font-size:12px;color:var(--muted)}
.wb-gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:8px}
.wb-gal img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.wb-desc{font-size:12.5px;color:#5d707d;line-height:1.7;max-height:180px;overflow:auto;background:#f7fafb;border:1px solid #e3ebee;border-radius:9px;padding:11px}
.wb-actions{display:flex;gap:9px}
.wb-actions button{background:var(--brand-2);color:#08777e;border:1px solid #c9e9e5;padding:9px 16px}
@media(max-width:760px){.wb-cat,.wb-table th:nth-child(4){display:none}}

/* 自动生成方案区（可编辑 → 确认执行） */
.wb-plan{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.wb-plan-head{font-size:13px;font-weight:650;color:#33475a;margin-bottom:10px}
.wb-plan-row{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-top:10px}
.wb-plan-row label{font-size:12px;color:#637785;display:grid;gap:4px}
.wb-plan-row select{min-height:36px;min-width:130px}
.wb-plan-row button{background:var(--brand);color:#fff;border:0;padding:9px 16px}
.wb-plan-meta{font-size:12px;color:var(--muted);margin:6px 0;line-height:1.6}
.wb-warn-inline{color:#9a7524}
.wb-cks{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:6px;padding:10px 0}
.wb-ck{display:flex;gap:7px;align-items:center;font-size:12.5px;color:#3d4f5c}
.wb-ck input{width:15px;height:15px}
.wb-inline{align-self:center;margin-bottom:8px}
.wb-ta{display:grid;gap:5px;font-size:12px;color:#637785;margin-top:10px}
.wb-ta textarea{width:100%;font-size:12.5px;line-height:1.6;min-height:70px}
.wb-plan details{border:1px solid #e3ebee;border-radius:9px;padding:8px 12px;margin-top:10px;background:#f7fafb}
.wb-plan summary{cursor:pointer;font-size:12.5px;color:#33475a;font-weight:600}
.workflow-guide{margin-bottom:16px}.workflow-guide-head{display:flex;justify-content:space-between;align-items:flex-start}.workflow-guide-head h2{margin:5px 0 0}.workflow-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}.workflow-step{padding:12px;border:1px solid var(--line);border-radius:9px;background:#f8fbfc}.workflow-step b,.workflow-step span,.workflow-step small{display:block}.workflow-step b{font-size:11px;color:var(--brand)}.workflow-step span{margin-top:5px;font-weight:700}.workflow-step small{color:var(--muted);font-size:11px;margin-top:3px}.workflow-step.active{border-color:#9fd5d3;background:#f0fbfa}.workflow-tip{margin-top:12px;color:var(--muted);font-size:12px}.mode-help{display:flex;flex-direction:column;margin-left:auto;padding-left:12px}.mode-help strong{font-size:12px;color:var(--ink)}.mode-help span{font-size:11px;color:var(--muted);margin-top:3px}.missing-state{display:flex;gap:8px;align-items:center;margin:7px 0 10px;padding:9px 10px;border-radius:8px;background:#f5faf9;color:#3c6f70}.missing-state small,.missing-state b{display:block}.missing-state small{font-size:11px;margin-top:2px;color:var(--muted)}.missing-icon{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#d8f0ed;font-weight:700}.missing-state.warning{background:#fff8e8;color:#8a6421}.missing-state.warning .missing-icon{background:#ffe3a6}@media(max-width:640px){.workflow-steps{grid-template-columns:1fr}.mode-help{width:100%;margin:8px 0 0;padding:8px 0 0;border-top:1px solid var(--line)}}
.opportunity-panel{margin:16px 0}.opportunity-head{display:flex;justify-content:space-between;align-items:flex-start}.opportunity-head h2{margin:5px 0 3px}.opportunity-head p{margin:0;color:var(--muted);font-size:12px}.opportunity-grade{display:flex;flex-direction:column;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:#e9f8f2;border:1px solid #b9e1d5;color:#17736b}.opportunity-grade b{font-size:25px;line-height:1}.opportunity-grade span{font-size:10px;margin-top:3px}.opportunity-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:16px}.score-card{padding:11px;border:1px solid var(--line);border-radius:9px;background:#fbfdfd}.score-card span,.score-card small{display:block}.score-card span{font-size:11px;color:var(--muted)}.score-card strong{display:inline-block;margin:7px 0 2px;font-size:23px;color:var(--ink)}.score-card small{font-size:10px;min-height:28px;color:var(--muted)}.score-bar{height:4px;background:#e8eff0;border-radius:4px;overflow:hidden}.score-bar i{display:block;height:100%;background:#43a89b;border-radius:4px}.score-risk .score-bar i{background:#d7a34c}.opportunity-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:15px;padding-top:13px;border-top:1px solid var(--line)}.opportunity-tags{display:flex;gap:7px;flex-wrap:wrap}.opportunity-tags span{padding:6px 8px;border-radius:6px;background:#f1f8f7;color:#477778;font-size:11px}.opportunity-fields{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:12px;color:var(--muted);font-size:11px}.opportunity-fields button{border:1px dashed #bfd1d2;background:#fff;border-radius:6px;color:#668486;padding:5px 8px;font-size:10px}.opportunity-fields button.selected{border-style:solid;border-color:#8fc8bd;background:#eaf8f3;color:#28766d}@media(max-width:760px){.opportunity-grid{grid-template-columns:repeat(2,1fr)}.opportunity-bottom{align-items:flex-start;flex-direction:column}}@media(max-width:480px){.opportunity-grid{grid-template-columns:1fr 1fr}.opportunity-grade{width:52px;height:52px}.opportunity-grade b{font-size:20px}}
#studio:not(.workflow-expert) #stModel,#studio:not(.workflow-expert) #stPrompt,#studio:not(.workflow-expert) #stDims,#studio:not(.workflow-expert) #stCategory{opacity:.72}#studio:not(.workflow-expert) #stModel,#studio:not(.workflow-expert) #stPrompt{pointer-events:none}#studio:not(.workflow-expert) #stPrompt{height:54px;overflow:hidden}#studio:not(.workflow-expert) #stGenerateSet{display:none}.studio-empty-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.privacy-mode img{filter:blur(14px)}
.privacy-mode .store-row b,.privacy-mode .store-row .muted,.privacy-mode .wb-panel-body{color:transparent;text-shadow:0 0 8px rgba(20,50,55,.85);user-select:none}
.self-check-card{margin-top:16px}.self-check-result{display:grid;gap:7px;margin-top:12px}.self-check-item{display:flex;align-items:center;gap:8px;font-size:13px}.self-check-item b{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#e8f7ed;color:#21723e}.self-check-item.bad b{background:#fff0f0;color:#b33}.self-check-item span{margin-left:auto;color:var(--muted);font-size:12px}

/* ============================================================
   精铺设置卡分区视觉（2026-10-09老张反馈「设计不太合适视觉」）
   根因：原 HTML 把4 个表单控件平铺在一张卡里，纯勾选项和数字输入框
         视觉权重完全一致，且 label{display:block} 让 checkbox 顶行首、
         小到点不中、基线与文字不齐；生成模式卡片刚露头就被裁。
   改法：拆成三个语义分区（成本参数 / 生成内容 / 生成模式），
         勾选项升级为整行可点的大号卡片，勾选框 20px 并与首行文字基线对齐。
   ============================================================ */
#studioPanel .card h2{margin-bottom:2px}
.set-block{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.set-block:first-of-type{margin-top:12px;border-top:0;padding-top:0}
.set-block-head{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-bottom:11px;
  font-size:13px;font-weight:700;color:var(--ink);letter-spacing:.01em}
.set-block-head:before{content:"";width:3px;height:13px;border-radius:2px;background:var(--brand);flex:none}
.set-block-head .muted{font-weight:400;font-size:11.5px;letter-spacing:0}
/* 成本参数：两列，窄屏塌一列 */
.set-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px}
.set-field{display:grid;gap:5px;margin:0;font-size:12.5px;color:#5c6d78}
.set-field input,.set-field select{width:100%;min-height:38px;font-size:14px}
/* 生成内容：整行可点，勾选框加大到20px，文字与勾选框首行基线对齐 */
.set-checks{display:grid;gap:9px}
.set-check{display:flex;align-items:flex-start;gap:11px;margin:0;padding:11px 13px;cursor:pointer;
  border:1px solid var(--line);border-radius:9px;background:#fbfdfd;transition:border-color .14s,background .14s}
.set-check:hover{border-color:#a8d5d2;background:#f5fbfb}
.set-check input[type=checkbox]{flex:none;width:20px;height:20px;margin:1px 0 0;cursor:pointer;
  accent-color:var(--brand);position:static}
.set-check-body{display:block;min-width:0}
.set-check-body b{display:block;font-size:14px;font-weight:650;color:var(--ink);line-height:1.35}
.set-check-body i{display:block;margin-top:3px;font-style:normal;font-size:11.5px;color:var(--muted);line-height:1.45}
.set-check:has(input:checked){border-color:#9fd5d3;background:#f2fbfa}
.set-check:has(input:checked) .set-check-body b{color:var(--brand)}
/* :has() 不支持时的 JS 兜底（app.js syncChecks 会打.on） */
.set-check.on{border-color:#9fd5d3;background:#f2fbfa}
.set-check.on .set-check-body b{color:var(--brand)}
/* 生成模式：标题降级为分区标题样式，不再是游离的 span */
.gen-mode-field{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.gen-mode-field .gen-mode-label{display:none}
.gen-mode-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.gen-mode-card{min-height:96px;padding:13px 14px}
.gen-mode-card strong{font-size:15px}
.gen-mode-card span{font-size:12px;line-height:1.55}
.gen-mode-card em{font-size:13px;margin-top:auto;padding-top:6px}
.set-hint{margin:9px 0 0;font-size:12px;line-height:1.55}
@media(max-width:760px){.set-grid2{grid-template-columns:1fr}.gen-mode-cards{grid-template-columns:1fr}}
@media(max-width:480px){.set-block-head{gap:6px}.set-block-head .muted{font-size:11px}}

/* ============================================================
   2026-10-09 精铺中心「左侧子菜单 → 右侧独立视图」
   老张反馈：点精铺下拉里的每个选项，右边还是同一个长页面，
   要滚动才能看到对应内容。现在改成 5 个互斥视图，同一时刻只显示一个。
   ============================================================ */
/* 关键：hidden 属性必须真的生效。
   .card / .grid 等规则里若写了 display，会盖掉浏览器默认的 [hidden]{display:none}，
   于是「隐藏的视图照样占位」——右侧依旧是一长条，必须显式兜住。 */
.studio-view[hidden]{display:none!important}
.studio-view{min-width:0}
/* 视图标题条：老张一眼看到「现在在第几步、这一步要干什么」 */
.studio-view-bar{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:0 0 14px;padding:10px 14px;border:1px solid var(--line,#e4ecef);border-left:3px solid var(--brand,#0f8a91);border-radius:10px;background:#f7fbfb}
.studio-view-bar b{font-size:15px;color:#12333a}
.studio-view-bar span{font-size:13px;color:#6b8792}
/* 左侧子菜单高亮：当前所在视图必须一眼可见，
   否则点完右边变了、左边还是全灰的，等于没有联动反馈。 */
.studio-nav-group .nav-sub button.active{background:linear-gradient(90deg,rgba(15,138,145,.28),rgba(15,138,145,.06));color:#e9ffff;font-weight:700;box-shadow:inset 2px 0 0 var(--brand,#0f8a91)}
.studio-nav-group .nav-sub button.active span{color:#7fdcd9}
.studio-nav-group .nav-sub button.active:hover{background:linear-gradient(90deg,rgba(15,138,145,.34),rgba(15,138,145,.08))}
@media(max-width:760px){
  .studio-view-bar{gap:6px;padding:9px 12px}
  .studio-view-bar b{font-size:14px}
  .studio-view-bar span{font-size:12px}
}

/* 注入型引导块（workflow.js / interactions.js 插在 #studio 顶层）的显隐兜底，
   与 .studio-view[hidden] 同理：显式 display:none，否则 hidden 属性会被 display 规则盖掉。 */
#studio [data-studio-view][hidden]{display:none!important}

/* ============================================================
   2026-10-09 修：.main 被垂直居中，导致内容少的页面整块浮在屏幕中间
   根因：styles.css 的 .main{margin:auto}。.main 是 .layout(grid) 的子项，
   grid 里 margin:auto 会把这一格的内容在格内上下左右居中。
   以前精铺是一个超长页面（内容 > 视口），撑满了格子看不出来；
   拆成 5 个独立视图后，内容一短就立刻暴露：切到「任务进度」时
   整个右半屏被顶到 341px 处，标题条在首屏中间 —— 观感就是"页面飘了"。
   修法：.layout 里内容按常规 start 对齐，.main 自身的 margin 只保留 0。
   ============================================================ */
.layout{align-items:start}
.main{margin:0;max-width:none}

/* 2026-10-09：390px 窄屏下图片卡的「设为副图」按钮顶出屏幕 4px。
   .studio-img-ops 是两按钮并排 flex，窄屏卡片内宽不够时按钮被挤出去。
   修法：窄屏让 ops 换行铺满，按钮 flex:1 各自占一半。 */
@media(max-width:480px){
  .studio-img-ops{flex-wrap:wrap}
  .studio-img-ops .mini{flex:1 1 calc(50% - 3px);min-width:0;padding:4px 4px;font-size:11px}
  .studio-view-bar b{font-size:13px}
}