/* ==========================================================================
   牛魔王 · AI 影像工坊
   视觉沿用主站（3020）的深色语言：深海军蓝底 + 红金主色 + 细描边玻璃面板
   ========================================================================== */

:root{
  --bg:#070b14; --bg2:#0b1120;
  --panel:rgba(255,255,255,.045); --panel2:rgba(255,255,255,.07); --panel3:rgba(255,255,255,.10);
  --line:rgba(255,255,255,.09); --line2:rgba(255,255,255,.16);
  --txt:#e9eef8; --muted:#93a0ba; --dim:#66748f;
  --red:#ff5140; --red2:#e6362a; --gold:#f3c169; --blue:#5b93ff; --green:#37d39a;
  --radius:18px; --radius-s:12px;
  --shadow:0 20px 60px rgba(0,0,0,.45);
  --nav-h:64px; --side-w:236px;
}

*{margin:0;padding:0;box-sizing:border-box}
/* 自定义 display 的类（如 .btn / .batch-box）会盖掉浏览器默认的 [hidden]，这里显式兜底 */
[hidden]{display:none!important}
html{scroll-behavior:auto}
body{
  font-family:"PingFang SC","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  background:var(--bg); color:var(--txt); line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,textarea,select{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
::selection{background:rgba(255,81,64,.35)}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:6px}
::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.24)}
::-webkit-scrollbar-track{background:transparent}
code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.92em;color:var(--gold)}
.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px}

/* ---------------- 背景 ---------------- */
.bg-fx{position:fixed;inset:0;z-index:-2;overflow:hidden;transform:translateZ(0);will-change:transform;contain:paint;background:
  radial-gradient(1100px 600px at 78% -8%,rgba(255,81,64,.14),transparent 60%),
  radial-gradient(900px 600px at 8% 12%,rgba(91,147,255,.10),transparent 62%),
  radial-gradient(1000px 700px at 50% 108%,rgba(243,193,105,.07),transparent 60%),
  linear-gradient(180deg,var(--bg),var(--bg2) 60%,var(--bg));}
.bg-fx::after{content:"";position:absolute;inset:0;opacity:.18;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:64px 64px;}

/* ---------------- 顶部导航 ---------------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;height:var(--nav-h);
  background:#080d18;border-bottom:1px solid var(--line)}
.nav-in{height:100%;display:flex;align-items:center;gap:26px;padding:0 22px}
.brand{display:flex;align-items:center;gap:9px;flex-shrink:0}
.brand .mark{height:34px;width:auto;filter:drop-shadow(0 4px 14px rgba(255,81,64,.35))}
.brand .text{height:22px;width:auto}
.brand .sub{font-size:11px;color:var(--gold);letter-spacing:1.5px;border-left:1px solid var(--line2);
  padding-left:9px;line-height:1.3}
.menu{display:flex;gap:4px}
.menu a{padding:8px 14px;border-radius:10px;font-size:14.5px;color:var(--muted);transition:.2s}
.menu a:hover{color:#fff;background:var(--panel2)}
.menu a.on{color:#fff;background:var(--panel2);box-shadow:inset 0 0 0 1px var(--line2)}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:12px;position:relative}
/* 会员登录态 */
.member{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted)}
.member .mb-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px rgba(55,211,154,.16)}
.member .mb-name{color:var(--txt);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.member .mb-pts{font-size:11.5px;color:var(--gold);background:rgba(212,175,55,.12);border:1px solid rgba(212,175,55,.26);border-radius:999px;padding:2px 8px;white-space:nowrap}
.member .mb-pts i{font-style:normal;font-size:10.5px;opacity:.72;margin-left:6px;padding-left:6px;border-left:1px solid rgba(212,175,55,.3)}
.mb-login{border:1px solid var(--line2);border-radius:999px;padding:5px 15px;font-size:12.5px;color:var(--txt);background:var(--panel2)}
.mb-login:hover{border-color:var(--red);color:#fff}
.gate{display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:13px 16px;border:1px solid rgba(243,193,105,.28);border-radius:var(--radius-s);background:rgba(243,193,105,.07)}
.gate[hidden]{display:none}
.gate .g-ic{flex:0 0 34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(243,193,105,.14);color:var(--gold)}
.gate .g-tx{flex:1;min-width:0}
.gate .g-tx b{display:block;font-size:14px;font-weight:500;color:var(--txt)}
.gate .g-tx span{font-size:12px;color:var(--muted)}
.gate .btn{padding:9px 18px;font-size:13px;white-space:nowrap}
.svc{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);
  padding:7px 13px;border:1px solid var(--line);border-radius:999px;background:var(--panel)}
.svc i{width:7px;height:7px;border-radius:50%;background:var(--dim);box-shadow:0 0 0 3px rgba(102,116,143,.16)}
.svc.ok i{background:var(--green);box-shadow:0 0 0 3px rgba(55,211,154,.18);animation:pulse 2.4s infinite}
.svc.bad i{background:var(--red);box-shadow:0 0 0 3px rgba(255,81,64,.18)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.icon-btn{width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:var(--panel);
  display:grid;place-items:center;color:var(--muted);transition:.2s}
.icon-btn svg{width:17px;height:17px}
.icon-btn:hover{color:#fff;background:var(--panel2);border-color:var(--line2)}
/* 联系客服：跳主站首页 ?cs=1（主站会自动展开客服二维码浮层） */
.top-contact{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:10px;
  border:1px solid var(--line);background:var(--panel);color:var(--muted);font-size:12.5px;
  text-decoration:none;white-space:nowrap;transition:.2s}
.top-contact svg{width:15px;height:15px;flex:none}
.top-contact:hover{color:var(--gold);border-color:rgba(243,193,105,.55);background:rgba(243,193,105,.08)}

/* ---------------- 布局 ---------------- */
.app{display:flex;padding-top:var(--nav-h);min-height:100vh}

/* 左侧栏 */
.side{width:var(--side-w);flex-shrink:0;position:sticky;top:var(--nav-h);height:calc(100vh - var(--nav-h));
  display:flex;flex-direction:column;border-right:1px solid var(--line);background:#0a0f1c}
.side-scroll{flex:1;overflow-y:auto;padding:14px 10px 8px}
.side-group{margin-bottom:16px}
.side-t{font-size:11px;letter-spacing:2px;color:var(--dim);padding:6px 10px;text-transform:uppercase}
.side-i{display:flex;align-items:center;gap:9px;padding:8.5px 10px;border-radius:10px;font-size:14px;
  color:var(--muted);transition:.18s;position:relative;line-height:1.35}
.side-i .si{width:14px;text-align:center;font-size:12px;color:var(--dim);flex-shrink:0}
.side-i em{margin-left:auto;font-style:normal;font-size:11px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100px}
.side-i:hover{background:var(--panel2);color:#fff}
.side-i.on{background:linear-gradient(90deg,rgba(255,81,64,.20),rgba(255,81,64,.05));color:#fff}
.side-i.on::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:3px;
  background:linear-gradient(180deg,var(--red),var(--red2))}
.side-i .badge{margin-left:auto;min-width:18px;height:18px;padding:0 5px;border-radius:999px;font-size:11px;
  display:grid;place-items:center;background:rgba(255,81,64,.18);color:var(--red);font-weight:600}
.side-i .badge.hide{display:none}
.dot-red,.dot-blue,.dot-gold,.dot-green{width:6px;height:6px;border-radius:50%;margin:0 4px}
.dot-red{background:var(--red)}.dot-blue{background:var(--blue)}
.dot-gold{background:var(--gold)}.dot-green{background:var(--green)}
.side-foot{border-top:1px solid var(--line);padding:12px 16px 18px;display:flex;gap:18px;font-size:12px;color:var(--dim)}
.sf-line{display:flex;flex-direction:column;gap:2px}
.sf-line b{font-size:15px;color:var(--txt)}

/* 主区域 */
.main{flex:1;min-width:0;padding:20px 22px 40px}
.view{display:none;animation:fadeUp .35s ease}
.view.on{display:block}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------------- 快捷模式卡 ---------------- */
.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}
/* v42：智能多图 / 批量模式暂时下线（只留图片、视频），快捷卡改成两列，不留大空洞 */
.quick.quick-2{grid-template-columns:repeat(2,minmax(0,1fr))}
/* v42：暂时隐藏的模式入口（快捷卡 / 页签 / 侧边栏），保留 DOM 方便随时恢复 */
.mode-off{display:none!important}
.q{display:flex;align-items:center;gap:11px;padding:13px 14px;border-radius:var(--radius-s);
  border:1px solid var(--line);background:var(--panel);text-align:left;transition:.22s;position:relative;overflow:hidden}
.q:hover{background:var(--panel2);border-color:var(--line2);transform:translateY(-2px)}
.q.on{border-color:rgba(255,81,64,.45);background:linear-gradient(135deg,rgba(255,81,64,.14),rgba(255,255,255,.03))}
.q.on::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 24px rgba(255,81,64,.12)}
.q-ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-size:15px;font-weight:700;flex-shrink:0}
.ic-red{background:rgba(255,81,64,.16);color:var(--red)}
.ic-blue{background:rgba(91,147,255,.16);color:var(--blue)}
.ic-gold{background:rgba(243,193,105,.16);color:var(--gold)}
.ic-green{background:rgba(55,211,154,.16);color:var(--green)}
.q-tx{display:flex;flex-direction:column;min-width:0}
.q-tx b{font-size:14px}
.q-tx em{font-style:normal;font-size:11.5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.q-ar{margin-left:auto;color:var(--dim);font-size:17px}
.q.on .q-ar{color:var(--red)}

/* ---------------- 面板 ---------------- */
.panel{border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,var(--panel),rgba(255,255,255,.02));}
.studio{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:16px;align-items:start}
.studio-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.studio-side{display:flex;flex-direction:column;gap:16px;position:sticky;top:calc(var(--nav-h) + 16px)}

/* ---------------- 生成面板 ---------------- */
.gen{padding:16px 18px 14px}
.gen-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.mode-tabs{display:flex;gap:4px;padding:3px;border-radius:11px;background:rgba(0,0,0,.28);border:1px solid var(--line)}
.mt{padding:6px 14px;border-radius:8px;font-size:13.5px;color:var(--muted);transition:.18s}
.mt:hover{color:#fff}
.mt.on{background:linear-gradient(135deg,var(--red),var(--red2));color:#fff;font-weight:600;
  box-shadow:0 6px 18px rgba(230,54,42,.3)}
.model-chip{margin-left:auto;font-size:12px;color:var(--gold);border:1px solid rgba(243,193,105,.28);
  background:rgba(243,193,105,.08);padding:5px 11px;border-radius:999px}

.pb{border:1px solid var(--line);border-radius:14px;background:rgba(0,0,0,.22);padding:12px 13px;transition:.2s}
.pb:focus-within{border-color:rgba(255,81,64,.4);box-shadow:0 0 0 3px rgba(255,81,64,.08)}
.pb-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.pb-head label{font-size:13px;color:var(--muted);font-weight:600;display:flex;align-items:center;gap:6px}
.pb-head .req{color:var(--red)}
.pb-head i{font-style:normal;font-size:11.5px;color:var(--dim);font-weight:400}
.pb-tools{margin-left:auto;display:flex;gap:2px}
.txt-btn{font-size:12.5px;color:var(--muted);padding:4px 8px;border-radius:7px;transition:.18s;white-space:nowrap}
.txt-btn:hover{color:#fff;background:var(--panel2)}
#prompt,#batchPrompts{width:100%;background:transparent;border:0;resize:vertical;outline:none;
  font-size:14.5px;line-height:1.7;color:var(--txt);min-height:96px}
#prompt::placeholder,#batchPrompts::placeholder{color:#4d5a72}
.pb-foot{display:flex;align-items:center;gap:10px;margin-top:6px}
.counter{font-size:11.5px;color:var(--dim);margin-left:auto;flex-shrink:0}
.counter b{color:var(--muted);font-weight:500}

.chips{display:flex;gap:6px;flex-wrap:wrap}
.chips.scroll-x{flex-wrap:nowrap;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.chips.scroll-x::-webkit-scrollbar{display:none}
.chip{font-size:12px;padding:4.5px 10px;border-radius:999px;border:1px solid var(--line);color:var(--muted);
  background:var(--panel);transition:.18s;white-space:nowrap;flex-shrink:0}
.chip:hover{color:#fff;border-color:var(--line2)}
.chip.on{background:rgba(255,81,64,.16);border-color:rgba(255,81,64,.45);color:#ffb3a9}

/* 批量 */
.batch-box{border:1px solid var(--line);border-radius:14px;background:rgba(0,0,0,.22);padding:12px 13px;margin-top:12px}
.bb-head{display:flex;align-items:center;margin-bottom:4px}
.bb-head label{font-size:13px;color:var(--muted);font-weight:600;display:flex;gap:7px;align-items:center}
.bb-head i{font-style:normal;font-size:11.5px;color:var(--dim);font-weight:400}
#batchPrompts{min-height:84px}

/* 上传 */
.up-row{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.up{width:132px;height:100px;border-radius:12px;border:1px dashed var(--line2);background:rgba(255,255,255,.02);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;transition:.2s;flex-shrink:0}
.up:hover,.up.hot{border-color:rgba(255,81,64,.5);background:rgba(255,81,64,.06)}
.up-ic svg{width:20px;height:20px;color:var(--muted)}
.up-t{font-size:12.5px;color:var(--txt)}
.up-s{font-size:10.5px;color:var(--dim)}
.thumbs{display:flex;gap:10px;flex-wrap:wrap}
.thumb{width:100px;height:100px;border-radius:12px;overflow:hidden;position:relative;border:1px solid var(--line2);background:#0d1220}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb .del{position:absolute;top:3px;right:3px;width:19px;height:19px;border-radius:50%;
  background:rgba(0,0,0,.65);color:#fff;font-size:12px;display:grid;place-items:center;}
.thumb .del:hover{background:var(--red2)}

/* 参数 */
.opts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 14px;margin-top:14px}
.opt{min-width:0}
.opt.span2{grid-column:span 2}
.opt.wide{grid-column:1/-1}
.opt-l{font-size:12px;color:var(--dim);margin-bottom:6px}
.seg{display:flex;gap:4px;flex-wrap:wrap}
.seg button{padding:6px 11px;border-radius:8px;border:1px solid var(--line);background:var(--panel);
  font-size:12.5px;color:var(--muted);transition:.16s}
.seg button:hover{color:#fff;border-color:var(--line2)}
.seg button.on{background:rgba(255,81,64,.16);border-color:rgba(255,81,64,.42);color:#fff;font-weight:600}
.inp{width:100%;padding:7px 11px;border-radius:9px;border:1px solid var(--line);background:rgba(0,0,0,.25);
  font-size:13px;outline:none}
.inp:focus{border-color:rgba(255,81,64,.4)}

.switch{display:flex;align-items:center;gap:9px;cursor:pointer;font-size:13px;color:var(--muted)}
.switch input{display:none}
.switch i{width:34px;height:19px;border-radius:999px;background:rgba(255,255,255,.12);position:relative;
  transition:.2s;flex-shrink:0}
.switch i::after{content:"";position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;
  background:#fff;transition:.2s}
.switch input:checked + i{background:linear-gradient(135deg,var(--red),var(--red2))}
.switch input:checked + i::after{transform:translateX(15px)}
.switch em{font-style:normal;display:block;font-size:11px;color:var(--dim);line-height:1.4}
.switch.sm{font-size:12.5px}

.gen-foot{display:flex;align-items:center;gap:14px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.gen-foot .btn{margin-left:auto}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:14.5px;font-weight:600;
  padding:11px 24px;border-radius:12px;transition:transform .18s,box-shadow .22s,background .22s,border-color .22s}
.btn:active{transform:translateY(1px)}
.btn-p{background:linear-gradient(135deg,var(--red),var(--red2));color:#fff;box-shadow:0 10px 28px rgba(230,54,42,.32)}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 16px 38px rgba(230,54,42,.45)}
.btn-p:disabled{opacity:.55;pointer-events:none;box-shadow:none}
.btn-g{background:var(--panel);color:var(--txt);border:1px solid var(--line2)}
.btn-g:hover{background:var(--panel2);border-color:rgba(255,255,255,.3)}
.btn-s{padding:8px 16px;font-size:13px;border-radius:10px}
.legal{font-size:11px;color:var(--dim);margin-top:10px;line-height:1.55}

/* ---------------- 结果 / 任务卡 ---------------- */
.results{padding:14px 16px 18px}
.res-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.res-tabs{display:flex;gap:2px}
.rt{font-size:13px;color:var(--muted);padding:6px 12px;border-radius:8px;transition:.18s}
.rt:hover{color:#fff}
.rt.on{background:var(--panel3);color:#fff;font-weight:600}
.res-tools{margin-left:auto;display:flex;align-items:center;gap:12px}
.auto{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--dim);cursor:pointer}
.auto input{display:none}
.auto i{width:15px;height:15px;border-radius:4px;border:1px solid var(--line2);display:grid;place-items:center}
.auto input:checked + i{background:var(--red);border-color:var(--red)}
.auto input:checked + i::after{content:"";width:8px;height:4px;border-left:2px solid #fff;border-bottom:2px solid #fff;
  transform:rotate(-45deg) translate(1px,-1px)}

.jobs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.jobs-wide{grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.empty{grid-column:1/-1;padding:36px 0;text-align:center;color:var(--dim);font-size:13px}
/* v37：首轮加载态 —— 一个轻量转圈，避免"正在加载任务…"看着像卡死 */
.empty .spin{display:inline-block;width:12px;height:12px;margin-right:7px;vertical-align:-2px;
  border:2px solid rgba(255,255,255,.18);border-top-color:var(--gold,#f3c169);border-radius:50%;
  animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){.empty .spin{animation-duration:2.4s}}

.job{border:1px solid var(--line);border-radius:14px;background:rgba(0,0,0,.2);padding:11px;display:flex;
  flex-direction:column;gap:9px;transition:.2s;position:relative;overflow:hidden}
.job:hover{border-color:var(--line2)}
.job.running{border-color:rgba(91,147,255,.35)}
.job.succeeded{border-color:rgba(55,211,154,.24)}
.job.failed{border-color:rgba(255,81,64,.28)}
.jh{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--dim)}
.st-dot{width:7px;height:7px;border-radius:50%;background:var(--dim);flex-shrink:0}
.st-dot.running{background:var(--blue);animation:pulse 1.6s infinite}
.st-dot.queued{background:var(--gold)}
.st-dot.succeeded{background:var(--green)}
.st-dot.failed,.st-dot.canceled{background:var(--red)}
.jh b{color:var(--muted);font-weight:500;font-family:ui-monospace,Consolas,monospace;font-size:11px}
.jh .jtype{color:var(--dim)}
.jh .jtime{margin-left:auto}
.jname{font-size:12px;color:var(--muted);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
.jmedia{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.jmedia.single{grid-template-columns:1fr}
.jm{position:relative;border-radius:10px;overflow:hidden;background:#0d1220;aspect-ratio:1/1;border:1px solid var(--line);cursor:pointer}
/* v45：单张预览别铺满整卡（一张图占掉半屏，一屏看不了几个任务）；
   宽幅 16/10 且最高 260px，点开才是原图大图 */
.jmedia.single .jm{aspect-ratio:16/10;max-height:260px}
.jm.wide{aspect-ratio:16/9}
.jm img,.jm video{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.jm .play{position:absolute;inset:0;display:grid;place-items:center;color:#fff;background:rgba(0,0,0,.25);font-size:22px;pointer-events:none}
.jm .hvr{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.7),transparent 60%);opacity:0;transition:.2s;
  display:flex;align-items:flex-end;justify-content:center;gap:6px;padding:7px}
.jm:hover .hvr{opacity:1}
.jm .hvr button{font-size:11px;padding:4px 8px;border-radius:6px;background:rgba(255,255,255,.16);
  color:#fff;white-space:nowrap}
.jm .hvr button:hover{background:var(--red2)}
.verr{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);background:rgba(230,54,42,.92);
  color:#fff;font-size:12px;padding:7px 12px;border-radius:8px;white-space:nowrap}
.jskel{border-radius:10px;background:linear-gradient(100deg,rgba(255,255,255,.04) 30%,rgba(255,255,255,.09) 50%,rgba(255,255,255,.04) 70%);
  background-size:220% 100%;animation:shimmer 1.4s infinite;aspect-ratio:1/1}
@keyframes shimmer{from{background-position:120% 0}to{background-position:-40% 0}}
.jprog{display:flex;flex-direction:column;gap:6px}
.jbar{height:6px;border-radius:4px;background:rgba(255,255,255,.08);overflow:hidden}
.jbar i{display:block;height:100%;width:0;border-radius:4px;position:relative;overflow:hidden;
  background:linear-gradient(90deg,var(--red),var(--gold));transition:width .9s ease}
.jbar i::after{content:'';position:absolute;top:0;bottom:0;width:70px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);
  animation:glide 1.8s infinite linear}
@keyframes glide{from{transform:translateX(-80px)}to{transform:translateX(400px)}}
.jmsg{font-size:11.5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jmsg .jpct{color:var(--gold);font-weight:600;font-size:13px;margin-right:8px}
.jmsg .jwait{font-size:11px}
/* v33：排队中的卡片不放进度条，避免「50%」被当成快好了 */
.jprog.queued{padding:2px 0}
.jprog.queued .jwait{color:var(--dim);font-size:11.5px;white-space:normal;line-height:1.5}
.jerr{font-size:11.5px;color:#ff9d92;background:rgba(255,81,64,.08);border:1px solid rgba(255,81,64,.2);
  border-radius:8px;padding:6px 8px;line-height:1.5}
.jerr b{color:#ff7c6d}
.jf{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--dim)}
.jf .sp{margin-left:auto}
.jf button{color:var(--muted);font-size:11.5px;padding:3px 8px;border-radius:7px;border:1px solid var(--line)}
.jf button:hover{color:#fff;border-color:var(--line2);background:var(--panel2)}
.jf button.danger:hover{color:#fff;background:rgba(255,81,64,.22);border-color:rgba(255,81,64,.4)}

/* ---------------- 右侧状态 ---------------- */
.stat{padding:14px 16px}
.stat-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.stat-head b{font-size:14px}
.tagline{font-size:11px;color:var(--gold)}
.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.st{background:rgba(0,0,0,.22);border:1px solid var(--line);border-radius:10px;padding:8px 10px;display:flex;
  flex-direction:column;gap:1px}
.st span{font-size:11px;color:var(--dim)}
.st b{font-size:19px;line-height:1.2}
.st b.ok{color:var(--green)}.st b.bad{color:var(--red)}
.stat-rows{margin-top:12px;display:flex;flex-direction:column;gap:7px;border-top:1px solid var(--line);padding-top:10px}
.srow{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--dim)}
.srow b{margin-left:auto;color:var(--muted);font-weight:500;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tip{padding:14px 16px}
.tip h4{font-size:13px;margin-bottom:8px;color:var(--gold)}
.tip ul{list-style:none;display:flex;flex-direction:column;gap:7px}
.tip li{font-size:11.5px;color:var(--muted);line-height:1.65;padding-left:12px;position:relative}
.tip li::before{content:"";position:absolute;left:0;top:7px;width:4px;height:4px;border-radius:50%;background:var(--dim)}
.tip b{color:var(--txt)}

/* ---------------- 区块头 / 灵感库 ---------------- */
.sec-head{display:flex;align-items:flex-end;gap:20px;margin-bottom:16px;flex-wrap:wrap}
.kicker{font-size:11.5px;letter-spacing:3px;color:var(--gold);text-transform:uppercase;font-weight:600;margin-bottom:6px}
.sec-t{font-size:24px;line-height:1.3;letter-spacing:-.4px}
.sec-d{font-size:13px;color:var(--muted);margin-top:6px;max-width:720px}
.search{margin-left:auto;display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:12px;
  border:1px solid var(--line);background:var(--panel);min-width:270px}
.search svg{width:16px;height:16px;color:var(--dim);flex-shrink:0}
.search input{background:none;border:0;outline:none;font-size:13.5px;width:100%}
.search input::placeholder{color:#4d5a72}
.tab-chips{margin-bottom:16px}
.masonry{column-count:4;column-gap:12px}
@media(max-width:1500px){.masonry{column-count:3}}
@media(max-width:1150px){.masonry{column-count:2}}
.ic-card{break-inside:avoid;margin-bottom:12px;border-radius:14px;overflow:hidden;border:1px solid var(--line);
  background:rgba(0,0,0,.25);position:relative;transition:.25s}
.ic-card:hover{transform:translateY(-3px);border-color:rgba(255,81,64,.35);box-shadow:0 16px 40px rgba(0,0,0,.5)}
.ic-media{position:relative;background:#0d1220;overflow:hidden}
.ic-media img,.ic-media video{width:100%;display:block;transition:transform .5s}
.ic-card:hover .ic-media img,.ic-card:hover .ic-media video{transform:scale(1.04)}
.ic-media::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,9,16,.86),transparent 55%)}
.ic-info{position:absolute;left:0;right:0;bottom:0;padding:9px 11px;z-index:2;display:flex;align-items:center;gap:8px}
.ic-info b{font-size:13px;font-weight:600;text-shadow:0 1px 8px rgba(0,0,0,.8)}
.ic-info .hot{margin-left:auto;font-size:11px;color:var(--muted);display:flex;align-items:center;gap:3px}
.ic-tags{position:absolute;top:9px;left:10px;display:flex;gap:5px;z-index:2}
.ic-tag{font-size:10.5px;padding:2.5px 7px;border-radius:999px;background:rgba(7,11,20,.7);
  color:var(--muted);border:1px solid var(--line)}
.ic-tag.gold{color:var(--gold);border-color:rgba(243,193,105,.3)}
.ic-hover{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;
  opacity:0;transition:.22s;background:rgba(6,9,16,.42)}
.ic-card:hover .ic-hover{opacity:1}
.ic-hover button{padding:8px 16px;border-radius:10px;font-size:13px;font-weight:600;
  background:linear-gradient(135deg,var(--red),var(--red2));color:#fff;box-shadow:0 10px 26px rgba(230,54,42,.4)}
.ic-play{position:absolute;inset:0;display:grid;place-items:center;z-index:2;pointer-events:none}
.ic-play span{width:44px;height:44px;border-radius:50%;background:rgba(7,11,20,.6);border:1px solid rgba(255,255,255,.3);
  display:grid;place-items:center;color:#fff;font-size:14px;}

/* ---------------- 作品库 ---------------- */
.lib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.lib{position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:#0d1220}
.lib img,.lib video{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.lib .lm{padding:9px 10px}
.lib .lm b{display:block;font-size:12px;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lib .lm span{font-size:10.5px;color:var(--dim)}
.lib .del{position:absolute;top:7px;right:7px;width:24px;height:24px;border-radius:50%;
  background:rgba(7,11,20,.7);color:#fff;display:grid;place-items:center;font-size:13px;}
.lib .del:hover{background:var(--red2)}

/* ---------------- 会员下拉 / 退出登录 ---------------- */
.member .mb-name[data-mbmenu]{cursor:pointer;display:inline-flex;align-items:center;gap:5px}
.member .mb-name[data-mbmenu]:hover{color:var(--gold)}
.mb-caret{font-style:normal;font-size:9px;opacity:.65;transition:transform .15s}
.mb-menu-open .mb-caret{transform:rotate(180deg)}
.mb-menu{position:absolute;right:44px;top:calc(100% + 8px);width:200px;padding:6px;
  border:1px solid var(--line2);border-radius:12px;background:linear-gradient(180deg,#111827,#0b1120);
  box-shadow:0 18px 45px rgba(0,0,0,.55);z-index:120;animation:fadeUp .16s ease}
.mb-menu[hidden]{display:none}
.mb-menu-hd{padding:8px 10px 10px;border-bottom:1px solid var(--line);margin-bottom:5px}
.mb-menu-hd b{display:block;font-size:13px;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mb-menu-hd span{display:block;font-size:11px;color:var(--dim);margin-top:3px}
.mb-menu-i{display:block;width:100%;text-align:left;padding:8px 10px;border:0;border-radius:8px;
  background:transparent;color:var(--muted);font-size:12.5px;cursor:pointer}
.mb-menu-i:hover{background:rgba(255,255,255,.06);color:var(--txt)}
.mb-menu-i.danger{color:#ff9a8f}
.mb-menu-i.danger:hover{background:rgba(255,81,64,.12);color:#ffb3aa}
.mb-menu-sep{height:1px;background:var(--line);margin:5px 4px}
.acct-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.acct-name{font-size:12.5px;color:var(--txt);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lo-card{width:min(400px,92vw)}
.lo-lead{margin:0;font-size:14.5px;color:var(--txt)}
.lo-note{margin:0;font-size:12px;color:var(--muted);line-height:1.75}
.lo-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:2px}
.lo-actions .btn{min-width:104px}

/* ---------------- 设置弹层 ---------------- */
.modal{position:fixed;inset:0;z-index:200;display:grid;place-items:center}
.modal[hidden]{display:none}
.modal-mask{position:absolute;inset:0;background:rgba(4,7,12,.72);}
.modal-card{position:relative;width:min(480px,92vw);border-radius:18px;border:1px solid var(--line2);
  background:linear-gradient(180deg,#111827,#0b1120);box-shadow:var(--shadow);animation:fadeUp .25s ease}
.mc-head{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid var(--line)}
.mc-head b{font-size:15px}
.mc-head .icon-btn{width:28px;height:28px;font-size:17px;line-height:1}
.mc-body{padding:16px 18px 20px;display:flex;flex-direction:column;gap:16px}
.field{display:flex;flex-direction:column;gap:7px}
.field > label{font-size:12.5px;color:var(--muted);font-weight:600}
.field select{padding:9px 11px;border-radius:10px;border:1px solid var(--line);background:rgba(0,0,0,.3);font-size:13px;outline:none}
.hint{font-size:11px;color:var(--dim);line-height:1.6}

/* ---------------- 积分不足 / 充值引导 ---------------- */
.pts-head-actions{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.pts-actions-row{display:flex;gap:8px;align-items:center}
.pts-recharge-hint{font-size:11.5px;color:var(--dim);line-height:1.4;letter-spacing:.2px;white-space:nowrap}
.rc-card{width:min(860px,94vw);max-height:min(90vh,880px);display:flex;flex-direction:column}
.rc-body{gap:13px;overflow-y:auto;min-height:0}
.rc-lead{font-size:13px;color:var(--muted);line-height:1.7}
.rc-nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.rc-num{padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--panel);text-align:center}
.rc-num span{display:block;font-size:11.5px;color:var(--muted)}
.rc-num b{display:block;font-size:23px;line-height:1.3;font-weight:700}
.rc-num i{font-style:normal;font-size:11px;color:var(--dim)}
.rc-num.rc-gap b{color:var(--gold)}

/* 双栏：积分充值包 / VIP 会员（价格与档位均取自主站） */
.rc-offers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rc-offer{display:flex;flex-direction:column;gap:9px;padding:13px;border:1px solid var(--line2);border-radius:12px;
  background:linear-gradient(160deg,rgba(255,255,255,.045),rgba(255,255,255,.015))}
.rc-offer-vip{background:linear-gradient(150deg,rgba(243,193,105,.10),rgba(91,147,255,.05))}
.rc-offer-hd{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.rc-offer-hd b{font-size:14px}
.rc-offer-hd span{font-size:10.5px;color:var(--muted);white-space:nowrap}
.rc-loading{padding:16px 6px;text-align:center;font-size:11.5px;color:var(--dim)}
.rc-offer-note{font-size:11.2px;color:var(--dim);line-height:1.55;margin-top:auto}

.rc-pk-list{display:flex;flex-direction:column;gap:5px}
.rc-pk{position:relative;display:flex;align-items:center;gap:8px;padding:7px 9px;
  border:1px solid var(--line);border-radius:9px;background:var(--panel)}
/* 推荐档只靠角标 + 极淡底色区分，不加描边，避免和「已选」的金色边框混淆 */
.rc-pk.rec{background:rgba(243,193,105,.05)}
.rc-pk-main{min-width:0;flex:1}
.rc-pk-main b{display:block;font-size:12px;font-weight:600}
.rc-pk-main span{display:block;font-size:10.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc-pk-price{font-size:14px;font-weight:700;color:var(--gold);white-space:nowrap}
.rc-pk-flag{display:inline-block;margin-left:6px;padding:1px 5px;border-radius:5px;
  font-size:9px;font-style:normal;font-weight:700;vertical-align:middle;background:var(--gold);color:#1a1206}

.rc-vip-grant{font-size:12px;color:var(--muted);line-height:1.5}
.rc-vip-grant b{font-size:19px;color:var(--gold)}
.rc-grant-use{display:block;font-size:10.5px;color:var(--dim);margin-top:1px}
.rc-plan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.rc-plan{position:relative;padding:7px 9px;border:1px solid var(--line);border-radius:9px;background:var(--panel)}
.rc-plan.best{background:rgba(243,193,105,.04)}
.rc-plan .rp-days{font-size:10.5px;color:var(--muted)}
.rc-plan .rp-price{font-size:15px;font-weight:700;color:var(--gold);line-height:1.35}
.rc-plan .rp-price s{margin-left:5px;font-size:10px;font-weight:400;color:var(--dim)}
.rc-plan .rp-per{font-size:10px;color:var(--dim)}
.rc-flag{position:absolute;top:-1px;right:-1px;padding:1px 5px;border-radius:0 8px 0 8px;
  font-size:9px;font-weight:700;background:var(--gold);color:#1a1206}
.rc-vip-rules{display:flex;flex-direction:column;gap:4px;font-size:11.2px;color:var(--muted);line-height:1.55}
.rc-vip-rules div{display:flex;gap:6px}
.rc-vip-rules span{flex:none;min-width:44px;color:var(--dim)}
.rc-vip-rules em{font-style:normal;min-width:0}
.rc-flag-off{background:var(--dim);color:var(--bg)}
.rc-state{padding:10px 12px;border-radius:10px;font-size:12.5px;line-height:1.6}
.rc-state.wait{border:1px solid rgba(91,147,255,.35);background:rgba(91,147,255,.10);color:#a8c6ff}
.rc-state.ok{border:1px solid rgba(55,211,154,.35);background:rgba(55,211,154,.10);color:#8ff0c8}
.rc-state.err{border:1px solid rgba(255,81,64,.35);background:rgba(255,81,64,.10);color:#ffb3aa}
/* ---------------- 新客户试用引导（充值弹窗底部） ---------------- */
.rc-trial{display:flex;flex-direction:column;gap:8px;padding:11px 13px;border-radius:12px;
  border:1px solid rgba(243,193,105,.28);
  background:linear-gradient(180deg,rgba(243,193,105,.10),rgba(243,193,105,.03))}
.rc-trial-hd{display:flex;align-items:center;gap:7px}
.rc-trial-hd b{font-size:12.5px;color:var(--gold);font-weight:700}
.rc-trial-tag{padding:1px 6px;border-radius:5px;background:var(--gold);color:#1a1206;
  font-size:10px;font-weight:700}
.rc-trial-lead{font-size:11.5px;color:var(--muted);line-height:1.6}
.rc-trial-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rc-trial-btn{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;
  border-radius:9px;border:1px solid rgba(243,193,105,.55);color:var(--gold);
  font-size:12px;font-weight:600;white-space:nowrap;
  transition:background .15s,border-color .15s}
.rc-trial-btn svg{width:15px;height:15px;flex:none}
.rc-trial-btn:hover{background:rgba(243,193,105,.14);border-color:var(--gold)}
.rc-invite{display:flex;align-items:center;gap:6px;flex:1;min-width:208px}
.rc-invite input{flex:1;min-width:0;height:32px;padding:0 10px;border-radius:9px;
  border:1px solid var(--line);background:rgba(0,0,0,.32);color:var(--txt);
  font-size:12px;outline:none;transition:border-color .15s}
.rc-invite input:focus{border-color:rgba(243,193,105,.75);background:rgba(0,0,0,.42)}
.rc-invite input::placeholder{color:var(--dim)}
.rc-invite .btn{height:32px;min-width:60px}
.rc-invite .btn:disabled{opacity:.45;cursor:not-allowed}
.rc-invite-msg{font-size:11.5px;line-height:1.55;color:var(--muted)}
.rc-invite-msg.ok{color:#8ff0c8}
.rc-invite-msg.err{color:#ffb3aa}

.rc-actions{display:flex;gap:10px;justify-content:flex-end}
.rc-actions .btn{min-width:110px}
.rc-actions .btn:disabled{opacity:.45;cursor:not-allowed}

/* 档位选择：先选中，再点「立即充值」才进收银台 */
.rc-plan[data-plan]{cursor:pointer;transition:border-color .15s,background .15s}
.rc-plan[data-plan]:hover{border-color:rgba(243,193,105,.6);background:rgba(243,193,105,.08)}
.rc-pk.sel,.rc-plan.sel{border-color:rgba(243,193,105,.95);background:rgba(243,193,105,.16);
  box-shadow:inset 0 0 0 1px rgba(243,193,105,.45)}
.rc-check{display:none;position:absolute;left:-7px;top:-7px;width:17px;height:17px;border-radius:50%;
  align-items:center;justify-content:center;background:var(--gold);color:#1a1206;
  font-size:11px;font-style:normal;font-weight:800;box-shadow:0 1px 5px rgba(0,0,0,.35)}
.sel>.rc-check{display:flex}
.rc-pk.sel .rc-pk-buy{background:var(--gold);color:#1a1206}
.rc-selected{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;
  border:1px solid rgba(243,193,105,.35);border-radius:10px;background:rgba(243,193,105,.08);
  font-size:12px;color:var(--muted)}
.rc-selected[hidden]{display:none}
.rc-selected b{color:var(--gold);font-size:13px}
.rc-selected span:last-child{color:var(--dim);font-size:11.5px;white-space:nowrap}

/* ---------------- 站内收银台 ---------------- */
.rc-pk[data-pkg]{cursor:pointer;transition:border-color .15s,background .15s}
.rc-pk[data-pkg]:hover{border-color:rgba(243,193,105,.6);background:rgba(243,193,105,.08)}
.rc-pk-price{display:flex;align-items:center;gap:8px}
.rc-pk-buy{font-style:normal;font-size:10px;font-weight:600;color:var(--gold);
  border:1px solid rgba(243,193,105,.5);border-radius:6px;padding:1px 5px}
.pay-ok{font-size:70px;line-height:1;color:#37d39a}
.pay-card{width:min(440px,92vw)}
.pay-body{gap:13px}
.pay-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 14px;border:1px solid var(--line2);border-radius:12px;
  background:linear-gradient(135deg,rgba(243,193,105,.08),rgba(255,81,64,.04))}
.pay-sum-l{display:flex;flex-direction:column;gap:4px;min-width:0}
.pay-sum-l b{font-size:15px}
.pay-sum-l span{font-size:12px;color:var(--muted)}
.pay-sum-r{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex:none}
.pay-sum-r span{font-size:11px;color:var(--dim)}
.pay-sum-r b{font-size:22px;color:var(--gold);line-height:1.2}
.pay-order{font-size:11.5px;color:var(--dim);margin-top:-6px}
.pay-order code{font-size:11px;color:var(--muted)}
.pay-chans{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pay-chans button{padding:9px;border-radius:10px;border:1px solid var(--line2);
  background:var(--panel);color:var(--muted);font-size:13px;font-weight:600;cursor:pointer}
.pay-chans button.on{border-color:var(--gold);color:var(--gold);background:rgba(243,193,105,.10)}
.pay-pane{display:flex;flex-direction:column;align-items:center;gap:10px;min-height:214px;
  padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.pay-qr{width:188px;height:188px;display:grid;place-items:center;border-radius:10px;background:#fff;overflow:hidden}
.pay-qr img{width:100%;height:100%;object-fit:contain}
.pay-qr svg{width:100%;height:100%}
.pay-loading,.pay-qr .err{font-size:12px;color:#64748b;text-align:center;padding:12px}
.pay-qr-tip{font-size:12px;color:var(--muted)}
.pay-ali-tip{font-size:12.5px;color:var(--muted);line-height:1.7;text-align:center;margin:auto 0}
.pay-state{padding:9px 12px;border-radius:10px;font-size:12.5px;line-height:1.6}
.pay-state.wait{border:1px solid rgba(91,147,255,.35);background:rgba(91,147,255,.10);color:#a8c6ff}
.pay-state.ok{border:1px solid rgba(55,211,154,.35);background:rgba(55,211,154,.10);color:#8ff0c8}
.pay-state.err{border:1px solid rgba(255,81,64,.35);background:rgba(255,81,64,.10);color:#ffb3aa}
.pay-foot{display:flex;gap:10px;justify-content:flex-end}
.pay-foot .btn{min-width:100px}

/* ---------------- 大图查看 ---------------- */
.viewer{position:fixed;inset:0;z-index:220;display:grid;place-items:center}
.viewer[hidden]{display:none}
.v-mask{position:absolute;inset:0;background:rgba(3,5,10,.86);}
.v-body{position:relative;display:flex;gap:0;width:min(1120px,94vw);height:min(720px,88vh);
  border-radius:18px;overflow:hidden;border:1px solid var(--line2);background:#0a0e18;box-shadow:var(--shadow)}
.v-media{position:relative;flex:1;background:#05070c;display:grid;place-items:center;overflow:hidden}
.v-media img,.v-media video{max-width:100%;max-height:100%;object-fit:contain}
.v-side{width:300px;border-left:1px solid var(--line);padding:18px;display:flex;flex-direction:column;gap:12px;overflow-y:auto}
.v-meta{display:flex;flex-wrap:wrap;gap:6px}
.v-meta span{font-size:11px;padding:3px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.v-prompt{font-size:12.5px;color:var(--muted);line-height:1.7;white-space:pre-wrap;word-break:break-word}
.v-actions{margin-top:auto;display:flex;flex-direction:column;gap:8px}
.v-actions .btn{width:100%}
.v-actions .btn-g{font-size:13px;padding:9px 14px}
.v-close{position:absolute;top:10px;right:10px;z-index:5;width:30px;height:30px;border-radius:50%;
  background:rgba(0,0,0,.5);color:#fff;font-size:17px;display:grid;place-items:center;}
.v-close:hover{background:var(--red2)}

/* ---------------- toast ---------------- */
/* v28：必须高于工作台 900 / 大图预览 950 / API 弹窗 1000，
   否则弹层打开时 toast 被半透明遮罩压暗，变成看不清的一句灰字。 */
.toasts{position:fixed;right:20px;bottom:24px;z-index:1200;display:flex;flex-direction:column;gap:9px;align-items:flex-end}
/* 工作台打开时挪到面板顶部居中：既不落在面板外的黑色遮罩里，也不压住图片与提交按钮 */
body.ib-open .toasts{top:12px;bottom:auto;right:auto;left:50%;transform:translateX(-50%);align-items:center}
.toast{min-width:220px;max-width:380px;padding:11px 15px;border-radius:12px;font-size:13px;
  background:rgba(17,24,39,.96);border:1px solid var(--line2);box-shadow:0 14px 36px rgba(0,0,0,.5);
  animation:fadeUp .25s ease;display:flex;gap:9px;align-items:flex-start;line-height:1.55}
.toast.ok{border-color:rgba(55,211,154,.4)}
.toast.err{border-color:rgba(255,81,64,.45)}
.toast .ti{flex-shrink:0}
.toast.ok .ti{color:var(--green)}.toast.err .ti{color:var(--red)}

/* ---------------- 积分明细 ---------------- */
.pts-page{max-width:1180px;display:flex;flex-direction:column;gap:16px}
.pts-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.pts-head h2{font-size:20px;font-weight:600;letter-spacing:.5px}
.pts-head p{font-size:12.5px;color:var(--dim);margin-top:2px}
.pts-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.pts-card{display:flex;flex-direction:column;gap:4px;padding:16px 18px;border-radius:var(--radius-s);
  border:1px solid var(--line);background:var(--panel)}
.pts-card span{font-size:12px;color:var(--muted)}
.pts-card b{font-size:26px;line-height:1.2;font-weight:600;color:var(--txt);font-variant-numeric:tabular-nums}
.pts-card:first-child b{color:var(--gold)}
.pts-card i{font-style:normal;font-size:11px;color:var(--dim)}
.pts-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.pts-stats .ps{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;
  border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.025)}
.pts-stats .ps span{font-size:12px;color:var(--muted)}
.pts-stats .ps b{font-size:15px;font-variant-numeric:tabular-nums}
.pts-stats .plus,.pt-amount.plus{color:var(--green)}
.pts-stats .minus,.pt-amount.minus{color:var(--red)}
.pts-panel{padding:0;overflow:hidden}
.pts-tabs{display:flex;gap:4px;padding:12px 14px;border-bottom:1px solid var(--line);overflow-x:auto}
.pts-tabs .pt{padding:6px 14px;border-radius:999px;font-size:12.5px;color:var(--muted);white-space:nowrap}
.pts-tabs .pt:hover{background:var(--panel2);color:#fff}
.pts-tabs .pt.on{background:rgba(255,81,64,.16);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,81,64,.35)}
.pts-table{display:flex;flex-direction:column;min-height:120px}
.ptr{display:grid;grid-template-columns:132px 92px minmax(0,1fr) 84px 100px;gap:12px;align-items:center;
  padding:11px 16px;border-bottom:1px solid var(--line);font-size:12.5px}
.ptr:last-child{border-bottom:0}
.ptr.pth{color:var(--dim);font-size:11.5px;background:rgba(255,255,255,.02);letter-spacing:.5px}
.pt-time,.pt-bal{color:var(--dim);font-variant-numeric:tabular-nums;white-space:nowrap}
.pt-type{font-size:11.5px;padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted);
  text-align:center;white-space:nowrap}
.pt-type.plus{border-color:rgba(55,211,154,.3);color:var(--green)}
.pt-type.minus{border-color:rgba(255,81,64,.3);color:var(--red)}
.pt-desc{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt-amount{font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.pt-bal{text-align:right}
.pts-more{padding:12px 16px;border-top:1px solid var(--line);text-align:center}
.pts-more .btn{min-width:140px}
.mb-pts{cursor:pointer}
.mb-pts:hover{border-color:var(--gold)}

/* ---------------- 作品库 / 创作台入口 ---------------- */
.go-lib{color:var(--gold)!important;font-weight:600}
.go-lib:hover{color:#fff!important}
.res-note{padding:9px 16px;border-bottom:1px solid var(--line);font-size:11.5px;color:var(--dim)}
.wk-page{max-width:1180px;display:flex;flex-direction:column;gap:16px}
.wk-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.wk-head h2{font-size:20px;font-weight:600;letter-spacing:.5px}
.wk-head p{font-size:12.5px;color:var(--dim);margin-top:2px}
.wk-head p b{color:var(--gold);font-weight:600}
.wk-head-actions{display:flex;gap:8px}
.wk-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.wk-card{display:flex;flex-direction:column;gap:3px;text-align:left;padding:14px 18px;border-radius:var(--radius-s);
  border:1px solid var(--line);background:var(--panel);transition:.18s}
.wk-card:hover{background:var(--panel2);border-color:var(--line2)}
.wk-card.on{border-color:rgba(255,81,64,.42);background:rgba(255,81,64,.09)}
.wk-card span{font-size:12px;color:var(--muted)}
.wk-card b{font-size:25px;line-height:1.2;font-weight:600;font-variant-numeric:tabular-nums;color:var(--txt)}
.wk-card.img b{color:var(--blue)}
.wk-card.vid b{color:var(--gold)}
.wk-card i{font-style:normal;font-size:11px;color:var(--dim)}
.wk-panel{padding:0;overflow:hidden}
.wk-tools{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border-bottom:1px solid var(--line)}
.wk-tabs{display:flex;gap:4px;flex-shrink:0}
.wk-tabs .wt{padding:6px 16px;border-radius:999px;font-size:12.5px;color:var(--muted);white-space:nowrap}
.wk-tabs .wt:hover{background:var(--panel2);color:#fff}
.wk-tabs .wt.on{background:rgba(255,81,64,.16);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,81,64,.35)}
.wk-search{position:relative;width:min(280px,45%)}
.wk-search input{width:100%;padding:7px 30px 7px 12px;border-radius:999px;border:1px solid var(--line);
  background:rgba(0,0,0,.25);font-size:12.5px;color:var(--txt);outline:none}
.wk-search input:focus{border-color:rgba(255,81,64,.5)}
.wk-search input::placeholder{color:var(--dim)}
.wk-search span{position:absolute;right:12px;top:50%;transform:translateY(-52%);color:var(--dim);font-size:17px;pointer-events:none}
.wk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(206px,1fr));gap:14px;padding:16px;min-height:140px}
.wk-grid>.empty{grid-column:1/-1;padding:50px 10px;text-align:center;color:var(--dim);font-size:13px}
.wk-item{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:rgba(255,255,255,.025);transition:.18s}
.wk-item:hover{border-color:var(--line2);transform:translateY(-2px)}
.wk-item.expired{opacity:.5}
.wk-media{position:relative;aspect-ratio:4/3;background:#05070c;overflow:hidden;cursor:pointer}
.wk-media img,.wk-media video{width:100%;height:100%;object-fit:cover;display:block}
.wk-media .wk-play{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:26px;
  text-shadow:0 2px 12px rgba(0,0,0,.8);pointer-events:none}
.wk-tag{position:absolute;top:8px;left:8px;font-size:10.5px;padding:2px 8px;border-radius:999px;
  background:rgba(7,11,20,.78);border:1px solid var(--line2);color:#fff}
.wk-tag.vid{color:var(--gold);border-color:rgba(243,193,105,.45)}
.wk-hover{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:7px;
  background:rgba(4,7,12,.66);opacity:0;transition:.18s}
.wk-media:hover .wk-hover{opacity:1}
.wk-hover button{padding:6px 12px;border-radius:999px;font-size:11.5px;color:#fff;
  border:1px solid var(--line2);background:rgba(255,255,255,.1)}
.wk-hover button:hover{background:var(--red2);border-color:var(--red2)}
.wk-info{padding:9px 11px 11px}
.wk-info b{display:block;font-size:12px;font-weight:500;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wk-info span{display:block;margin-top:3px;font-size:10.5px;color:var(--dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wk-more{padding:12px 16px;border-top:1px solid var(--line);text-align:center}
.wk-more .btn{min-width:140px}

/* ---------------- 响应式 ---------------- */
@media(max-width:1280px){
  .studio{grid-template-columns:minmax(0,1fr)}
  .studio-side{position:static;flex-direction:row;flex-wrap:wrap}
  .studio-side .panel{flex:1;min-width:260px}
}
@media(max-width:1080px){
  .quick{grid-template-columns:repeat(2,1fr)}
  .jobs{grid-template-columns:1fr}
}
@media(max-width:900px){
  .side{display:none}
  .menu{display:none}
  /* 窄屏只留客服图标，避免顶部导航挤压 */
  .top-contact{padding:0;width:34px;justify-content:center}
  .top-contact span{display:none}
  .masonry{column-count:2}
  .opts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v-body{flex-direction:column;height:90vh}
  .v-side{width:100%;border-left:0;border-top:1px solid var(--line)}
  .pts-cards,.pts-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ptr{grid-template-columns:100px 80px minmax(0,1fr) 64px}
  .ptr .pt-bal,.ptr.pth span:nth-child(5){display:none}
  .wk-head{flex-direction:column;align-items:flex-start}
  .wk-tools{flex-direction:column;align-items:stretch}
  .wk-search{width:100%}
  .wk-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px;gap:10px}
}
@media(max-width:760px){
  .rc-offers{grid-template-columns:1fr}
  .rc-card{max-height:92vh}
  .rc-plan-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:520px){
  .wk-cards{gap:8px}
  .wk-card{padding:11px 12px}
  .wk-card b{font-size:20px}
  .wk-grid{grid-template-columns:1fr}
  .pay-qr{width:158px;height:158px}
  .pay-pane{min-height:190px}
  .rc-nums{gap:6px}
  .rc-num{padding:9px 4px}
  .rc-num b{font-size:19px}
  .rc-actions .btn{flex:1;min-width:0}
  .rc-offers{gap:9px}
  .rc-offer{padding:11px}
  .rc-plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rc-offer-hd span{display:none}
  .pts-head-actions{flex-wrap:wrap}
  .pts-recharge-hint{white-space:normal;text-align:right}
}
@media(max-width:1280px){
  .pts-cards,.pts-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ==========================================================================
   v19 智能多图：按实际出图张数计费
   --------------------------------------------------------------------------
   1) 智能多图模式显示一句计费说明，替代原本的比例 / 数量选项；
   2) 未解锁的产物只给模糊缩略图 + 锁标，点开引导充值（充值后自动补解锁）。
   ========================================================================== */
.agent-bill{
  display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;
  margin-top:12px;padding:10px 14px;border-radius:12px;
  background:rgba(91,147,255,.07);border:1px solid rgba(91,147,255,.22);
  font-size:12px;color:var(--muted);
}
.agent-bill b{color:var(--txt);font-weight:600;white-space:nowrap}
.agent-bill span{color:var(--dim)}

.jm.locked img,.jm.locked video,
.wk-item.locked .wk-media img,.wk-item.locked .wk-media video{
  filter:blur(14px) saturate(.55) brightness(.7);transform:scale(1.08)
}
.lockmask{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  background:rgba(4,7,14,.4);color:#fff;pointer-events:none
}
.lockmask svg{width:20px;height:20px;opacity:.92}
.lockmask span{font-size:11px;letter-spacing:.3px;color:rgba(255,255,255,.88)}
.jm.locked .hvr{opacity:1;background:linear-gradient(0deg,rgba(0,0,0,.6),transparent 70%)}
.wk-item.locked{border-color:rgba(243,193,105,.28)}
.wk-item.locked .wk-tag{background:rgba(243,193,105,.92);color:#22190a}
.jf .pts-short{color:var(--gold)}

.vlock{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  padding:24px;text-align:center;color:var(--muted)}
.vlock svg{width:34px;height:34px;color:var(--gold);opacity:.9}
.vlock b{color:var(--txt);font-size:15px}
.vlock span{font-size:12px;color:var(--dim);max-width:300px;line-height:1.7}

@media (max-width:720px){ .agent-bill{font-size:11.5px} }

/* ==========================================================================
   v21 素材箱（从大数据平台 / 任意网页把图送进来再生成）
   --------------------------------------------------------------------------
   1) 顶部「素材箱」入口，带张数角标；
   2) 右侧抽屉：网格勾选、单张删除、批量删除、拖拽排序、三种分流按钮；
   3) API 接入说明弹窗。
   ========================================================================== */
.top-inbox{
  display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:10px;
  border:1px solid var(--line);background:var(--panel);color:var(--muted);font-size:12.5px;
  white-space:nowrap;transition:.2s;cursor:pointer;position:relative
}
.top-inbox svg{width:15px;height:15px;flex:none}
.top-inbox:hover{color:var(--blue);border-color:rgba(91,147,255,.55);background:rgba(91,147,255,.08)}
.top-inbox em{
  font-style:normal;min-width:17px;height:17px;padding:0 5px;border-radius:999px;
  display:grid;place-items:center;background:var(--red);color:#fff;font-size:10.5px;font-weight:700
}

/* ---------------- v27 素材工作台（全屏横版） ----------------
   保持 v25 的防闪约定：无全屏 backdrop-filter、入场只做位移不做渐显。 */
.ib-wrap{position:fixed;inset:0;z-index:900;display:grid;place-items:center;padding:18px}
.ib-mask{position:absolute;inset:0;background:rgba(3,6,12,.74);animation:ibFade .16s ease}
.ib{
  position:relative;width:min(1480px,100%);height:min(940px,100%);
  display:flex;flex-direction:column;overflow:hidden;
  background:#0a0f1c;border:1px solid var(--line2);border-radius:16px;
  box-shadow:0 28px 80px rgba(0,0,0,.6);
  animation:ibIn .18s cubic-bezier(.22,.9,.3,1)
}
@keyframes ibFade{from{opacity:0}to{opacity:1}}
@keyframes ibIn{from{transform:translateY(10px)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.ib-mask,.ib{animation:none}}

.ib-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);flex:none}
.ib-tt{display:flex;align-items:baseline;gap:10px;min-width:0}
.ib-tt b{font-size:15.5px;font-weight:600;white-space:nowrap}
.ib-tt span{font-size:11.5px;color:var(--dim);white-space:nowrap}
.ib-hd-sub{font-style:normal;font-size:12px;color:#a9bbd8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ib-hd-r{display:flex;align-items:center;gap:8px;flex:none}
.ib-x{
  width:28px;height:28px;flex:none;border-radius:9px;border:1px solid var(--line);
  background:var(--panel);color:var(--muted);font-size:17px;line-height:1;cursor:pointer;transition:.18s
}
.ib-x:hover{color:#fff;background:var(--panel3)}

/* v40：常驻「加入素材」方式条 —— 让用户不用猜就知道图怎么进来 */
.ib-addbar{display:flex;align-items:center;gap:7px;padding:9px 16px 0;flex-wrap:wrap;flex:none}
.ib-add-lead{font-size:11.5px;color:var(--dim);white-space:nowrap;letter-spacing:.02em}
.ib-add-it{
  display:inline-flex;align-items:center;gap:6px;height:27px;max-width:100%;min-width:0;padding:0 10px;
  border-radius:999px;border:1px dashed rgba(130,160,210,.36);background:rgba(130,160,210,.07);
  color:#c3d4ea;font-size:12px;font-family:inherit;cursor:pointer;transition:.16s
}
.ib-add-it:hover{border-color:rgba(150,185,235,.72);background:rgba(130,160,210,.17);color:#fff}
.ib-add-it:active{transform:translateY(1px)}
.ib-add-it i{
  flex:none;font-style:normal;width:17px;height:17px;border-radius:6px;display:grid;place-items:center;
  background:rgba(150,180,225,.22);color:#e8f1ff;font-size:11px;font-weight:700
}
.ib-add-it kbd{
  flex:none;font-family:inherit;font-size:10.5px;line-height:1;padding:3px 5px;border-radius:5px;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#eaf2ff
}
.ib-add-it em{font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.ib-tools{display:flex;align-items:center;gap:6px;padding:8px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap;flex:none}
.ib-t{
  height:27px;padding:0 9px;border-radius:8px;border:1px solid var(--line);background:var(--panel);
  color:var(--muted);font-size:12px;cursor:pointer;transition:.16s;white-space:nowrap;display:inline-flex;align-items:center
}
.ib-t:hover{color:#fff;background:var(--panel2);border-color:var(--line2)}
.ib-t.danger:hover{color:var(--red);border-color:rgba(255,81,64,.5);background:rgba(255,81,64,.08)}
.ib-t.up{border-style:dashed}
.ib-tools-sp{flex:1}
.ib-tools-hint{font-size:12px;color:#a9bbd8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:62%}

/* 图片选取区：大卡片、完整显示不裁剪 */
.ib-stage{flex:1;min-height:0;overflow-y:auto;padding:14px 16px;position:relative;background:rgba(0,0,0,.12)}
.ib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:12px;align-content:start;align-items:start}
.ib-it{
  position:relative;border-radius:12px;overflow:hidden;cursor:pointer;display:flex;flex-direction:column;
  border:2px solid transparent;background:#0d1423;transition:.16s
}
.ib-media{position:relative;aspect-ratio:4/5;max-height:340px;background:#141c2e;display:grid;place-items:center;overflow:hidden}
.ib-it img{width:100%;height:100%;object-fit:contain;display:block}
.ib-it:hover{border-color:rgba(255,255,255,.22)}
.ib-it.on{border-color:var(--red)}
.ib-it.on .ib-media img{opacity:.9}
.ib-name{padding:5px 7px;font-size:11px;color:#a9bbd8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-top:1px solid var(--line)}
.ib-it .pick{
  position:absolute;left:6px;top:6px;width:22px;height:22px;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.8);background:rgba(8,12,20,.55);
  display:grid;place-items:center;font-size:12px;color:#fff;line-height:1
}
.ib-it.on .pick{background:var(--red);border-color:var(--red)}
.ib-it .rm,.ib-it .zoom{
  position:absolute;width:23px;height:23px;border-radius:50%;border:0;
  background:rgba(8,12,20,.7);color:#fff;line-height:1;cursor:pointer;
  opacity:0;transition:.15s;display:grid;place-items:center
}
.ib-it .rm{right:6px;top:6px;font-size:13px}
.ib-it .zoom{right:6px;bottom:6px;font-size:13px;border-radius:7px;background:rgba(8,12,20,.78)}
.ib-it:hover .rm,.ib-it:hover .zoom{opacity:1}
.ib-it .rm:hover{background:var(--red)}
.ib-it .zoom:hover{background:var(--blue)}
.ib-it .no{
  position:absolute;left:6px;bottom:6px;min-width:17px;height:17px;padding:0 4px;border-radius:5px;
  background:rgba(8,12,20,.7);color:#cbd6ea;font-size:10px;display:grid;place-items:center
}
.ib-it.drag{opacity:.35}
.ib-it.over{border-color:var(--blue)}

.ib-empty{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;padding:26px 30px;text-align:center;color:var(--muted)
}
.ib-empty svg{width:42px;height:42px;color:var(--dim);opacity:.8;margin-bottom:2px}
.ib-empty b{font-size:13.5px;color:var(--txt);font-weight:600}
.ib-empty span{font-size:11.5px;color:var(--dim);line-height:2}
.ib-empty .txt-btn{margin-top:2px}

/* 控制台：模式 / 提示词 / 参数 / 提交 */
.ib-console{flex:none;border-top:1px solid var(--line);background:rgba(255,255,255,.022);padding:11px 16px 13px}
/* v28 常驻状态条：默认给操作顺序，出错/进度/结果就地变色，不用去右下角找提示 */
.ib-notice{
  display:flex;align-items:center;gap:9px;min-height:34px;padding:7px 12px;margin-bottom:10px;
  border:1px solid rgba(130,160,210,.28);border-radius:10px;background:rgba(130,160,210,.08);
  font-size:12.5px;line-height:1.5;color:#d3e0f4
}
.ib-notice .ni{flex:none;width:21px;height:21px;border-radius:50%;display:grid;place-items:center;
  background:rgba(150,180,225,.24);color:#eaf2ff;font-size:12px;font-weight:700}
.ib-notice .tx{min-width:0}
.ib-notice b{color:#fff;font-weight:600}
.ib-notice.err{border-color:rgba(255,81,64,.6);background:rgba(255,81,64,.14);color:#ffdcd7}
.ib-notice.err .ni{background:var(--red);color:#fff}
.ib-notice.err b{color:#fff}
.ib-notice.busy{border-color:rgba(243,193,105,.5);background:rgba(243,193,105,.12);color:#ffe9c2}
.ib-notice.busy .ni{background:rgba(243,193,105,.92);color:#241a08}
.ib-notice.ok{border-color:rgba(55,211,154,.5);background:rgba(55,211,154,.12);color:#cdf8e6}
.ib-notice.ok .ni{background:var(--green);color:#062218}

/* v30：提交成功后就地显示「任务已生成 + 进度」，不用跳去创作台确认 */
.ib-taskbar{
  display:flex;align-items:center;gap:10px;min-height:38px;padding:6px 9px 6px 12px;margin:-2px 0 10px;
  border:1px solid rgba(55,211,154,.42);border-radius:10px;
  background:linear-gradient(90deg,rgba(55,211,154,.14),rgba(55,211,154,.04));
  font-size:12.5px;line-height:1.5;color:#d6f6e8
}
.ib-taskbar[hidden],.ib-taskbar .tb-pics[hidden]{display:none!important}
.ib-taskbar .tb-ic{flex:none;width:21px;height:21px;border-radius:6px;display:grid;place-items:center;
  background:rgba(55,211,154,.9);color:#062218;font-size:12px;font-weight:700}
.ib-taskbar .tb-tx{flex:1;min-width:0}
.ib-taskbar .tb-tx b{color:#fff;font-weight:600}
.ib-taskbar .tb-pics{display:flex;gap:4px;flex:none}
.ib-taskbar .tb-pics img{width:26px;height:26px;border-radius:5px;object-fit:cover;
  border:1px solid rgba(255,255,255,.22);background:#0f1524}
.ib-taskbar .tb-go{flex:none;height:28px;padding:0 11px;border-radius:8px;border:1px solid rgba(55,211,154,.5);
  background:rgba(55,211,154,.16);color:#a9f3d3;font-size:12px;font-weight:600;cursor:pointer;transition:.16s;white-space:nowrap}
.ib-taskbar .tb-go:hover{background:rgba(55,211,154,.3);color:#fff}
@keyframes ibAutoFill{0%,100%{box-shadow:none}20%,65%{box-shadow:0 0 0 2px rgba(55,211,154,.7),0 0 16px rgba(55,211,154,.25)}}
.ib-prompt-col.autofill{animation:ibAutoFill 1.3s ease}
@media (prefers-reduced-motion:reduce){.ib-prompt-col.autofill{animation:none;box-shadow:0 0 0 2px rgba(55,211,154,.7)}}
/* 校验失败时把对应区域闪一下，用户立刻知道要去哪里改 */
@keyframes ibFlash{0%,100%{box-shadow:none}25%,70%{box-shadow:0 0 0 2px rgba(255,81,64,.85),0 0 18px rgba(255,81,64,.35)}}
.ib-flash{animation:ibFlash 1.1s ease}
@media (prefers-reduced-motion:reduce){.ib-flash{animation:none;box-shadow:0 0 0 2px rgba(255,81,64,.85)}}
.ib-mode-row{display:flex;align-items:center;gap:12px;margin-bottom:10px;flex-wrap:wrap}
.ib-mode{display:inline-flex;gap:3px;padding:3px;border:1px solid var(--line);border-radius:11px;background:var(--panel)}
.ib-mode button{padding:6px 18px;border-radius:8px;font-size:13px;color:var(--muted);transition:.16s;white-space:nowrap}
.ib-mode button:hover{color:#fff}
.ib-mode button.on{background:linear-gradient(180deg,var(--red),var(--red2));color:#fff;font-weight:600}
.ib-selinfo{font-size:12px;color:var(--gold);white-space:nowrap}
.ib-console-tip{font-size:12px;color:#a9bbd8;margin-left:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ib-console-tip b{color:var(--gold);font-weight:700}
.ib-console-main{display:grid;grid-template-columns:minmax(300px,1.35fr) minmax(300px,1fr) 236px;gap:14px;align-items:stretch}
.ib-prompt-col,.ib-opts-col{padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:rgba(0,0,0,.18);min-width:0}
.ib-lbl{display:flex;align-items:baseline;gap:8px;font-size:12.5px;color:var(--muted);font-weight:600;margin-bottom:5px}
.ib-lbl>span:first-child{font-size:11.5px;color:#a9bbd8;font-weight:400}
.ib-lbl .counter{margin-left:auto}
#ibPrompt{width:100%;height:76px;min-height:60px;background:transparent;border:0;resize:none;outline:none;
  font-size:13.5px;line-height:1.6;color:var(--txt)}
#ibPrompt::placeholder{color:#4d5a72}
#ibStyleChips{margin-top:6px;max-height:58px;overflow-y:auto}   /* 12 个词两行全显示，不用横向找 */
#ibStyleChips .chip{font-size:11px;padding:3px 9px}
.ib-opts-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px}
.ib-opt{min-width:0}
.ib-opt.wide{grid-column:1/-1}
.ib-opt label{display:block;font-size:11.5px;color:#a9bbd8;margin-bottom:4px}
.ib-opt .seg button{padding:4px 8px;font-size:11.5px;border-radius:7px}
.ib-submit-col{display:flex;flex-direction:column;gap:8px;min-width:0}
.ib-submit{
  flex:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;
  padding:9px 14px;border-radius:12px;border:1px solid var(--line2);text-align:left;
  transition:.18s;background:var(--panel);min-height:56px
}
.ib-submit b{font-size:13.5px;font-weight:600}
.ib-submit i{font-style:normal;font-size:11.5px;color:#b9c9e2;line-height:1.4}
.ib-submit.p{background:linear-gradient(180deg,var(--red),var(--red2));border-color:transparent;color:#fff}
.ib-submit.p i{color:rgba(255,255,255,.94)}
.ib-submit.o{background:rgba(243,193,105,.14);border-color:rgba(243,193,105,.48);color:#f6d79a}
.ib-submit.o i{color:#e6c688}
.ib-submit:hover{transform:translateY(-1px);filter:brightness(1.08)}
.ib-submit:disabled{opacity:.45;cursor:not-allowed;transform:none;filter:none}
.ib-submit-col .txt-btn{align-self:flex-end;font-size:12px;color:#b9c9e2;opacity:1}

/* 大图预览 */
.ib-lightbox{position:fixed;inset:0;z-index:950;display:grid;place-items:center;padding:28px}
.ilb-mask{position:absolute;inset:0;background:rgba(2,4,9,.9)}
.ilb-body{position:relative;display:flex;align-items:center;justify-content:center;gap:10px}
.ilb-body img{max-width:min(980px,80vw);max-height:78vh;object-fit:contain;border-radius:10px;
  background:#0f1524;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.ilb-nav{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;
  border:1px solid var(--line2);background:rgba(10,15,28,.85);color:#fff;font-size:24px;line-height:1;cursor:pointer;z-index:2}
.ilb-nav.prev{left:-46px}
.ilb-nav.next{right:-46px}
.ilb-x{position:absolute;top:-44px;right:0;width:30px;height:30px;border-radius:9px;border:1px solid var(--line2);
  background:rgba(10,15,28,.9);color:#fff;font-size:18px;cursor:pointer}
.ilb-bar{position:absolute;bottom:-42px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:12px;
  color:var(--muted);font-size:12px}

@media (max-width:1180px){
  .ib-wrap{padding:10px}
  .ib-console-main{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .ib-submit-col{grid-column:1/-1;flex-direction:row;flex-wrap:wrap}
  .ib-submit{flex:1;min-width:200px}
  .ib-submit-col .txt-btn{flex-basis:100%;text-align:right}
}
@media (max-width:760px){
  .ib-wrap{padding:0}
  .ib{border-radius:0;border:0;height:100%}
  .ib-hd-sub,.ib-tools-hint,.ib-tools-step,.ib-console-tip{display:none}
  .ib-addbar{padding:8px 12px 0}
  .ib-add-lead{display:none}
  .ib-add-it{height:25px;padding:0 8px;font-size:11.5px}
  .ib-taskbar{flex-wrap:wrap}
  .ib-taskbar .tb-pics{display:none!important}
  .ib-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
  .ib-stage{padding:10px}
  .ib-console{max-height:54vh;overflow-y:auto}
  .ib-console-main{grid-template-columns:1fr}
  .ib-submit-col{grid-column:auto}
  .ilb-nav.prev{left:6px}
  .ilb-nav.next{right:6px}
  .ilb-body img{max-width:86vw}
}

@media (max-width:900px){
  .top-inbox{padding:0;width:34px;justify-content:center}
  .top-inbox span{display:none}
  .top-inbox em{position:absolute;top:-5px;right:-5px;height:15px;min-width:15px;font-size:9.5px}
}
@media (max-width:640px){
  /* v27：手机窄屏固定 2 列，单张图更大更好挑 */
  .ib-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* v40：窄屏只留图标与按键，说明文字靠 title 提示 */
  .ib-add-it em{display:none}
}

/* ==========================================================================
   v23：素材箱入口「上移 + 左移」
   --------------------------------------------------------------------------
   1) 顶部主导航新增「素材箱」标签（与创作台/作品库/积分明细并列）；
   2) 左侧边栏「工作台」分组新增「素材箱」菜单；
   3) 右上角原胶囊按钮桌面隐藏，仅窄屏（≤900px）作为备用入口显示，
      因为窄屏下 .menu 与 .side 都会被隐藏，否则就没有入口了。
   ========================================================================== */
.menu-ib{display:inline-flex;align-items:center;gap:7px}
.menu-ib svg{width:15px;height:15px;flex:none;opacity:.9}
.menu-ib:hover svg{color:var(--blue)}
.menu-ib em.ib-badge{
  font-style:normal;min-width:17px;height:17px;padding:0 5px;border-radius:999px;
  display:grid;place-items:center;background:var(--red);color:#fff;font-size:10.5px;font-weight:700
}
.ib-badge.hide{display:none!important}
.dot-violet{width:6px;height:6px;border-radius:50%;margin:0 4px;background:#a78bfa}

/* 桌面不再显示右上角那份 */
.top-inbox{display:none}
@media (max-width:900px){
  .top-inbox{display:inline-flex}
}