:root{
  --bg:#f7f8fc; --card:#ffffff; --line:#e9ecf4; --text:#111827; --muted:#7b8498;
  --purple:#7b52f6; --purple2:#8e68ff; --light-purple:#f0ebff; --blue:#2c7df0;
  --shadow:0 14px 45px rgba(26,34,52,.08); --radius:14px;
}
:root.dark{--bg:#0b1020;--card:#111827;--line:#263149;--text:#f7f8fc;--muted:#a1abc1;--shadow:0 18px 50px rgba(0,0,0,.24)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC","Microsoft YaHei",Arial,sans-serif;letter-spacing:.1px}
button,input,select,textarea{font:inherit} button{border:0;cursor:pointer;background:transparent;color:inherit} input,select,textarea{outline:none}
.app{width:100vw;height:100vh;overflow:hidden;background:linear-gradient(180deg,var(--bg),var(--bg))}
.sidebar{position:fixed;left:0;top:0;width:122px;height:100vh;background:rgba(255,255,255,.82);border-right:1px solid var(--line);backdrop-filter:blur(20px);z-index:10}
.dark .sidebar{background:rgba(12,18,31,.86)}
.mac-dots{display:flex;gap:10px;padding:20px 0 0 18px}.mac-dots span{width:12px;height:12px;border-radius:50%}.mac-dots span:nth-child(1){background:#fb5f57}.mac-dots span:nth-child(2){background:#fdbc40}.mac-dots span:nth-child(3){background:#34c759}
.brand-mini{position:absolute;top:20px;left:143px;font-weight:800;white-space:nowrap;font-size:14px}
.avatar-y{width:56px;height:56px;border-radius:14px;background:linear-gradient(135deg,#5b8cff,#8e5cff);box-shadow:0 16px 30px rgba(119,86,255,.28);color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;margin:48px auto 34px;cursor:pointer}
.nav{display:flex;flex-direction:column;gap:10px;padding:0 16px}.nav-item{height:72px;border-radius:14px;color:var(--text);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;transition:.18s}.nav-item span{font-size:24px;color:#7d8498}.nav-item em{font-style:normal;font-size:13px;font-weight:700}.nav-item.active{background:#f1edff;color:var(--purple)}.dark .nav-item.active{background:#251c43}.nav-item.active span{color:var(--purple)}.nav-item:hover{background:#f4f1ff}.dark .nav-item:hover{background:#18233a}
.user-foot{position:absolute;bottom:22px;left:0;width:100%;text-align:center;color:var(--text);font-size:13px;font-weight:700}.w-badge{margin:0 auto 8px;width:38px;height:38px;border-radius:8px;background:#ffa52e;color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px}.pro-link{margin-top:8px;color:#7b52f6;border:1px solid #c7b6ff;border-radius:7px;padding:4px 12px;background:var(--card)}
.main{margin-left:122px;height:100vh;overflow:auto;padding:0 28px 26px}.topbar{height:48px;display:flex;align-items:center;justify-content:space-between}.top-title{font-weight:800;font-size:14px}.window-controls{color:var(--text);font-size:17px;letter-spacing:10px}.top-actions{position:fixed;right:28px;top:66px;display:flex;gap:14px;z-index:11}.icon-btn,.outline-btn,.primary,.ghost,.load-more,.goldbtn{height:38px;border-radius:9px;padding:0 18px;background:var(--card);border:1px solid var(--line);box-shadow:0 7px 18px rgba(30,40,60,.04);font-weight:800;color:var(--text)}.primary{background:linear-gradient(135deg,#8756ff,#6659f6);border:0;color:#fff;box-shadow:0 16px 30px rgba(123,82,246,.23)}.primary.small{height:40px}.goldbtn{background:#e6aa00;color:#fff;border:0}.wide{width:100%}.ghost{background:var(--card)}
.page{display:none;min-height:calc(100vh - 48px);padding:18px 0 36px}.page.active{display:block}h1{font-size:30px;margin:0 0 6px 0;font-weight:900;letter-spacing:.4px}.subtitle{margin:0 0 26px;color:var(--muted);font-weight:600}.spark,.star{color:var(--purple)}.panel{background:rgba(255,255,255,.92);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.dark .panel{background:rgba(17,24,39,.92)}.panel h3{margin:0 0 16px;font-size:16px}.panel-head{display:flex;justify-content:space-between;align-items:center;padding:0 0 18px}.panel-head h3{margin:0}.panel-head a{color:var(--purple);font-size:13px;font-weight:800;cursor:pointer}
.home-grid{display:grid;grid-template-columns:1fr 480px;gap:28px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat-card{height:126px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:24px 18px;display:grid;grid-template-columns:56px 1fr;grid-template-rows:auto auto auto;column-gap:16px}.stat-card b{font-size:28px}.stat-card small{color:var(--muted);font-weight:700}.stat-card i{font-style:normal;color:#26b35d;font-size:12px;font-weight:800}.stat-icon{grid-row:1/4;width:48px;height:48px;border-radius:15px;display:flex;align-items:center;justify-content:center;font-size:22px}.purple{background:#eee8ff;color:#7b52f6}.blue{background:#e7f0ff;color:#1673f7}.pink{background:#ffe9f2;color:#ff4f8d}.green{background:#e9f8ee;color:#18b65b}.hero-card{position:relative;border-radius:14px;overflow:hidden;min-height:200px;background:#f1eaff;box-shadow:var(--shadow);border:1px solid #eee6ff}.hero-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.96}.hero-copy{position:relative;padding:30px}.hero-copy h2{font-size:22px;margin:0 0 12px}.hero-copy p{color:#737b91;font-weight:700}.dashboard{display:grid;grid-template-columns:1fr 480px;gap:28px;margin-top:28px}.big{padding:24px}.recent-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.image-card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 10px 24px rgba(20,30,50,.05)}.image-card img{width:100%;height:170px;object-fit:cover;display:block}.image-card button{position:absolute;right:10px;top:10px;width:34px;height:28px;background:rgba(255,255,255,.72);border-radius:18px;color:#6b7180}.image-card b,.image-card small{display:block;padding:10px 12px 0}.image-card small{padding:6px 12px 14px;color:var(--muted)}.inspiration{margin-top:28px}.home-side{display:flex;flex-direction:column;gap:16px}.home-side .panel{padding:20px}.quick-tools{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.quick-tools button{height:76px;border:1px solid var(--line);border-radius:12px;background:var(--card);font-weight:800;color:var(--text)}.quick-tools span{display:block;margin-top:8px;font-size:12px}.list-panel p{display:flex;justify-content:space-between;color:var(--text);font-weight:700}.list-panel span{color:var(--muted)}
.scene-grid{display:grid;grid-template-columns:320px minmax(630px,1fr) 260px;gap:16px}.controls{padding:20px}.controls label{display:block;color:var(--muted);font-weight:700;margin:12px 0 6px}.controls select,.controls textarea,.filter-row input,.workflow-menu input,.modal input{width:100%;border:1px solid var(--line);background:var(--card);border-radius:9px;height:36px;padding:0 12px;color:var(--text)}.controls textarea{height:96px;resize:none;padding:10px}.counter{text-align:right;color:var(--muted);font-size:12px}.preset-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}.preset-row button,.chips button,.tabs button,.output button{height:38px;border-radius:7px;background:#f5f6fa;font-weight:800;color:#3c4355}.dark .preset-row button,.dark .chips button,.dark .tabs button,.dark .output button{background:#182033;color:var(--text)}.preset-row .selected,.chips .active,.tabs .active,.output .selected,.filter-row .selected,.seg .active{border:1px solid #b99dff!important;background:#f4efff!important;color:var(--purple)!important}.dark .preset-row .selected,.dark .chips .active,.dark .tabs .active,.dark .output .selected,.dark .filter-row .selected,.dark .seg .active{background:#251c43!important}
.slider-line,.mini-slider{display:grid;grid-template-columns:72px 1fr 30px;align-items:center;gap:10px;margin:10px 0}.slider-line span,.mini-slider span{color:var(--muted);font-size:13px}.slider-line b,.mini-slider b{font-size:13px}input[type=range]{accent-color:var(--purple)}hr{border:0;border-top:1px solid var(--line);margin:18px 0}.upload-box{height:96px;border:1px dashed #cbd2e4;border-radius:10px;background:var(--card);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:var(--muted);position:relative;overflow:hidden}.upload-box input{position:absolute;inset:0;opacity:0;cursor:pointer}.upload-box span{font-size:24px;color:#7d84a0}.upload-list{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}.upload-list img{width:42px;height:42px;object-fit:cover;border-radius:6px;border:1px solid var(--line)}
.editor-card{border:1px solid var(--line);border-radius:14px;background:var(--card);box-shadow:var(--shadow);padding:14px}.toolbar{height:42px;display:flex;gap:6px;overflow:hidden}.toolbar button{height:34px;padding:0 13px;border:1px solid var(--line);background:var(--card);border-radius:8px;color:var(--text);font-weight:800}.canvas-area{height:585px;position:relative;background:#f7f8fb;border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden}.dark .canvas-area{background:#0d1422}.main-preview{width:100%;height:100%;object-fit:cover;transition:.25s;transform-origin:center}.mask-canvas{position:absolute;inset:0;width:100%;height:100%;display:none}.mask-canvas.active{display:block}.placeholder-text{position:absolute;display:none;text-align:center;color:#667085;font-size:22px;font-weight:900}.main-preview[src=""]+.mask-canvas+.placeholder-text{display:block}.thumb-strip{position:absolute;left:10px;top:18px;z-index:2;display:flex;flex-direction:column;gap:10px}.thumb-strip img{width:64px;height:64px;object-fit:cover;border-radius:8px;border:2px solid #fff;box-shadow:0 10px 22px rgba(0,0,0,.15);cursor:pointer}.thumb-strip img:first-child{border-color:#fff}.zoom-bar{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);height:52px;padding:0 24px;background:rgba(255,255,255,.92);backdrop-filter:blur(15px);border-radius:14px;display:flex;align-items:center;gap:16px;box-shadow:0 16px 35px rgba(40,50,70,.16);font-size:18px}.dark .zoom-bar{background:rgba(17,24,39,.88)}.zoom-bar button{font-size:18px;font-weight:900}
.workflow-row{margin-top:16px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.workflow-row button{height:72px;border:1px solid var(--line);border-radius:10px;background:var(--card);text-align:left;padding:14px;color:var(--text)}.workflow-row b,.workflow-row small{display:block}.workflow-row small{color:var(--muted);margin-top:5px}.right-stack{display:flex;flex-direction:column;gap:12px}.right-stack .panel{padding:18px}.layers{list-style:none;margin:0;padding:0}.layers li{display:flex;justify-content:space-between;color:var(--text);font-weight:700;padding:8px 0}.layers span{color:var(--purple);cursor:pointer}.ai-tools{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.ai-tools button{height:52px;background:#f6f7fb;border-radius:8px;color:#2d3345}.dark .ai-tools button{background:#182033;color:var(--text)}.ai-tools span{display:block;font-size:11px;margin-top:3px}.output{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.output h3{grid-column:1/-1}.output .primary{grid-column:1/-1}
.library-card{padding:18px 14px 24px}.tabs{display:flex;gap:12px;margin-bottom:18px}.tabs button{padding:0 24px}.filter-row{display:flex;gap:10px;align-items:center;margin-bottom:22px}.filter-row input{max-width:380px}.filter-row button{height:36px;padding:0 18px;background:var(--card);border:1px solid var(--line);border-radius:8px;color:var(--text);font-weight:800}.filter-row span{flex:1}.category-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;margin-bottom:26px}.category-strip article{position:relative;height:116px;border-radius:9px;overflow:hidden;color:#fff;text-align:center;cursor:pointer}.category-strip img{width:100%;height:100%;object-fit:cover;filter:brightness(.68)}.category-strip b,.category-strip small{position:absolute;left:0;right:0}.category-strip b{top:44px}.category-strip small{top:72px}.chips{display:flex;gap:12px;margin:12px 0 24px;flex-wrap:wrap}.chips button{padding:0 22px}.masonry{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.masonry article{position:relative}.masonry img{width:100%;height:185px;object-fit:cover;border-radius:8px;display:block}.masonry button{position:absolute;right:10px;top:10px;width:34px;height:34px;background:rgba(255,255,255,.82);border-radius:9px;color:#f0a500}.load-more{display:block;margin:18px auto 0;background:var(--card);border:1px solid var(--line);color:var(--text)}
.workflow-page{display:grid;grid-template-columns:240px 1fr;gap:28px}.workflow-menu{padding:16px}.workflow-menu p{display:flex;justify-content:space-between;padding:10px 12px;border-radius:8px;color:var(--text);font-weight:800;cursor:pointer}.workflow-menu p.active{background:#f3efff;color:var(--purple)}.dark .workflow-menu p.active{background:#251c43}.custom-box{margin-top:20px;background:#f5f0ff;border-radius:14px;padding:18px;color:#5b506d}.custom-box small{display:block;line-height:1.6;margin:8px 0 16px}.workflow-main{padding:20px}.skill-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:24px}.skill-grid article{min-height:205px;border:1px solid var(--line);border-radius:12px;background:var(--card);padding:18px}.skill-grid img,.text-logo,.ppt,.palette,.feather{width:64px;height:54px;border-radius:8px;object-fit:cover;margin-bottom:12px;background:#f1efff;display:flex;align-items:center;justify-content:center;color:#9d7cff;font-weight:900}.skill-grid h3{margin:0 0 8px}.skill-grid p{height:36px;margin:0 0 12px;color:var(--muted);font-size:13px}.skill-grid button{height:34px;border:1px solid var(--line);border-radius:7px;width:100%;color:var(--purple);font-weight:800}.palette{background:linear-gradient(90deg,#efa18e 0 25%,#d0c9c9 25% 50%,#f0d890 50% 75%,#cde0de 75%)}.mini-skills{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.mini-skills button{height:90px;border:1px solid var(--line);background:var(--card);border-radius:12px;color:var(--text);font-weight:800}
.favorite-panel{padding:18px 14px 28px}.counts b{background:#f0ebff;color:var(--purple);border-radius:8px;padding:2px 8px;margin-left:6px}.favorite-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}.favorite-grid article{position:relative;border:1px solid var(--line);border-radius:10px;background:var(--card);overflow:hidden;box-shadow:0 12px 25px rgba(20,30,50,.04)}.favorite-grid img{width:100%;height:210px;object-fit:cover}.favorite-grid label{position:absolute;left:12px;top:12px;background:#eee9ff;color:var(--purple);font-weight:800;border-radius:5px;padding:5px 10px}.starbtn{position:absolute;right:12px;top:12px;background:#fff3cc;color:#e5a900;width:28px;height:28px;border-radius:7px}.favorite-grid b,.favorite-grid small{display:block;padding:10px 12px 0}.favorite-grid small{padding-bottom:15px;color:var(--muted)}.pagination{display:flex;justify-content:center;gap:16px;margin-top:28px}.pagination button{width:34px;height:34px;border-radius:8px}.pagination .active{background:#f0ebff;color:var(--purple)}
.settings-grid{display:grid;grid-template-columns:230px 1fr 400px;gap:24px}.settings-menu{padding:16px}.settings-menu p{padding:12px 16px;border-radius:8px;color:var(--text);font-weight:800}.settings-menu .active{background:#f4efff;color:var(--purple)}.account-panel{padding:22px}.profile-row,.plan-row{display:flex;align-items:center;gap:20px;border:1px solid var(--line);border-radius:12px;padding:24px;margin-bottom:24px}.profile-row .ghost,.plan-row .ghost{margin-left:auto}.w-big{width:72px;height:72px;border-radius:50%;background:#ff9f25;color:#fff;display:flex;align-items:center;justify-content:center;font-size:34px}.profile-row b,.profile-row small,.plan-row b,.plan-row small{display:block}.profile-row em{font-style:normal;background:#eee7ff;color:var(--purple);padding:4px 8px;border-radius:6px;font-size:12px}.plan-row span{width:44px;height:44px;border-radius:10px;background:linear-gradient(135deg,#7b52f6,#8a6dff);color:#fff;display:flex;align-items:center;justify-content:center;font-size:26px}.setting-line{display:grid;grid-template-columns:180px 1fr;align-items:center;border-bottom:1px solid var(--line);padding:12px 0}.setting-line select{height:36px;border:1px solid var(--line);border-radius:8px;background:var(--card);padding:0 12px;color:var(--text)}.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:0}.seg button{height:34px;border:1px solid var(--line);background:var(--card)}.switch input{display:none}.switch i{display:block;width:38px;height:22px;background:var(--purple);border-radius:20px;position:relative;margin-left:auto}.switch i:after{content:"";position:absolute;right:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff}.settings-side{display:flex;flex-direction:column;gap:16px}.settings-side .panel{padding:20px}.settings-side p{display:flex;justify-content:space-between;color:var(--text)}.settings-side button{border:1px solid var(--line);border-radius:7px;padding:5px 16px;color:var(--purple)}.logout{color:#f05a66!important;border-color:#ffbec6!important}.donut{width:92px;height:92px;border-radius:50%;background:conic-gradient(var(--purple) 45%,#eee 0);display:flex;align-items:center;justify-content:center;color:#6f58d8;font-size:24px;font-weight:900;margin:4px 20px 10px 0;float:left}
mark{background:#fff1b8;color:#d7a000;border-radius:6px;padding:5px 10px;font-size:14px;margin-left:10px}.pro-grid{display:grid;grid-template-columns:1fr 380px;gap:24px}.pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.pricing article{min-height:510px;border:1px solid var(--line);border-radius:14px;background:var(--card);box-shadow:var(--shadow);padding:30px}.pricing .hot{border-color:#b99dff}.pricing label{background:#eee9ff;color:var(--purple);border-radius:7px;padding:7px 12px;font-weight:800}.pricing .gold label{background:#fff4c8;color:#d79a00}.pricing h2{margin:28px 0 12px}.price{font-size:20px}.price b{font-size:42px}.price small{color:var(--muted);margin-left:10px}.pricing li{margin:17px 0;color:var(--text);font-weight:700}.pricing li:before{content:"●";color:var(--purple);margin-right:9px}.gold li:before{color:#e5a900}.pro-side{display:flex;flex-direction:column;gap:24px}.pro-side .panel,.pay{padding:24px}.pro-side table{width:100%;border-collapse:collapse}.pro-side td,.pro-side th{padding:12px;border-bottom:1px solid var(--line);text-align:center}.pro-side th:first-child,.pro-side td:first-child{text-align:left}.pay{grid-column:1/2}.pay button{height:62px;border:1px solid var(--line);border-radius:9px;background:var(--card);padding:0 28px;margin-right:14px;font-weight:800}.pay .active{border-color:#b99dff;color:var(--purple);background:#faf8ff}
.modal{position:fixed;inset:0;background:rgba(20,26,38,.35);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;z-index:100}.modal.show{display:flex}.modal-card{width:480px;background:var(--card);border-radius:18px;padding:28px;box-shadow:0 35px 80px rgba(20,30,50,.26);position:relative;border:1px solid var(--line)}.modal-card .close{position:absolute;right:18px;top:15px;font-size:24px;color:var(--muted)}.modal-card h2{margin:0 0 18px}.modal-card label{display:block;margin:12px 0 6px;color:var(--muted)}.modal-card input{height:42px}.modal-actions{display:flex;gap:12px;margin-top:20px}.modal-actions button{flex:1}.modal-text{line-height:1.8;color:var(--muted)}.login-card{width:720px}.login-grid{display:grid;grid-template-columns:260px 1fr;gap:28px}.qr-box{border:1px solid var(--line);border-radius:14px;padding:20px;text-align:center}.fake-qr{width:150px;height:150px;margin:0 auto 16px;background:
  linear-gradient(90deg,#111 10px,transparent 10px 18px,#111 18px 26px,transparent 26px 40px,#111 40px 50px,transparent 50px),
  linear-gradient(#111 10px,transparent 10px 18px,#111 18px 26px,transparent 26px 40px,#111 40px 50px,transparent 50px),#fff;background-size:50px 50px;border:12px solid #fff;box-shadow:inset 0 0 0 1px #ddd}.code-row{display:grid;grid-template-columns:1fr 110px;gap:10px}.payment-card{text-align:center}.payqr{margin:20px auto}.progress-overlay{position:fixed;inset:0;background:rgba(255,255,255,.62);backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center;z-index:150}.progress-overlay.show{display:flex}.progress-card{width:360px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:18px;padding:30px;text-align:center}.spinner{width:42px;height:42px;border-radius:50%;border:4px solid #eee;border-top-color:var(--purple);animation:spin 1s linear infinite;margin:0 auto 16px}@keyframes spin{to{transform:rotate(360deg)}}.bar{height:8px;background:#eee;border-radius:20px;overflow:hidden}.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#8756ff,#57d5ff);transition:.25s}.toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%) translateY(80px);background:#171b27;color:#fff;border-radius:12px;padding:13px 22px;box-shadow:0 20px 40px rgba(0,0,0,.2);transition:.25s;z-index:101}.toast.show{transform:translateX(-50%) translateY(0)}
@media(max-width:1350px){.scene-grid{grid-template-columns:310px 1fr}.right-stack{display:none}.home-grid,.dashboard,.pro-grid,.settings-grid{grid-template-columns:1fr}.home-side{display:grid;grid-template-columns:repeat(3,1fr)}.skill-grid{grid-template-columns:repeat(3,1fr)}}


/* v4 修复：防止左上角品牌文字覆盖页面标题 */
.brand-mini{
  display:none !important;
}

/* v4 修复：主内容安全留白，避免标题与顶部操作区重叠 */
.main{
  padding-top: 8px;
}

.top-actions{
  top: 66px;
}

/* v4 修复：所有可交互元素有明确反馈 */
button, .category-strip article, .masonry img, .image-card, .favorite-grid article{
  user-select:none;
}
button:active{
  transform: translateY(1px);
}
button:hover{
  filter: brightness(.985);
}

/* v4 修复：上传区、编辑区更像真正产品，不出现文字挤压 */
.upload-box b,
.upload-box small{
  pointer-events:none;
}

/* v4 修复：侧栏固定宽度时不压住页面 */
@media(max-width:1200px){
  .main{min-width:1100px;}
}


/* v5 修复：彻底解决预览区底部文字/缩放条重叠 */
.canvas-area{
  height:520px !important;
  margin-bottom:12px;
}
.zoom-bar{
  display:none !important;
}
.editor-status{
  position:absolute;
  left:18px;
  bottom:18px;
  min-width:220px;
  height:34px;
  padding:0 14px;
  border-radius:12px;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(233,236,244,.9);
  box-shadow:0 10px 24px rgba(25,35,55,.12);
  display:flex;
  align-items:center;
  font-size:13px;
  color:#596276;
  z-index:6;
  backdrop-filter:blur(12px);
}
.dark .editor-status{
  background:rgba(17,24,39,.88);
  color:#d9deea;
}
.zoom-control-row{
  height:48px;
  margin:8px auto 4px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
}
.zoom-control-row button,
.zoom-control-row b{
  min-width:54px;
  height:36px;
  padding:0 14px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--card);
  color:var(--text);
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 6px 18px rgba(30,40,60,.04);
}
.zoom-control-row b{
  min-width:78px;
}
.toolbar button.active-tool{
  border-color:#b99dff !important;
  background:#f4efff !important;
  color:#7b52f6 !important;
}
.dark .toolbar button.active-tool{
  background:#251c43 !important;
}
.text-layer{
  display:none;
  position:absolute;
  left:50%;
  top:46%;
  transform:translate(-50%,-50%);
  min-width:120px;
  padding:10px 18px;
  border:1px dashed rgba(123,82,246,.8);
  border-radius:12px;
  background:rgba(255,255,255,.72);
  color:#9b7a43;
  font-size:30px;
  font-weight:700;
  text-align:center;
  outline:none;
  z-index:7;
  cursor:text;
}
.text-layer.show{
  display:block;
}
.mask-canvas.active{
  display:block !important;
  z-index:5;
  cursor:crosshair;
}
.tool-flash{
  animation: toolFlash .28s ease;
}
@keyframes toolFlash{
  0%{transform:scale(1)}
  50%{transform:scale(.985)}
  100%{transform:scale(1)}
}
.editor-card{
  overflow:visible;
}
.workflow-row.compact{
  margin-top:10px !important;
}


/* v6 工具抽屉：参考用户提供的多角度 / 橡皮工具面板 */
.tool-drawer{
  position:fixed;
  right:22px;
  top:118px;
  width:252px;
  max-height:calc(100vh - 150px);
  background:rgba(255,255,255,.96);
  border:1px solid var(--line);
  box-shadow:0 24px 70px rgba(21,31,50,.16);
  border-radius:15px;
  z-index:80;
  overflow:hidden;
  display:none;
  backdrop-filter:blur(18px);
}
.dark .tool-drawer{
  background:rgba(17,24,39,.96);
}
.tool-drawer.show{
  display:block;
}
.tool-drawer-head{
  height:46px;
  padding:0 12px 0 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
}
.tool-drawer-head h3{
  margin:0;
  font-size:14px;
  font-weight:900;
}
.tool-drawer-head button{
  width:30px;
  height:30px;
  border-radius:8px;
  color:var(--muted);
}
.tool-drawer-body{
  padding:12px;
}
.tool-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  background:#f4f5f8;
  padding:3px;
  border-radius:8px;
  margin-bottom:12px;
}
.dark .tool-tabs{
  background:#1c2638;
}
.tool-tabs button{
  height:30px;
  border-radius:7px;
  font-weight:800;
  font-size:13px;
  color:var(--muted);
}
.tool-tabs button.active{
  background:var(--card);
  color:var(--text);
  box-shadow:0 8px 20px rgba(20,30,50,.06);
}
.tool-preview-box{
  height:205px;
  border-radius:12px;
  background:#f8f8fa;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  margin-bottom:12px;
  position:relative;
}
.dark .tool-preview-box{
  background:#101827;
}
.cube-stage{
  width:118px;
  height:118px;
  position:relative;
  transform-style:preserve-3d;
  transform:rotateX(-22deg) rotateY(45deg) scale(.85);
  transition:.2s;
}
.cube-face{
  position:absolute;
  width:118px;
  height:118px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(215,219,229,.85);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.cube-face.front{transform:translateZ(59px)}
.cube-face.back{transform:rotateY(180deg) translateZ(59px)}
.cube-face.right{transform:rotateY(90deg) translateZ(59px)}
.cube-face.left{transform:rotateY(-90deg) translateZ(59px)}
.cube-face.top{transform:rotateX(90deg) translateZ(59px)}
.cube-face.bottom{transform:rotateX(-90deg) translateZ(59px)}
.cube-face img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.tool-line{
  display:grid;
  grid-template-columns:64px 1fr 42px;
  gap:8px;
  align-items:center;
  margin:13px 0;
}
.tool-line span{
  font-size:13px;
  color:var(--text);
}
.tool-line b{
  text-align:right;
  color:var(--muted);
  font-size:13px;
}
.tool-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:12px;
}
.tool-actions button{
  height:34px;
  border-radius:8px;
  border:1px solid var(--line);
  background:var(--card);
  color:var(--text);
  font-weight:800;
}
.tool-actions button.apply{
  background:#e9ebef;
  color:#9aa1af;
}
.tool-actions button.apply.enabled,
.tool-actions button.primary-apply{
  background:linear-gradient(135deg,#8756ff,#6659f6);
  color:white;
  border:0;
}
.bg-options{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  margin:10px 0 12px;
}
.bg-swatch{
  height:42px;
  border-radius:9px;
  border:1px solid var(--line);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.55);
}
.bg-upload-label{
  height:36px;
  border-radius:8px;
  border:1px dashed #b7bfd2;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--muted);
  font-weight:800;
  margin-bottom:10px;
  cursor:pointer;
}
.bg-upload-label input{display:none}
.cutout-preview{
  width:100%;
  height:150px;
  border-radius:12px;
  background-image:linear-gradient(45deg,#ddd 25%,transparent 25%),linear-gradient(-45deg,#ddd 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ddd 75%),linear-gradient(-45deg,transparent 75%,#ddd 75%);
  background-size:18px 18px;
  background-position:0 0,0 9px,9px -9px,-9px 0;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  margin:8px 0 12px;
}
.cutout-preview img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
}
.bg-quick{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:7px;
  margin:10px 0 12px;
}
.bg-quick button,
.bg-quick label{
  height:30px;
  border-radius:7px;
  border:1px solid var(--line);
  background:var(--card);
  color:var(--text);
  font-size:12px;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.bg-quick label{
  grid-column:span 2;
}
.bg-quick input{display:none}
.edit-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:none;
  z-index:4;
  pointer-events:none;
}
.edit-canvas.active{
  display:block;
}
.canvas-area.has-bg{
  background-size:cover!important;
  background-position:center!important;
}
.eraser-cursor{
  cursor:crosshair!important;
}


/* v7 重叠修复 */
.hero-card{
  display:flex !important;
  align-items:center;
  min-height:240px !important;
  padding:0 !important;
  isolation:isolate;
}
.hero-card img{
  position:absolute !important;
  inset:auto 0 0 auto !important;
  width:48% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:right center !important;
  opacity:.95 !important;
  z-index:0;
}
.hero-copy{
  position:relative !important;
  z-index:2 !important;
  width:52%;
  max-width:420px;
  padding:34px 32px !important;
}
.hero-copy h2{
  margin:0 0 12px !important;
  font-size:22px !important;
  line-height:1.22 !important;
  letter-spacing:0 !important;
  font-weight:900 !important;
  max-width:250px;
  word-break:keep-all;
}
.hero-copy p{
  margin:0 0 18px !important;
  line-height:1.5;
  max-width:260px;
}

/* 最近生成 / 灵感推荐卡片防重叠 */
.recent-grid{
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr)) !important;
}
.image-card{
  min-width:0;
}
.image-card button{
  z-index:4 !important;
  right:10px !important;
  top:10px !important;
  width:32px !important;
  height:32px !important;
  border-radius:16px !important;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 4px 14px rgba(0,0,0,.08);
}

/* 素材库瀑布流按钮与标签防重叠 */
.masonry{
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr)) !important;
}
.masonry article{
  position:relative;
  min-width:0;
}
.masonry button{
  z-index:4 !important;
  right:10px !important;
  top:10px !important;
  width:32px !important;
  height:32px !important;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px !important;
  box-shadow:0 4px 14px rgba(0,0,0,.08);
}
.masonry article label,
.masonry article .tag,
.favorite-grid article label{
  max-width:calc(100% - 58px) !important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* 收藏夹防重叠 */
.favorite-grid{
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr)) !important;
}
.favorite-grid article{
  min-width:0;
}
.starbtn{
  z-index:4 !important;
  right:12px !important;
  top:12px !important;
  width:30px !important;
  height:30px !important;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 4px 14px rgba(0,0,0,.08);
}
.favorite-grid label{
  padding-right:8px;
  max-width:calc(100% - 58px) !important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* 通用角标保护 */
.image-card button,
.masonry button,
.starbtn{
  flex-shrink:0;
}
.panel.big,
.library-card,
.favorite-panel{
  overflow:hidden;
}

/* 小屏幕优化 */
@media (max-width: 1280px){
  .hero-card img{
    width:44% !important;
  }
  .hero-copy{
    width:56%;
  }
}


/* v8 修复：去掉卡片右上角重复常驻按钮，只在鼠标悬停时显示 */
.image-card button,
.masonry button,
.starbtn{
  opacity:0 !important;
  pointer-events:none !important;
  transform:translateY(-3px) scale(.96);
  transition:opacity .18s ease, transform .18s ease, background .18s ease;
}

.image-card:hover button,
.masonry article:hover button,
.favorite-grid article:hover .starbtn{
  opacity:1 !important;
  pointer-events:auto !important;
  transform:translateY(0) scale(1);
}

/* 首页最近生成不再出现一排重复的灰色圆点 */
.recent-grid .image-card button{
  background:rgba(255,255,255,.88) !important;
  color:#737b91 !important;
}

/* 素材库/收藏夹角标层级修复，避免与标题、图片标签挤在一起 */
.masonry article,
.favorite-grid article,
.image-card{
  isolation:isolate;
}

.image-card img,
.masonry img,
.favorite-grid img{
  position:relative;
  z-index:1;
}

.image-card button,
.masonry button,
.starbtn,
.favorite-grid label{
  z-index:3 !important;
}

/* 收藏标签左上显示，星标右上悬停显示，互不重叠 */
.favorite-grid label{
  right:auto !important;
  left:12px !important;
  max-width:calc(100% - 64px) !important;
}

/* 素材库图片默认不显示星标，鼠标移入再显示，视觉更干净 */
.masonry button{
  background:rgba(255,255,255,.9) !important;
}

/* 如果是触屏设备，没有 hover，则长按/点击仍可通过卡片打开，角标不常驻 */
@media (hover:none){
  .image-card button,
  .masonry button,
  .starbtn{
    display:none !important;
  }
}


/* v9：右上角 ... 可打开菜单，星星可点击收藏 */
.card-action-menu{
  position:fixed;
  width:148px;
  background:rgba(255,255,255,.96);
  border:1px solid var(--line);
  box-shadow:0 18px 45px rgba(20,30,50,.16);
  border-radius:12px;
  padding:7px;
  display:none;
  z-index:300;
  backdrop-filter:blur(18px);
}
.dark .card-action-menu{
  background:rgba(17,24,39,.96);
}
.card-action-menu.show{
  display:block;
}
.card-action-menu button{
  width:100%;
  height:34px;
  border-radius:8px;
  padding:0 10px;
  text-align:left;
  color:var(--text);
  font-size:13px;
  font-weight:800;
}
.card-action-menu button:hover{
  background:#f4f1ff;
  color:var(--purple);
}
.dark .card-action-menu button:hover{
  background:#251c43;
}
.card-action-menu .danger{
  color:#f05a66;
}

/* 覆盖 v8 隐藏规则：最近生成的 ... 保持可点击 */
.recent-grid .image-card button[data-card-menu],
.image-card button[data-card-menu]{
  opacity:1 !important;
  pointer-events:auto !important;
  transform:none !important;
  background:rgba(255,255,255,.82) !important;
  color:#6f7585 !important;
}
.image-card button[data-card-menu]:hover{
  background:#fff !important;
  color:var(--purple) !important;
}

/* 素材库星星：默认可见且可点击，不遮挡标签 */
.masonry button[data-fav-img],
.favorite-grid .starbtn{
  opacity:1 !important;
  pointer-events:auto !important;
  transform:none !important;
  background:rgba(255,255,255,.9) !important;
  color:#f3a900 !important;
}
.masonry button[data-fav-img]:hover,
.favorite-grid .starbtn:hover{
  background:#fff !important;
  transform:scale(1.04) !important;
}

/* 收藏后的星星状态 */
button.is-favorited{
  background:#fff3cc !important;
  color:#e6a400 !important;
  box-shadow:0 0 0 2px rgba(255,211,106,.55), 0 8px 20px rgba(20,30,50,.12) !important;
}

/* 触屏设备也保留可点击星星和 ... */
@media (hover:none){
  .image-card button[data-card-menu],
  .masonry button[data-fav-img],
  .favorite-grid .starbtn{
    display:flex !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }
}


/* v10 按用户反馈清理和补全交互 */
#exportBtn{
  display:none !important;
}

/* 首页最近生成的 ... 去掉 */
.recent-grid .image-card button[data-card-menu]{
  display:none !important;
}

/* 首页最近生成卡片可直接点击 */
.recent-grid .image-card{
  cursor:pointer;
}

/* 首页快速工具整块隐藏 */
.home-side .panel.hide-home-quick{
  display:none !important;
}

/* 场景页缩略图切换可点击 */
.thumb-strip{
  z-index:10 !important;
  pointer-events:auto !important;
}
.thumb-strip img{
  cursor:pointer !important;
  transition:transform .16s ease, box-shadow .16s ease, outline .16s ease;
}
.thumb-strip img:hover{
  transform:scale(1.03);
}
.thumb-strip img.active{
  outline:2px solid var(--purple);
  border-color:var(--purple) !important;
  box-shadow:0 8px 18px rgba(123,82,246,.22);
}

/* 素材库分类卡片可点击与选中状态 */
.category-strip article{
  cursor:pointer;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
  border:1px solid transparent;
}
.category-strip article:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(20,30,50,.08);
}
.category-strip article.active{
  border-color:#bba4ff;
  box-shadow:0 12px 26px rgba(123,82,246,.16);
}
.category-strip article.active::after{
  content:'已打开';
  position:absolute;
  right:10px;
  top:10px;
  font-size:11px;
  font-weight:800;
  color:#fff;
  background:rgba(123,82,246,.9);
  padding:3px 8px;
  border-radius:999px;
}

/* 设置页左侧菜单可切换 */
.settings-menu p{
  cursor:pointer;
  transition:background .16s ease,color .16s ease,transform .16s ease;
}
.settings-menu p:hover{
  background:#f7f3ff;
  color:var(--purple);
  transform:translateX(1px);
}
.dark .settings-menu p:hover{
  background:#251c43;
}

/* 设置动态内容的小样式 */
.settings-main-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.settings-block{
  border:1px solid var(--line);
  background:var(--card);
  border-radius:12px;
  padding:18px;
}
.settings-block h4{
  margin:0 0 12px;
  font-size:15px;
}
.settings-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:40px;
  padding:8px 0;
  border-bottom:1px dashed rgba(210,216,228,.8);
}
.settings-row:last-child{
  border-bottom:0;
}
.settings-row span{
  color:var(--muted);
  font-size:13px;
}
.settings-chip{
  height:30px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid var(--line);
  background:var(--card);
  font-size:12px;
  font-weight:800;
}
.settings-switch-dot{
  width:42px;
  height:24px;
  border-radius:999px;
  background:#e4dbff;
  position:relative;
}
.settings-switch-dot::after{
  content:'';
  position:absolute;
  top:3px;
  left:21px;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#7b52f6;
}
.settings-help{
  color:var(--muted);
  font-size:13px;
  line-height:1.7;
}


/* v11 工具面板升级 */
.tool-choice-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin:10px 0 12px;
}
.tool-choice{
  height:40px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--card);
  color:var(--text);
  font-weight:800;
  font-size:13px;
}
.tool-choice.active{
  background:#f3efff;
  color:var(--purple);
  border-color:#b9a0ff;
  box-shadow:0 8px 20px rgba(123,82,246,.12);
}
.dark .tool-choice.active{
  background:#251c43;
}
.tool-note{
  font-size:12px;
  line-height:1.7;
  color:var(--muted);
  margin-bottom:8px;
}
.select-mode{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:10px 0 12px;
}
.select-mode button{
  height:36px;
  border-radius:9px;
  border:1px solid var(--line);
  background:var(--card);
  color:var(--text);
  font-weight:800;
}
.select-mode button.active{
  background:#f3efff;
  color:#7b52f6;
  border-color:#b9a0ff;
}
.dark .select-mode button.active{
  background:#251c43;
}
.text-edit-row{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:10px 0;
}
.text-edit-row label{
  font-size:12px;
  color:var(--muted);
  font-weight:700;
}
.text-edit-row input,
.text-edit-row textarea,
.text-edit-row select{
  width:100%;
  min-height:38px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--card);
  color:var(--text);
  padding:9px 12px;
  font-size:13px;
}
.text-edit-row textarea{
  min-height:72px;
  resize:vertical;
}
.ocr-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:10px 0 12px;
}
.ocr-item{
  min-height:30px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid var(--line);
  background:var(--card);
  color:var(--text);
  font-size:12px;
  font-weight:800;
}
.ocr-item.active{
  background:#f3efff;
  color:#7b52f6;
  border-color:#b9a0ff;
}
.mini-preview-note{
  margin-top:6px;
  font-size:12px;
  color:var(--muted);
}


/* v12 adjust / crop / selection */
.select-mode.icon-style{
  grid-template-columns:repeat(2,46px);
  justify-content:flex-start;
}
.select-mode.icon-style button{
  width:46px;
  height:46px;
  border-radius:50%;
  font-size:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#2d3340;
  color:#fff;
  border:0;
  box-shadow:0 10px 24px rgba(18,22,30,.18);
}
.select-mode.icon-style button.active{
  background:#4b5568;
  color:#fff;
  box-shadow:0 0 0 2px rgba(255,255,255,.2) inset, 0 10px 24px rgba(18,22,30,.18);
}
.crop-size-row{
  display:grid;
  grid-template-columns:1fr 28px 1fr;
  gap:10px;
  align-items:center;
  margin-bottom:14px;
}
.crop-size-box{
  height:42px;
  border-radius:10px;
  border:1px solid var(--line);
  background:var(--card);
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 12px;
}
.crop-size-box b{font-size:13px;color:var(--muted)}
.crop-size-box input{
  width:100%;border:0;background:transparent;color:var(--text);font-weight:800;font-size:14px;outline:none;
}
.crop-link{
  width:28px;height:28px;border-radius:8px;border:1px solid var(--line);background:var(--card);display:flex;align-items:center;justify-content:center;color:#7b52f6;font-weight:900;
}
.crop-preset-title{
  font-size:13px;font-weight:900;margin:4px 0 10px;
}
.crop-preset-list{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.crop-preset-item{
  display:flex;align-items:center;gap:10px;height:34px;padding:0 6px;border-radius:8px;cursor:pointer;
}
.crop-preset-item:hover{background:rgba(123,82,246,.05)}
.crop-preset-item .tick{width:14px;text-align:center;color:#7b52f6;font-weight:900}
.crop-preset-item .box{width:14px;height:14px;border:1px solid #9ea6b6;border-radius:3px;background:#fff;display:inline-block}
.crop-preset-item.active .box{border-color:#7b52f6;box-shadow:inset 0 0 0 3px #fff;background:#7b52f6}
.crop-preset-item.active .tick{visibility:visible}
.crop-preset-item .tick{visibility:hidden}
.adjust-tabbar{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}
.adjust-tabbar button{
  height:38px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--muted);font-weight:900
}
.adjust-tabbar button.active{background:#f3efff;color:#7b52f6;border-color:#b9a0ff}
.adjust-panel-close{font-size:18px;line-height:1}
.tool-drawer-head .head-actions{display:flex;align-items:center;gap:8px}
.tool-drawer-head .head-actions button{width:28px;height:28px}


/* v13 修复：矩形框选 / 随意框选在图片上必须可见 */
.canvas-area{
  position:relative !important;
}
.mask-canvas{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  display:none;
  z-index:50 !important;
  pointer-events:none;
  background:transparent;
  touch-action:none;
}
.mask-canvas.active{
  display:block !important;
  pointer-events:auto !important;
  cursor:crosshair !important;
}
.main-preview{
  position:relative;
  z-index:1;
}
.thumb-strip,
.editor-status,
.zoom-control-row{
  z-index:70 !important;
}
.selection-hint{
  position:absolute;
  left:18px;
  top:18px;
  z-index:75;
  background:rgba(123,82,246,.92);
  color:white;
  height:30px;
  padding:0 12px;
  border-radius:999px;
  display:none;
  align-items:center;
  font-size:12px;
  font-weight:800;
  box-shadow:0 8px 22px rgba(123,82,246,.24);
}
.canvas-area.selecting .selection-hint{
  display:flex;
}


/* v15：去掉左上角三色窗口点 */
.mac-dots{
  display:none !important;
}

/* 去掉三色点后，让左侧头像位置自然上移 */
.avatar-y{
  margin-top:32px !important;
}

/* v15：多角度缩放明确为等比例缩放 */
.equal-scale-note{
  margin:8px 0 10px;
  padding:8px 10px;
  border-radius:10px;
  background:#f5f2ff;
  color:#7054d6;
  font-size:12px;
  font-weight:800;
  line-height:1.5;
}
.dark .equal-scale-note{
  background:#251c43;
  color:#cbbdff;
}


/* v16：真正等比例缩放，不再对主图应用 rotateX / rotateY 导致宽高视觉压缩 */
.main-preview.equal-scale-only{
  transform-origin:center center !important;
  object-fit:cover !important;
}
.equal-scale-warning{
  margin-top:6px;
  color:#8a6dff;
  font-size:12px;
  font-weight:800;
  line-height:1.6;
}


/* v17：多角度 XYZ 三轴锁定等比缩放 */
.xyz-scale-lock{
  margin:10px 0 12px;
  padding:10px;
  border-radius:12px;
  background:#f6f3ff;
  border:1px solid #e4dbff;
}
.dark .xyz-scale-lock{
  background:#251c43;
  border-color:#3a2a66;
}
.xyz-lock-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:12px;
  font-weight:900;
  color:#6f52d9;
  margin-bottom:8px;
}
.xyz-lock-title b{
  color:#7b52f6;
}
.xyz-axis-row{
  display:grid;
  grid-template-columns:22px 1fr 46px;
  align-items:center;
  gap:8px;
  height:28px;
  font-size:12px;
  color:var(--muted);
}
.xyz-axis-row input{
  width:100%;
  pointer-events:none;
  accent-color:#7b52f6;
}
.xyz-axis-row b{
  text-align:right;
  color:var(--text);
  font-size:12px;
}
.equal-scale-note strong{
  color:#7b52f6;
}


/* v18：首页独有顶部操作 */
.top-actions{
  transition:opacity .2s ease, transform .2s ease;
}
.top-actions.home-only-hidden{
  opacity:0;
  pointer-events:none;
  transform:translateY(-6px);
}

/* 右侧视频生成功能区 */
.video-panel .video-mode-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:12px;
}
.video-panel .video-mode-row button{
  height:38px;
  border-radius:10px;
  border:1px solid var(--line);
  background:var(--card);
  color:var(--text);
  font-weight:800;
}
.video-panel .video-mode-row button.selected{
  background:#f3efff;
  border-color:#b9a0ff;
  color:#7b52f6;
}
.video-textarea{
  width:100%;
  min-height:82px;
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px 12px;
  background:var(--card);
  color:var(--text);
  resize:vertical;
  margin-top:6px;
}
.frame-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:10px;
}
.frame-card{
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px;
  background:var(--card);
}
.frame-thumb{
  width:100%;
  aspect-ratio:4/5;
  border-radius:10px;
  overflow:hidden;
  background:#f5f5f7;
  margin-bottom:8px;
}
.frame-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.frame-card b{
  display:block;
  margin-bottom:8px;
  font-size:13px;
}
.frame-actions{
  display:grid;
  grid-template-columns:1fr;
  gap:6px;
}
.frame-actions button,
.frame-actions label{
  height:34px;
  border:1px solid var(--line);
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  background:var(--card);
  font-size:12px;
  font-weight:800;
  color:var(--text);
}
.frame-actions input{
  display:none;
}
.video-select-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:10px 0 0;
}
.video-select-row label{
  font-size:13px;
  font-weight:800;
}
.video-select-row select{
  width:110px;
  height:36px;
  border-radius:10px;
  border:1px solid var(--line);
  background:var(--card);
  color:var(--text);
  padding:0 10px;
}
.seedance-status{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:10px;
  font-size:13px;
  font-weight:800;
}
.seedance-status b{
  color:#7b52f6;
}
.video-output-panel .outline-btn.wide,
.video-output-panel .ghost.wide,
.video-output-panel .primary.wide{
  width:100%;
  margin-top:8px;
}


/* v19: remove unneeded seedance header controls and layer area spacing */
.right-stack{
  gap: 16px;
}
.video-output-panel{
  padding-top: 18px;
}
.video-output-panel h3{
  margin-bottom: 12px;
}


/* v20：智能生成改成单张效果图上传 */
.single-frame-zone{
  margin-top:10px;
}
.frame-card.single{
  max-width:none;
}
.single-thumb{
  aspect-ratio:3/4;
}


/* v21: workflow skills expansion */
.skill-extended-grid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:16px;
}
.skill-extended-grid button{
  min-height:88px;
}
.workflow-visual-grid{
  margin-top:14px;
}
.workflow-skill-card{
  position:relative;
  overflow:hidden;
  min-height:258px !important;
  padding:14px !important;
  border:1px solid rgba(200,206,228,.85) !important;
  border-radius:20px !important;
  background:linear-gradient(180deg,#ffffff 0%,#f8faff 100%) !important;
  box-shadow:0 12px 28px rgba(131,146,182,.10);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  text-align:left;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  outline:none !important;
}
.workflow-skill-card:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 30px rgba(131,146,182,.14);
  border-color:#c7bfff !important;
}
.workflow-skill-card:focus,
.workflow-skill-card:focus-visible,
.workflow-skill-card:active{
  outline:none !important;
  border-color:#c7bfff !important;
  box-shadow:0 0 0 1px rgba(128,97,255,.14), 0 14px 24px rgba(131,146,182,.12);
}
.workflow-skill-card .wf-icon{
  font-size:10px;
  color:#5b6794;
  margin-bottom:5px;
  line-height:1;
}
.workflow-skill-card b{
  font-size:11px;
  line-height:1.18;
  color:#151a33;
  margin-bottom:4px;
}
.workflow-skill-card small{
  font-size:9px;
  line-height:1.3;
  color:#69739a;
  display:block;
  min-height:24px;
}
.workflow-skill-card img{
  width:100%;
  height:104px;
  margin-top:auto;
  border-radius:12px;
  object-fit:cover;
  object-position:center 84%;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);
}
@media (max-width: 1280px){
  .skill-extended-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}

/* v21: universal skill upload modal */
.skill-upload-card{
  max-width:560px;
}
.skill-upload-box{
  margin-top:12px;
  position:relative;
  min-height:150px;
  border-radius:16px;
  border:1px dashed rgba(114,137,196,.5);
  background:linear-gradient(180deg, rgba(9,18,36,.98) 0%, rgba(7,14,28,.98) 100%);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:#fff;
  text-align:center;
  gap:6px;
  overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.skill-upload-box input{
  position:absolute;
  inset:0;
  opacity:0;
  cursor:pointer;
}
.skill-upload-icon{font-size:28px; opacity:.95;}
.skill-upload-box b{font-size:16px; font-weight:800;}
.skill-upload-box span{font-size:14px; color:#b7a9ff;}
.skill-upload-dual{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.skill-shot{display:flex;flex-direction:column;gap:8px;}
.skill-shot label{font-size:13px;font-weight:800;color:var(--text);}
.skill-shot-box,
.skill-upload-preview{position:relative;min-height:170px;border-radius:16px;overflow:hidden;border:1px solid var(--line);background:linear-gradient(180deg,#f8f9fc 0%,#eff2f9 100%);} 
.skill-shot-box img,
.skill-upload-preview img{width:100%;height:170px;object-fit:cover;display:block;}
.skill-shot-box em,
.skill-upload-preview em{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;font-style:normal;color:var(--muted);font-size:13px;font-weight:700;padding:12px;}
.skill-upload-preview.empty img{display:none;}
.skill-upload-actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:14px;}
.skill-upload-box.dragover{ border-color:#8a6dff; box-shadow:0 0 0 3px rgba(123,82,246,.18) inset; }


/* v22 API settings */
.api-card{max-width:760px}
.api-grid-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.api-group-title{margin:14px 0 8px;font-size:16px;font-weight:800;color:#24232c}
.api-tip{margin-top:10px;color:#7b7890;font-size:13px;line-height:1.6}
@media (max-width: 860px){.api-grid-two{grid-template-columns:1fr}}


/* v23 single-image multi-angle preview */
.angle-preview-shell{display:flex;align-items:center;justify-content:center}
.angle-stage{width:100%;height:100%;display:flex;align-items:center;justify-content:center;perspective:900px;overflow:hidden}
.angle-plane{width:170px;height:170px;border-radius:18px;transform-style:preserve-3d;transition:transform .18s ease;box-shadow:0 16px 30px rgba(35,28,78,.10)}
.angle-plane img{width:100%;height:100%;display:block;object-fit:cover;border-radius:18px;border:1px solid rgba(125,94,255,.10);background:#fff;box-shadow:0 12px 24px rgba(44,38,89,.12)}


/* v24 logs */
.log-card{max-width:860px}
.log-toolbar{display:flex;justify-content:flex-end;margin-bottom:10px}
.api-log-list{max-height:64vh;overflow:auto;display:flex;flex-direction:column;gap:10px}
.api-log-item{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff}
.api-log-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.api-log-head b{font-size:14px}
.api-log-meta{font-size:12px;color:var(--muted)}
.api-log-status{font-size:12px;font-weight:700;padding:4px 8px;border-radius:999px}
.api-log-status.ok{background:#ecfdf3;color:#067647}.api-log-status.fail{background:#fef3f2;color:#b42318}
.api-log-body pre{white-space:pre-wrap;word-break:break-word;margin:0;background:#f6f7fb;border-radius:12px;padding:10px;font-size:12px;color:#303043;max-height:220px;overflow:auto}


/* v27: RGB adjust + centered preview + video panel fixes */
.canvas-area{display:flex !important;align-items:center !important;justify-content:center !important;padding:12px 12px 12px 88px;}
.main-preview{display:block;position:relative;left:0;top:0;margin:0 auto;max-width:calc(100% - 116px);max-height:calc(100% - 24px);width:auto;height:auto;object-fit:contain;object-position:center center;transition:.25s;transform-origin:center center;}
.mask-canvas,.edit-canvas,.text-layer{position:absolute;inset:0;}
.thumb-strip{left:12px;top:18px;}
.mini-slider{display:grid;grid-template-columns:78px minmax(0,1fr) 46px;align-items:center;gap:10px;margin:10px 0;overflow:hidden}
.mini-slider b{text-align:right;justify-self:end;white-space:nowrap}
.video-output-panel{display:grid;grid-template-columns:1fr !important;gap:8px;overflow:hidden}
.video-output-panel h3{grid-column:1/-1}
.video-output-panel .outline-btn.wide,
.video-output-panel .ghost.wide,
.video-output-panel .primary.wide{grid-column:1/-1;white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}
.tool-drawer .tool-line{grid-template-columns:72px minmax(0,1fr) 44px}


/* v29 favorites interactions */
.mini-dropdown{position:absolute;min-width:150px;background:rgba(255,255,255,.98);border:1px solid var(--line);box-shadow:0 18px 48px rgba(28,38,64,.14);border-radius:12px;padding:6px;z-index:120;display:none;backdrop-filter:blur(12px)}
.dark .mini-dropdown{background:rgba(17,24,39,.98)}
.mini-dropdown.show{display:block}
.mini-dropdown button{display:block;width:100%;height:34px;text-align:left;padding:0 12px;border-radius:9px;color:var(--text);font-weight:700}
.mini-dropdown button:hover,.mini-dropdown button.active{background:#f4efff;color:var(--purple)}
.favorite-grid.list-view{grid-template-columns:1fr;gap:16px}
.favorite-grid.list-view article{display:grid;grid-template-columns:220px 1fr;align-items:stretch}
.favorite-grid.list-view img{height:160px}
.favorite-grid.list-view label{left:16px;top:16px}
.favorite-grid.list-view .fav-meta{display:flex;flex-direction:column;justify-content:center;padding-right:18px}
.favorite-grid.list-view b,.favorite-grid.list-view small{padding-left:18px;padding-right:18px}
.favorite-grid.list-view small{padding-bottom:0}
#favorite .counts button,#favorite .filter-row button{cursor:pointer}


/* v30 outpaint fit fix */
.canvas-area{width:100% !important;overflow:hidden !important;}
.main-preview{max-width:none !important;max-height:none !important;}


/* v31 cube angle preview + drag zoom + HSL adjust */
.canvas-area.is-panning,.canvas-area.is-panning *{cursor:grabbing !important;}
.angle-stage{perspective:1100px;}
.angle-cube{width:150px;height:150px;position:relative;transform-style:preserve-3d;transition:transform .18s ease;}
.cube-face{position:absolute;inset:0;border-radius:14px;overflow:hidden;background:#fff;border:1px solid rgba(125,94,255,.10);box-shadow:0 12px 24px rgba(44,38,89,.12)}
.cube-face img{width:100%;height:100%;display:block;object-fit:cover;filter:saturate(1.02)}
.cube-front{transform:translateZ(75px)}
.cube-back{transform:rotateY(180deg) translateZ(75px)}
.cube-right{transform:rotateY(90deg) translateZ(75px)}
.cube-left{transform:rotateY(-90deg) translateZ(75px)}
.cube-top{transform:rotateX(90deg) translateZ(75px)}
.cube-bottom{transform:rotateX(-90deg) translateZ(75px)}
.hsl-panel{display:flex;flex-direction:column;gap:12px;margin-top:10px}
.color-hsl-line{display:grid;grid-template-columns:70px minmax(0,1fr) 52px;gap:10px;align-items:center}
.color-hsl-line span{font-size:13px;color:var(--text);font-weight:700}
.color-slider-wrap{display:flex;align-items:center}
.color-gradient-slider{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:999px;background:var(--track-bg);outline:none}
.color-gradient-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;border:1px solid rgba(0,0,0,.2);box-shadow:0 1px 4px rgba(0,0,0,.3);cursor:pointer}
.color-gradient-slider::-moz-range-thumb{width:12px;height:12px;border:none;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.3);cursor:pointer}
.color-gradient-slider::-moz-range-track{height:4px;border-radius:999px;background:var(--track-bg)}
.color-num{height:24px;border:1px solid var(--line);border-radius:0;background:#fff;padding:0 6px;text-align:center;font-weight:700;color:var(--text)}
.dark .color-num{background:#111827;color:#fff}


/* v32 text visibility + ghost cube faces */
.cube-ghost{background:linear-gradient(135deg, rgba(255,255,255,.62), rgba(152,120,255,.18));backdrop-filter:blur(7px);border:1px solid rgba(255,255,255,.72);box-shadow:inset 0 0 0 1px rgba(255,255,255,.25), 0 12px 24px rgba(44,38,89,.10)}
.cube-ghost::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(123,82,246,.06));}


/* v33 complete joined cube */
.angle-stage{display:flex;align-items:center;justify-content:center;perspective:1100px;perspective-origin:50% 50%;}
.angle-cube{width:148px;height:116px;position:relative;transform-style:preserve-3d;transition:transform .18s ease;}
.cube-face{position:absolute;inset:0;border-radius:0 !important;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:none !important;border:1px solid rgba(170,160,220,.42);background:rgba(255,255,255,.55)}
.cube-front{transform:translateZ(74px) !important}
.cube-back{transform:rotateY(180deg) translateZ(74px) !important}
.cube-right{transform:rotateY(90deg) translateZ(74px) !important}
.cube-left{transform:rotateY(-90deg) translateZ(74px) !important}
.cube-top{transform:rotateX(90deg) translateZ(74px) !important}
.cube-bottom{transform:rotateX(-90deg) translateZ(74px) !important}
.cube-face img{width:100%;height:100%;display:block;object-fit:cover;filter:saturate(1.02)}
.cube-ghost{background:linear-gradient(135deg, rgba(255,255,255,.58), rgba(156,126,255,.22)) !important;border:1px solid rgba(186,176,236,.55) !important;box-shadow:none !important}
.cube-ghost::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg, rgba(255,255,255,.20), rgba(123,82,246,.08))}


/* v34 reference-style cube */
.ref-cube-shell{background:linear-gradient(180deg,#fafafa 0%, #f5f5f7 100%);}
.ref-cube-shell .angle-stage{min-height:220px;display:flex;align-items:center;justify-content:center;perspective:1200px;}
.ref-cube{width:126px;height:126px;transform-style:preserve-3d;}
.ref-cube .cube-face{border-radius:8px !important;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:none !important;border:1px solid #d9d9de !important;background:#fbfbfc;}
.ref-cube .cube-front{transform:translateZ(63px) !important;}
.ref-cube .cube-back{transform:rotateY(180deg) translateZ(63px) !important;}
.ref-cube .cube-right{transform:rotateY(90deg) translateZ(63px) !important;}
.ref-cube .cube-left{transform:rotateY(-90deg) translateZ(63px) !important;}
.ref-cube .cube-top{transform:rotateX(90deg) translateZ(63px) !important;}
.ref-cube .cube-bottom{transform:rotateX(-90deg) translateZ(63px) !important;}
.ref-cube .cube-ghost{background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(248,248,250,.92)) !important;border:1px solid #d9d9de !important;}
.ref-cube .cube-ghost::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(0,0,0,.02));}
.ref-cube .face-front::before,
.ref-cube .face-top::before{content:'L';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:rgba(185,185,194,.95);font-size:34px;font-weight:700;letter-spacing:.02em;z-index:2;text-shadow:0 1px 0 rgba(255,255,255,.8);}
.ref-cube .face-image{background:#fff !important;}
.ref-cube .face-image img{width:100%;height:100%;object-fit:cover;display:block;}
.ref-cube .face-image::after{content:'';position:absolute;inset:0;border:1px solid rgba(255,255,255,.38);pointer-events:none;}


/* v35 收藏夹筛选栏优化 */
#favorite .favorite-panel{
  overflow:visible;
}
#favorite .counts{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:16px;
}
#favorite .counts button{
  min-width:138px;
  height:42px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  background:#f5f6fa;
  transition:.18s ease;
}
#favorite .counts button.active{
  background:#f5f0ff;
  color:#7b52f6;
  border-color:#ad92ff;
  box-shadow:0 8px 22px rgba(123,82,246,.10);
}
#favorite .counts button b{
  min-width:28px;
  height:24px;
  border-radius:7px;
  background:#ece7ff;
  color:#7b52f6;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
}
#favorite .filter-row{
  display:grid;
  grid-template-columns:132px 132px 132px 132px 132px minmax(220px,1fr);
  gap:10px;
  align-items:center;
  margin-bottom:20px;
}
#favorite .filter-row button{
  height:40px;
  border-radius:10px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--text);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  font-weight:800;
  transition:.16s ease;
}
#favorite .filter-row button:hover{
  border-color:#b79cff;
  background:#fbf9ff;
}
#favorite .filter-row button b{
  color:#111827;
  font-weight:900;
}
#favorite .filter-row button span{
  color:#111827;
}
#favorite .filter-row button i{
  font-style:normal;
  color:#7b52f6;
  margin-left:2px;
}
#favorite .filter-row input{
  height:40px;
  border:1px solid var(--line);
  border-radius:10px;
  padding:0 14px;
  min-width:260px;
  background:#fff;
}
#favorite .filter-row button:nth-last-child(2),
#favorite .filter-row button:nth-last-child(1){
  width:40px;
  min-width:40px;
  padding:0;
}
#favorite .filter-row button.selected{
  background:#f3efff;
  color:#7b52f6;
  border-color:#b69bff;
}
.mini-dropdown{
  position:absolute;
  background:rgba(255,255,255,.98);
  border:1px solid rgba(229,232,242,.95);
  border-radius:14px;
  box-shadow:0 20px 55px rgba(28,38,64,.18);
  padding:8px;
  z-index:9999;
  display:none;
  backdrop-filter:blur(14px);
}
.mini-dropdown.show{
  display:block;
}
.fav-menu-title{
  font-size:12px;
  font-weight:900;
  color:#7b52f6;
  padding:6px 10px 8px;
  border-bottom:1px solid #f0eef7;
  margin-bottom:4px;
}
.fav-menu-options{
  display:flex;
  flex-direction:column;
  gap:3px;
}
.mini-dropdown button{
  width:100%;
  height:34px;
  border:0;
  border-radius:9px;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 10px;
  font-weight:800;
  color:#111827;
  cursor:pointer;
}
.mini-dropdown button:hover,
.mini-dropdown button.active{
  background:#f4efff;
  color:#7b52f6;
}
.mini-dropdown button b{
  color:#7b52f6;
}
@media (max-width: 1280px){
  #favorite .filter-row{
    grid-template-columns:repeat(3, minmax(120px,1fr));
  }
  #favorite .filter-row input{
    grid-column:1 / -1;
    width:100%;
  }
}


/* v36 favorites/library/home click and layout fixes */
#favorite .favorite-simple-row{
  display:grid !important;
  grid-template-columns: 150px minmax(280px, 380px) 1fr 160px 44px 44px;
  gap:10px;
  align-items:center;
}
#favorite .favorite-simple-row > span{display:block}
#favorite .favorite-simple-row input{max-width:none !important; width:100% !important}
#favorite .favorite-grid{
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
  gap:18px !important;
}
#favorite .favorite-grid article{
  display:flex !important;
  flex-direction:column;
  min-width:0;
  cursor:pointer;
}
#favorite .favorite-grid img{
  width:100%;
  height:210px;
  object-fit:cover;
  display:block;
  flex:0 0 auto;
}
#favorite .favorite-grid .fav-meta{
  min-width:0;
  padding:12px 14px 16px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
#favorite .favorite-grid b,
#favorite .favorite-grid small{
  padding:0 !important;
  margin:0;
  white-space:normal !important;
  word-break:break-word;
  overflow-wrap:anywhere;
  writing-mode:horizontal-tb !important;
}
#favorite .favorite-grid b{font-size:18px; line-height:1.45}
#favorite .favorite-grid small{font-size:14px; line-height:1.5; color:var(--muted)}
#favorite .favorite-grid.list-view{
  grid-template-columns:1fr !important;
}
#favorite .favorite-grid.list-view article{
  display:grid !important;
  grid-template-columns:220px minmax(0,1fr);
  align-items:stretch;
}
#favorite .favorite-grid.list-view img{height:160px}
#favorite .favorite-grid.list-view .fav-meta{padding:16px 18px}
#favorite .favorite-grid article:hover{transform:translateY(-2px); box-shadow:0 16px 36px rgba(20,30,50,.08)}
#favorite .favorite-grid .starbtn{z-index:3}
#favorite .favorite-grid article label{z-index:2}
#favorite .filter-row button span{flex:unset}
#favorite .filter-row button i{margin-left:auto}
#favorite .filter-row #favGridBtn,
#favorite .filter-row #favListBtn{width:44px;min-width:44px;padding:0}

#inspirationGrid .image-card,
#libraryGrid article,
#favoriteGrid article{cursor:pointer}
#inspirationGrid .image-card:hover,
#libraryGrid article:hover,
#favoriteGrid article:hover{transform:translateY(-2px)}

@media (max-width: 1200px){
  #favorite .favorite-simple-row{
    grid-template-columns: 1fr 1fr 44px 44px;
  }
  #favorite .favorite-simple-row > span{display:none}
  #favorite .favorite-simple-row input{grid-column:1 / span 2}
}


/* v41: video preview inside generation canvas */
.main-video-preview{
  max-width:calc(100% - 110px);
  max-height:calc(100% - 24px);
  border-radius:14px;
  background:#000;
  box-shadow:0 18px 48px rgba(15,23,42,.18);
  object-fit:contain;
  z-index:4;
}
.canvas-area.video-mode .main-preview{display:none!important;}


/* v44 custom skills */
.custom-skill-card{max-width:860px}
.custom-skill-form{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
.custom-skill-form .full{grid-column:1/-1}
.custom-skill-form label{display:block;margin-bottom:7px;font-size:13px;font-weight:800;color:var(--muted)}
.custom-skill-form input,.custom-skill-form select,.custom-skill-form textarea{width:100%;border:1px solid var(--line);border-radius:12px;background:#fff;padding:12px 14px;font-weight:700;color:var(--text);outline:none}
.custom-skill-form textarea{min-height:128px;resize:vertical;line-height:1.55}
.custom-cover-uploader{position:relative;border:1px dashed #cfc8ff;border-radius:14px;background:#faf8ff;height:96px;display:flex;align-items:center;gap:14px;padding:12px;overflow:hidden;cursor:pointer}
.custom-cover-uploader input{position:absolute;inset:0;opacity:0;cursor:pointer}
.custom-cover-uploader img{width:72px;height:72px;border-radius:12px;object-fit:cover;background:#fff;border:1px solid var(--line)}
.custom-cover-uploader span{font-weight:900;color:var(--purple)}
.custom-skill-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:18px}
.custom-skill-item{position:relative;border-color:#d9ccff!important;background:linear-gradient(180deg,#fff 0%,#fbf9ff 100%)}
.custom-skill-badge{position:absolute;left:14px;top:14px;z-index:3;padding:5px 9px;border-radius:999px;background:#efe9ff;color:var(--purple);font-size:12px;font-weight:900}
.custom-skill-item small{display:block;color:var(--muted);font-size:12px;font-weight:800;margin:-4px 20px 12px;line-height:1.4}
.custom-skill-row{display:grid;grid-template-columns:1fr 70px 70px;gap:8px;padding:0 20px 20px}
.custom-skill-row button{height:36px;border-radius:10px;font-weight:900}
.ghost-mini{background:#f5f6fb;color:#585b72}
.danger-mini{background:#fff1f2;color:#e11d48}
.dark .custom-skill-form input,.dark .custom-skill-form select,.dark .custom-skill-form textarea{background:#111827;color:#fff;border-color:#263244}
@media(max-width:860px){.custom-skill-form{grid-template-columns:1fr}.custom-skill-row{grid-template-columns:1fr}}

.workflow-skill-card:focus-visible,
.workflow-skill-card.active{
  border-color:#bdb8f8 !important;
  box-shadow:0 0 0 1px rgba(151,124,255,.18), 0 16px 32px rgba(131,146,182,.14);
}

/* V48: 局部重绘 / 编辑元素 / 多角度拖拽增强 */
.tool-textarea-wrap{
  margin:12px 0 8px;
}
.tool-textarea-label{
  display:block;
  font-size:12px;
  font-weight:800;
  color:var(--text);
  margin-bottom:6px;
}
.tool-textarea{
  width:100%;
  min-height:86px;
  resize:vertical;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--card);
  color:var(--text);
  padding:10px 12px;
  font:inherit;
  line-height:1.5;
  outline:none;
}
.tool-textarea:focus{
  border-color:#8a63ff;
  box-shadow:0 0 0 3px rgba(138,99,255,.12);
}
.ref-cube-shell .angle-stage,
#angleCube{
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
}
.ref-cube-shell .angle-stage.dragging,
.ref-cube-shell .angle-stage.dragging #angleCube,
#angleCube:active{
  cursor:grabbing;
}

/* V49: 选区颜色面板 */
.selection-color-wrap{
  margin:10px 0 6px;
}
.selection-color-label{
  font-size:12px;
  font-weight:800;
  color:var(--text);
  margin-bottom:8px;
}
.selection-color-list{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.selection-color{
  width:26px;
  height:26px;
  border-radius:999px;
  border:2px solid rgba(255,255,255,.95);
  background-color:var(--swatch) !important;
  background-image:none !important;
  box-shadow:0 0 0 1px rgba(18,26,43,.28), inset 0 0 0 1px rgba(255,255,255,.18);
}
.selection-color.active{
  box-shadow:0 0 0 2px rgba(123,82,246,.18), 0 0 0 3px var(--swatch);
  transform:scale(1.05);
}


/* V50: 选区画笔连续绘制 + 跟随画面缩放平移 */
#maskCanvas{
  position:absolute !important;
  inset:auto !important;
  transform-origin:center center !important;
  z-index:6;
}
#maskCanvas.active{
  pointer-events:auto !important;
}
.xyz-scale-lock,
.equal-scale-note{
  display:none !important;
}


/* V51: 多角度立方体——效果图主面 + 其余五面半透明并标注方向 */
.ref-cube{
  width:126px;
  height:126px;
  transform-style:preserve-3d;
}
.ref-cube .cube-face{
  position:absolute;
  inset:0;
  border-radius:10px !important;
  overflow:hidden;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  box-shadow:none !important;
}
.ref-cube .cube-front{
  transform:translateZ(63px) !important;
}
.ref-cube .cube-back{
  transform:rotateY(180deg) translateZ(63px) !important;
}
.ref-cube .cube-right{
  transform:rotateY(90deg) translateZ(63px) !important;
}
.ref-cube .cube-left{
  transform:rotateY(-90deg) translateZ(63px) !important;
}
.ref-cube .cube-top{
  transform:rotateX(90deg) translateZ(63px) !important;
}
.ref-cube .cube-bottom{
  transform:rotateX(-90deg) translateZ(63px) !important;
}
.ref-cube .face-image{
  background:#ffffff !important;
  border:1px solid rgba(212,212,220,.95) !important;
}
.ref-cube .face-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.ref-cube .face-image::after{
  content:'';
  position:absolute;
  inset:0;
  border:1px solid rgba(255,255,255,.38);
  pointer-events:none;
}
.ref-cube .cube-ghost{
  background:linear-gradient(180deg, rgba(255,255,255,.42), rgba(242,239,255,.28)) !important;
  border:1px solid rgba(191,186,215,.86) !important;
  box-shadow:none !important;
  backdrop-filter:blur(1.5px);
  -webkit-backdrop-filter:blur(1.5px);
}
.ref-cube .cube-ghost::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.16), rgba(123,82,246,.03));
}
.ref-cube .cube-face-label{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:2;
  color:rgba(128,128,140,.92);
  font-size:20px;
  font-weight:800;
  letter-spacing:.06em;
  text-shadow:0 1px 0 rgba(255,255,255,.66);
  user-select:none;
  pointer-events:none;
}
.dark .ref-cube .cube-ghost{
  background:linear-gradient(180deg, rgba(77,70,113,.40), rgba(48,41,79,.30)) !important;
  border:1px solid rgba(132,124,178,.9) !important;
}
.dark .ref-cube .cube-face-label{
  color:rgba(220,218,236,.92);
}


/* V52: 编辑文字改为画布拖动 + 大小/旋转控制 */
.text-layer{
  cursor:move !important;
  transform-origin:center center !important;
  touch-action:none;
}
.text-layer.dragging{
  outline:2px solid rgba(123,82,246,.38);
  box-shadow:0 10px 28px rgba(123,82,246,.18);
}
.text-position-tip{
  background:#f7f3ff;
  border:1px solid #e4dbff;
  color:#7357d8;
}

/* V52: 多角度立方体修复——去掉旧伪元素重复字，五个辅助面 30% 半透明 */
.ref-cube .face-front::before,
.ref-cube .face-top::before,
.ref-cube .face-back::before,
.ref-cube .face-left::before,
.ref-cube .face-right::before,
.ref-cube .face-bottom::before{
  content:none !important;
  display:none !important;
}
.ref-cube .cube-ghost{
  background:rgba(255,255,255,.30) !important;
  border:1px solid rgba(190,186,215,.30) !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.ref-cube .cube-ghost::after{
  content:none !important;
  display:none !important;
}
.ref-cube .cube-face-label{
  color:rgba(118,118,132,.78) !important;
  font-size:18px !important;
  font-weight:800 !important;
  text-shadow:none !important;
}
.dark .ref-cube .cube-ghost{
  background:rgba(255,255,255,.30) !important;
  border-color:rgba(210,205,245,.30) !important;
}
.dark .ref-cube .cube-face-label{
  color:rgba(255,255,255,.82) !important;
}


/* V53: 文本框随文字自动变小，大小与旋转改为画布浮动控制 */
.text-layer{
  min-width:0 !important;
  width:max-content !important;
  max-width:min(72%, 620px) !important;
  padding:3px 7px !important;
  line-height:1.08 !important;
  white-space:pre-wrap !important;
  overflow-wrap:anywhere !important;
  border-radius:7px !important;
  background:rgba(255,255,255,.38) !important;
  border:1px dashed rgba(123,82,246,.58) !important;
  box-sizing:border-box !important;
}
.text-inline-controls{
  position:absolute;
  z-index:9;
  width:218px;
  padding:9px 10px;
  border:1px solid rgba(225,229,242,.9);
  border-radius:14px;
  background:rgba(255,255,255,.92);
  box-shadow:0 16px 36px rgba(24,32,56,.14);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.text-inline-controls.hidden{
  display:none !important;
}
.text-inline-title{
  font-size:12px;
  font-weight:900;
  color:#111827;
  margin-bottom:6px;
}
.text-inline-controls label{
  display:grid;
  grid-template-columns:34px 1fr 40px;
  align-items:center;
  gap:8px;
  font-size:12px;
  color:#667085;
  margin:5px 0;
}
.text-inline-controls label span{
  font-weight:800;
  color:#30364f;
}
.text-inline-controls input[type=range]{
  width:100%;
}
.text-inline-controls b{
  font-size:12px;
  text-align:right;
  color:#7b52f6;
}
.dark .text-inline-controls{
  background:rgba(22,24,35,.92);
  border-color:rgba(70,75,96,.9);
}
.dark .text-inline-title,
.dark .text-inline-controls label span{
  color:#f7f7fb;
}


/* V54: PS 风格画布内文本框 */
#textInlineControls{display:none !important;}
.text-box{
  position:absolute;
  display:none;
  box-sizing:border-box;
  border:1px dashed rgba(123,82,246,.88);
  border-radius:8px;
  transform-origin:center center;
  z-index:12;
  user-select:none;
}
.text-box.show{display:block;}
.text-box.hidden{display:none !important;}
.text-box.editing{box-shadow:0 0 0 1px rgba(123,82,246,.12), 0 10px 30px rgba(123,82,246,.12);}
.text-box .text-layer{
  position:absolute !important;
  left:6px !important;
  top:6px !important;
  right:6px !important;
  bottom:6px !important;
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  max-width:none !important;
  padding:2px 4px !important;
  margin:0 !important;
  display:flex !important;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  background:rgba(255,255,255,.16) !important;
  border:none !important;
  border-radius:6px;
  color:#9b7a43;
  line-height:1.1;
  outline:none;
  cursor:text;
  transform:none !important;
}
.text-box:not(.editing){border-color:transparent;}
.text-box:not(.editing) .text-handle{display:none;}
.text-handle{
  position:absolute;
  width:12px;
  height:12px;
  background:#fff;
  border:2px solid #7b52f6;
  border-radius:999px;
  box-shadow:0 2px 8px rgba(27,34,65,.14);
}
.handle-nw{left:-7px; top:-7px; cursor:nwse-resize;}
.handle-ne{right:-7px; top:-7px; cursor:nesw-resize;}
.handle-sw{left:-7px; bottom:-7px; cursor:nesw-resize;}
.handle-se{right:-7px; bottom:-7px; cursor:nwse-resize;}
.handle-rotate{
  right:-16px;
  bottom:-16px;
  width:16px;
  height:16px;
  background:#7b52f6;
  border-color:#fff;
  cursor:grab;
}
.dark .text-box .text-layer{
  background:rgba(16,18,27,.2) !important;
}


/* ===== V55 全站苹果极简风美化 ===== */
:root{
  --bg:#f4f6fb;
  --card:#ffffff;
  --line:#e8ecf4;
  --text:#121826;
  --muted:#7c879d;
  --purple:#7b52f6;
  --purple2:#9b7bff;
  --light-purple:#f5f1ff;
  --blue:#4f8cff;
  --radius:18px;
  --shadow:0 14px 40px rgba(26,34,52,.06);
  --shadow-soft:0 8px 26px rgba(26,34,52,.05);
  --shadow-strong:0 24px 60px rgba(39,52,79,.10);
}
body{
  background:
    radial-gradient(1200px 380px at 10% -8%, rgba(123,82,246,.10), transparent 60%),
    radial-gradient(1000px 340px at 100% 0%, rgba(116,202,255,.10), transparent 52%),
    linear-gradient(180deg, #f6f8fd 0%, #f4f6fb 100%);
}
.app{background:transparent;}
.sidebar{
  left:16px;top:16px;bottom:16px;height:auto;width:104px;
  border-radius:28px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 18px 60px rgba(31,44,74,.10);
  backdrop-filter:blur(26px) saturate(140%);
}
.nav{padding:0 12px; gap:8px;}
.nav-item{height:68px; border-radius:18px;}
.nav-item span{font-size:22px;}
.nav-item em{font-size:12px; letter-spacing:.2px;}
.nav-item.active{
  background:linear-gradient(180deg,#f6f2ff 0%,#f1ebff 100%);
  box-shadow:inset 0 0 0 1px rgba(123,82,246,.12), 0 10px 24px rgba(123,82,246,.10);
}
.avatar-y{
  width:58px;height:58px;border-radius:18px;
  background:linear-gradient(135deg,#6fa5ff 0%,#8c63ff 100%);
  box-shadow:0 18px 36px rgba(123,82,246,.24);
}
.user-foot{bottom:20px;}
.w-badge{width:42px;height:42px;border-radius:12px;}
.pro-link{border-radius:999px; padding:6px 12px; background:rgba(123,82,246,.06);}
.main{margin-left:136px; padding:8px 26px 30px;}
.topbar{
  position:sticky; top:0; z-index:9; height:64px;
  background:linear-gradient(180deg, rgba(244,246,251,.92) 0%, rgba(244,246,251,.78) 100%);
  backdrop-filter:blur(18px);
}
.brand-top-title{
  display:flex; align-items:center; gap:12px; font-size:18px; font-weight:900; letter-spacing:.2px;
}
.brand-top-title small{font-size:12px;color:var(--muted);font-weight:700;margin-left:4px;letter-spacing:.3px;}
.brand-top-mark{
  width:30px;height:30px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;
  color:#fff;background:linear-gradient(135deg,#6fa5ff 0%,#8c63ff 100%);
  box-shadow:0 10px 24px rgba(123,82,246,.18);
}
.window-controls{letter-spacing:6px;color:#9098aa;}
.top-actions{top:72px; right:26px; gap:10px;}
.icon-btn,.outline-btn,.primary,.ghost,.load-more,.goldbtn{
  height:42px; border-radius:14px; padding:0 16px; font-weight:800;
  border:1px solid rgba(233,236,244,.95);
  box-shadow:var(--shadow-soft);
}
.icon-btn,.outline-btn,.ghost,.load-more{background:rgba(255,255,255,.76);backdrop-filter:blur(16px);}
.primary{background:linear-gradient(135deg,#8f68ff 0%,#6e63ff 100%);box-shadow:0 14px 30px rgba(123,82,246,.22);}
.page{max-width:1700px; margin:0 auto; padding:22px 0 42px;}
h1{font-size:40px; font-weight:900; letter-spacing:-.3px; margin-bottom:8px;}
.subtitle{font-size:16px; color:#8a93a8; margin-bottom:22px;}
.brand-banner{display:flex; align-items:center; gap:12px; margin-bottom:14px;}
.brand-pill{
  display:inline-flex; align-items:center; height:34px; padding:0 14px; border-radius:999px;
  color:var(--purple); background:rgba(123,82,246,.08); border:1px solid rgba(123,82,246,.12);
  font-size:12px; font-weight:900; letter-spacing:.8px;
}
.brand-note{color:#8b95ab; font-size:13px; font-weight:700;}
.panel,
.editor-card,
.stat-card,
.hero-card,
.image-card,
.favorite-grid article,
.masonry article,
.workflow-skill-card,
.skill-card,
.plan-card,
.pricing article,
.modal-card{
  border-radius:20px !important;
  border:1px solid rgba(232,236,244,.95) !important;
  box-shadow:var(--shadow) !important;
}
.panel{background:rgba(255,255,255,.86); backdrop-filter:blur(18px);}
.home-grid{grid-template-columns:minmax(0,1fr) 520px; gap:24px; align-items:stretch;}
.stats{gap:16px; align-content:start;}
.stat-card{
  height:130px; padding:22px 18px; background:rgba(255,255,255,.86);
}
.stat-card b{font-size:30px; line-height:1;}
.stat-card small{font-size:13px; margin-top:2px;}
.stat-card i{font-size:12px; margin-top:6px;}
.stat-icon{width:52px;height:52px;border-radius:16px; font-size:22px;}
.hero-card{
  min-height:278px; position:relative; overflow:hidden;
  background:linear-gradient(135deg, rgba(247,241,255,.95), rgba(241,246,255,.92));
  border:1px solid rgba(215,220,255,.7) !important;
}
.hero-card::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(250,245,255,.96) 0%, rgba(250,245,255,.84) 42%, rgba(250,245,255,.18) 100%);
  pointer-events:none;
}
.hero-card img{right:0; left:auto; width:100%; height:100%; object-fit:cover; opacity:.95;}
.hero-copy{position:relative; z-index:1; padding:32px; width:min(62%, 340px);}
.hero-kicker{
  display:inline-flex; margin-bottom:14px; padding:7px 12px; border-radius:999px;
  background:rgba(255,255,255,.65); border:1px solid rgba(123,82,246,.12);
  color:var(--purple); font-size:11px; font-weight:900; letter-spacing:.8px;
}
.hero-copy h2{font-size:34px; line-height:1.12; margin-bottom:12px; letter-spacing:-.5px;}
.hero-copy p{font-size:15px; color:#7f89a0; line-height:1.7; margin-bottom:16px;}
.hero-meta{display:flex; flex-wrap:wrap; gap:10px; margin:0 0 18px;}
.hero-meta span{
  height:30px; padding:0 12px; border-radius:999px; display:inline-flex; align-items:center;
  background:rgba(255,255,255,.68); border:1px solid rgba(123,82,246,.10); color:#66718a; font-size:12px; font-weight:800;
}
.dashboard{grid-template-columns:minmax(0,1fr) 420px; gap:24px; margin-top:24px;}
.big{padding:24px;}
.panel-head{padding-bottom:16px;}
.panel-head h3,.panel h3{font-size:18px; font-weight:900;}
.panel-head a{font-size:13px;}
.recent-grid{gap:16px;}
.image-card{overflow:hidden; transition:transform .18s ease, box-shadow .18s ease;}
.image-card:hover,.favorite-grid article:hover,.masonry article:hover{transform:translateY(-2px); box-shadow:0 18px 36px rgba(24,34,60,.09) !important;}
.image-card img{height:176px;}
.image-card b{font-size:15px; font-weight:900; padding-top:12px;}
.image-card small{font-size:13px; color:#8892a8;}
.home-side{gap:16px;}
.home-side .panel{padding:20px;}
.quick-tools{grid-template-columns:repeat(2,1fr); gap:12px;}
.quick-tools button{
  height:88px; border-radius:16px; background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(250,251,255,.86));
  border:1px solid rgba(233,236,244,.92); box-shadow:var(--shadow-soft);
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center; padding:0 16px;
}
.quick-tools button span{margin-top:6px; font-size:13px; color:#7d879a; font-weight:700;}
.list-panel p{height:44px; align-items:center; margin:0; padding:0 2px; border-bottom:1px dashed rgba(232,236,244,.9);}
.list-panel p:last-child{border-bottom:none;}
.scene-grid{grid-template-columns:320px minmax(640px,1fr) 300px; gap:18px; align-items:start;}
.controls,.right-stack .panel{padding:22px;}
.controls select,.controls textarea,.filter-row input,.workflow-menu input,.modal input,.setting-line select{
  height:40px; border-radius:12px; background:rgba(255,255,255,.92); border:1px solid rgba(232,236,244,.95);
}
.controls textarea,.video-textarea{height:108px; border-radius:14px; padding:12px 14px; line-height:1.6;}
.preset-row,.output,.tabs,.chips{gap:10px;}
.preset-row button,.chips button,.tabs button,.output button,.filter-row button{
  border-radius:12px; min-height:38px; border:1px solid rgba(232,236,244,.9); background:rgba(255,255,255,.85);
}
.toolbar{height:auto; padding-bottom:10px; gap:8px; flex-wrap:wrap;}
.toolbar button{height:38px; border-radius:12px; box-shadow:none;}
.editor-card{padding:14px; background:rgba(255,255,255,.88);}
.canvas-area{
  height:600px !important; border-radius:18px; background:linear-gradient(180deg,#f5f6fb 0%,#eff2f8 100%);
  border:1px solid rgba(232,236,244,.95);
}
.thumb-strip{left:14px; top:14px;}
.thumb-strip img{width:66px; height:66px; border-radius:14px; border-width:2px;}
.zoom-control-row{gap:10px; margin-top:14px;}
.zoom-control-row button,.zoom-control-row b{height:40px; border-radius:13px;}
.workflow-visual-grid{gap:16px !important; margin-top:14px;}
.workflow-skill-card{
  padding:18px !important; border-radius:20px !important; background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(250,252,255,.92));
}
.workflow-skill-card .wf-icon{font-size:18px !important; margin-bottom:8px; opacity:.8;}
.workflow-skill-card b{font-size:20px !important; line-height:1.25 !important; margin-bottom:8px;}
.workflow-skill-card small{font-size:14px !important; line-height:1.55 !important; color:#7e889d !important;}
.workflow-skill-card img{margin-top:14px !important; border-radius:18px !important; background:#f5f7fc;}
.video-panel,
.right-stack .panel{border-radius:20px !important;}
.video-mode-row button{border-radius:12px;}
.library-card,.favorite-panel,.settings-grid .panel,.workflow-layout .panel{padding:22px;}
.tabs{margin-bottom:16px;}
.tabs button{height:40px; border-radius:12px;}
.filter-row{flex-wrap:wrap; gap:12px;}
.filter-row input{height:42px; border-radius:14px;}
.category-strip{gap:14px;}
.category-strip article{height:120px; border-radius:18px; box-shadow:var(--shadow-soft);}
.masonry,.favorite-grid{gap:18px;}
.masonry article,.favorite-grid article{overflow:hidden; border-radius:20px !important;}
.masonry img{height:194px; border-radius:0;}
.favorite-grid img{height:218px;}
.favorite-grid b,.masonry article b{font-size:16px; font-weight:900;}
.favorite-grid small{font-size:13px; line-height:1.6; color:#8791a6;}
#favorite .filter-row button,
#favorite .filter-row input,
#library .filter-row button,
#library .filter-row input{
  height:42px; border-radius:14px;
}
.setting-nav button{border-radius:14px; min-height:46px; font-weight:800;}
.setting-line{padding:14px 0; grid-template-columns:180px 1fr;}
.pro-grid{grid-template-columns:minmax(0,1fr) 360px; gap:22px;}
.pricing{gap:18px;}
.pricing article{padding:28px;}
.pricing h2{font-size:28px;}
.modal-card{border-radius:24px;}
.tool-drawer{border-radius:20px; box-shadow:0 24px 70px rgba(22,34,58,.14);}
.tool-preview-box{border-radius:16px;}
#home .big,
#favorite .favorite-panel,
#library .library-card,
#workflow .workflow-layout .main-pane,
#settings .settings-main,
#pro .pay,
#pro .pro-side .panel{
  background:rgba(255,255,255,.86);
}
@media (max-width: 1480px){
  .home-grid{grid-template-columns:1fr;}
  .dashboard{grid-template-columns:1fr;}
  .scene-grid{grid-template-columns:320px 1fr;}
}
@media (max-width: 1200px){
  .sidebar{left:10px; top:10px; bottom:10px; width:94px;}
  .main{margin-left:118px;}
  .top-actions{right:18px;}
  .page{padding-top:16px;}
}


/* ===== V56 工作流卡片尺寸修复 ===== */
#scene .workflow-row.workflow-visual-grid.skill-extended-grid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0,1fr)) !important;
  gap:14px !important;
  align-items:stretch;
  margin-top:16px !important;
}
#scene .workflow-skill-card{
  min-height:210px !important;
  padding:14px 14px 12px !important;
  border-radius:18px !important;
}
#scene .workflow-skill-card .wf-icon{
  font-size:14px !important;
  margin-bottom:6px !important;
}
#scene .workflow-skill-card b{
  font-size:15px !important;
  line-height:1.28 !important;
  margin-bottom:6px !important;
}
#scene .workflow-skill-card small{
  font-size:12px !important;
  line-height:1.45 !important;
  min-height:34px !important;
  margin-bottom:10px !important;
}
#scene .workflow-skill-card img{
  width:100% !important;
  height:92px !important;
  margin-top:auto !important;
  border-radius:14px !important;
  object-fit:cover !important;
}
@media (max-width: 1600px){
  #scene .workflow-row.workflow-visual-grid.skill-extended-grid{
    grid-template-columns:repeat(4, minmax(0,1fr)) !important;
  }
}
@media (max-width: 1280px){
  #scene .workflow-row.workflow-visual-grid.skill-extended-grid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
  #scene .workflow-skill-card{
    min-height:224px !important;
  }
}
@media (max-width: 860px){
  #scene .workflow-row.workflow-visual-grid.skill-extended-grid{
    grid-template-columns:1fr !important;
  }
}


/* ===== V57 场景页进一步压缩高度：工作流 + 右侧区域 ===== */
#scene .scene-grid{
  grid-template-columns:300px minmax(620px,1fr) 280px !important;
  gap:16px !important;
}
#scene .controls,
#scene .right-stack .panel{
  padding:16px !important;
}
#scene .toolbar{padding-bottom:8px !important;}
#scene .zoom-control-row{margin-top:10px !important;}
#scene .workflow-row.workflow-visual-grid.skill-extended-grid{
  gap:12px !important;
  margin-top:12px !important;
}
#scene .workflow-skill-card{
  min-height:170px !important;
  padding:12px !important;
  border-radius:16px !important;
}
#scene .workflow-skill-card .wf-icon{
  font-size:12px !important;
  margin-bottom:5px !important;
}
#scene .workflow-skill-card b{
  font-size:13px !important;
  line-height:1.22 !important;
  margin-bottom:5px !important;
}
#scene .workflow-skill-card small{
  font-size:11px !important;
  line-height:1.35 !important;
  min-height:28px !important;
  margin-bottom:8px !important;
}
#scene .workflow-skill-card img{
  height:68px !important;
  margin-top:auto !important;
  border-radius:12px !important;
}
#scene .right-stack{gap:10px !important;}
#scene .right-stack h3{font-size:14px !important; margin-bottom:10px !important;}
#scene .video-panel .video-mode-row{gap:8px !important; margin-bottom:10px !important;}
#scene .video-panel .video-mode-row button{
  height:34px !important;
  font-size:12px !important;
  border-radius:10px !important;
}
#scene .video-panel label,
#scene .right-stack label{font-size:12px !important; margin:8px 0 4px !important;}
#scene .video-textarea{
  height:72px !important;
  min-height:72px !important;
  padding:10px 12px !important;
  font-size:12px !important;
  line-height:1.5 !important;
}
#scene .counter{font-size:11px !important; margin-top:4px !important;}
#scene .single-frame-zone .frame-card,
#scene .frame-grid .frame-card{
  padding:10px !important;
  border-radius:14px !important;
}
#scene .frame-thumb.single-thumb,
#scene .frame-thumb{
  height:104px !important;
  min-height:104px !important;
  border-radius:12px !important;
}
#scene .frame-card b{font-size:12px !important; margin:8px 0 6px !important;}
#scene .frame-actions{gap:6px !important;}
#scene .frame-actions button,
#scene .frame-actions label{
  height:34px !important;
  font-size:12px !important;
  border-radius:10px !important;
}
#scene .mini-slider{margin:8px 0 !important; gap:8px !important;}
#scene .mini-slider span,
#scene .mini-slider b{font-size:12px !important;}
#scene .mini-slider input[type=range]{height:16px !important;}
#scene .video-select-row{margin-top:8px !important; gap:8px !important; align-items:center !important;}
#scene .video-select-row label{margin:0 !important; width:42px !important; font-size:12px !important;}
#scene .video-select-row select{
  height:34px !important;
  border-radius:10px !important;
  font-size:12px !important;
  padding:0 10px !important;
}
#scene .video-output-panel{
  padding:14px !important;
}
#scene .video-output-panel .primary,
#scene .video-output-panel .outline-btn{
  height:38px !important;
  font-size:13px !important;
  border-radius:12px !important;
}
#scene .video-output-panel h3{margin-bottom:10px !important;}
@media (max-width: 1500px){
  #scene .scene-grid{grid-template-columns:290px minmax(540px,1fr) 260px !important;}
  #scene .workflow-skill-card{min-height:164px !important;}
  #scene .workflow-skill-card img{height:64px !important;}
}
@media (max-width: 1350px){
  #scene .scene-grid{grid-template-columns:300px 1fr !important;}
  #scene .right-stack{display:none !important;}
}


/* ===== V58 场景页上移与红线对齐 ===== */
#scene.page{padding-top:0 !important;}
#scene > h1,
#scene > .subtitle{display:none !important;}
#scene .scene-grid{margin-top:2px !important; align-items:start !important;}
#scene .controls,
#scene .right-stack .panel{padding:14px !important;}
#scene .controls h3,
#scene .right-stack h3{margin-bottom:10px !important;}
#scene .controls label{margin:8px 0 4px !important; font-size:12px !important;}
#scene .controls select,
#scene .controls textarea{height:34px !important; font-size:12px !important;}
#scene .controls textarea{height:84px !important; padding:10px 12px !important;}
#scene .counter{font-size:11px !important;}
#scene .preset-row{gap:6px !important; margin:8px 0 !important;}
#scene .preset-row button,
#scene .chips button{height:34px !important; font-size:12px !important;}
#scene .upload-box{padding:12px !important; min-height:92px !important;}
#scene .upload-box h4,
#scene .upload-box p,
#scene .upload-box small{font-size:12px !important;}
#scene .toolbar{padding-bottom:6px !important;}
#scene .canvas-area{min-height:450px !important;}
#scene .editor-status{bottom:10px !important; left:10px !important; font-size:12px !important;}
#scene .zoom-control-row{margin-top:8px !important; margin-bottom:8px !important;}
#scene .zoom-control-row button,
#scene .zoom-control-row b{height:34px !important; min-height:34px !important; font-size:12px !important;}
#scene .workflow-row.workflow-visual-grid.skill-extended-grid{margin-top:8px !important; gap:10px !important;}
#scene .workflow-skill-card{min-height:154px !important; padding:10px !important;}
#scene .workflow-skill-card .wf-icon{font-size:11px !important; margin-bottom:4px !important;}
#scene .workflow-skill-card b{font-size:12px !important; margin-bottom:4px !important;}
#scene .workflow-skill-card small{font-size:10px !important; line-height:1.3 !important; min-height:24px !important; margin-bottom:6px !important;}
#scene .workflow-skill-card img{height:56px !important; border-radius:10px !important;}
#scene .right-stack{gap:8px !important;}
#scene .video-panel .video-mode-row{margin-bottom:8px !important;}
#scene .video-panel .video-mode-row button{height:30px !important; font-size:11px !important;}
#scene .video-textarea{height:58px !important; min-height:58px !important; font-size:11px !important;}
#scene .frame-thumb.single-thumb,
#scene .frame-thumb{height:78px !important; min-height:78px !important;}
#scene .frame-card b{font-size:11px !important; margin:6px 0 4px !important;}
#scene .frame-actions button,
#scene .frame-actions label{height:30px !important; font-size:11px !important;}
#scene .mini-slider{margin:6px 0 !important;}
#scene .mini-slider span,
#scene .mini-slider b{font-size:11px !important;}
#scene .video-select-row{margin-top:6px !important;}
#scene .video-select-row label,
#scene .video-select-row select{font-size:11px !important;}
#scene .video-select-row select{height:30px !important;}
#scene .video-output-panel .primary,
#scene .video-output-panel .outline-btn{height:34px !important; font-size:12px !important;}
#scene .video-output-panel{padding:12px !important;}
@media (max-width: 1500px){
  #scene .scene-grid{grid-template-columns:290px minmax(530px,1fr) 250px !important;}
}


/* ===== V59 真实登录 ===== */
.login-card{max-width:860px !important;}
.login-grid{display:grid;grid-template-columns:280px 1fr;gap:28px;align-items:start;}
.qr-box,.login-form-area{display:flex;flex-direction:column;gap:10px;}
.qr-real-box{width:100%;height:260px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,#fff,#f7f7fc);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;}
.dark .qr-real-box{background:linear-gradient(180deg,#101828,#0f172a);}
#wechatQrImage{max-width:210px;max-height:210px;display:none;border-radius:10px;box-shadow:0 8px 20px rgba(0,0,0,.08);background:#fff;padding:8px;}
#wechatQrPlaceholder{font-size:14px;color:var(--muted);padding:0 24px;text-align:center;line-height:1.6;}
.login-inline-actions{display:flex;gap:10px;}
.login-inline-actions button{flex:1;}
.google-login-box{display:flex;flex-direction:column;gap:8px;margin-bottom:6px;}
.google-mount{min-height:44px;display:flex;align-items:center;}
#googleButtonMount iframe{border-radius:12px;}
#wechatStatus,#googleStatus,#phoneStatus{font-size:12px;color:var(--muted);line-height:1.5;min-height:18px;}
.login-form-area input{width:100%;}
@media (max-width: 840px){.login-grid{grid-template-columns:1fr;}}

/* V60: 账户状态联动与退出登录 */
.avatar-y.logged-in,
.account-avatar.logged-in{
  box-shadow:0 14px 36px rgba(123,82,246,.24);
}
.account-card{max-width:520px !important;}
.account-profile{
  display:flex;
  gap:18px;
  align-items:center;
  padding:18px;
  border:1px solid var(--line);
  border-radius:18px;
  background:linear-gradient(180deg,#fff,#f8f9ff);
  margin:14px 0 18px;
}
.dark .account-profile{background:linear-gradient(180deg,#101828,#111827);}
.account-avatar{
  width:72px;
  height:72px;
  border-radius:22px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:30px;
  font-weight:900;
  color:#fff;
  background:linear-gradient(135deg,#6fa5ff,#8c63ff);
}
.account-profile b{
  display:block;
  font-size:22px;
  margin-bottom:6px;
}
.account-profile small{
  color:var(--muted);
  font-weight:700;
}
.account-profile p{
  margin:8px 0 0;
  color:#8a93a8;
  font-size:13px;
}
.account-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.danger{
  border:1px solid rgba(239,68,68,.24);
  background:rgba(239,68,68,.06);
  color:#ef4444;
  font-weight:900;
  border-radius:14px;
  height:42px;
}


/* ===== V61 首页功能区域互换：红区移到蓝区，黄区移到绿区 ===== */
#home .home-grid{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) 520px !important;
  gap:24px !important;
  align-items:stretch !important;
}
#home .hero-card{
  order:1 !important;
  min-height:250px !important;
  border-radius:24px !important;
  background:linear-gradient(135deg, rgba(250,247,255,.98), rgba(239,245,255,.96)) !important;
}
#home .hero-card .hero-copy{
  width:min(62%, 520px) !important;
  padding:36px 42px !important;
}
#home .hero-card .hero-copy h2{
  font-size:34px !important;
  line-height:1.08 !important;
}
#home .hero-card .hero-copy p{
  max-width:440px !important;
}
#home .stats{
  order:2 !important;
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  gap:14px !important;
  padding:18px !important;
  border-radius:24px !important;
  background:linear-gradient(135deg, rgba(255,255,255,.92), rgba(248,249,255,.86)) !important;
  border:1px solid rgba(232,236,244,.96) !important;
  box-shadow:var(--shadow) !important;
}
#home .stats .stat-card{
  height:102px !important;
  padding:16px 14px !important;
  border-radius:18px !important;
  box-shadow:none !important;
  background:rgba(255,255,255,.78) !important;
}
#home .stats .stat-card b{font-size:24px !important;}
#home .stats .stat-icon{width:42px !important;height:42px !important;border-radius:14px !important;font-size:18px !important;}
#home .dashboard{margin-top:22px !important;}
.openable-card{cursor:pointer;}
.openable-card:hover{transform:translateY(-2px);}
.favorite-star{
  position:absolute !important;
  right:10px !important;
  top:10px !important;
  width:32px !important;
  height:32px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.84) !important;
  color:#f5a400 !important;
  font-size:16px !important;
  z-index:3 !important;
}

/* ===== V61 深色模式全站覆盖 ===== */
:root.dark,
:root.dark body{
  --bg:#070b14;
  --card:#111827;
  --line:#263149;
  --text:#f7f8fc;
  --muted:#a1abc1;
  --shadow:0 18px 50px rgba(0,0,0,.34);
  background:#070b14 !important;
  color:#f7f8fc !important;
}
:root.dark body{
  background:
    radial-gradient(900px 320px at 8% -6%, rgba(123,82,246,.18), transparent 64%),
    radial-gradient(1000px 360px at 100% 0%, rgba(80,152,255,.12), transparent 58%),
    linear-gradient(180deg, #070b14 0%, #0b1020 100%) !important;
}
:root.dark .app,
:root.dark .main,
:root.dark .page{
  background:transparent !important;
  color:#f7f8fc !important;
}
:root.dark .topbar{
  background:linear-gradient(180deg, rgba(7,11,20,.92), rgba(7,11,20,.72)) !important;
  border-bottom:1px solid rgba(52,65,92,.5) !important;
}
:root.dark .sidebar,
:root.dark .panel,
:root.dark .stat-card,
:root.dark .hero-card,
:root.dark .image-card,
:root.dark .editor-card,
:root.dark .controls,
:root.dark .right-stack .panel,
:root.dark .home-side .panel,
:root.dark .modal-card,
:root.dark .tool-drawer,
:root.dark .favorite-grid article,
:root.dark .masonry article,
:root.dark .workflow-skill-card,
:root.dark .skill-card,
:root.dark .plan-card,
:root.dark .pricing article,
:root.dark .account-profile{
  background:rgba(17,24,39,.86) !important;
  border-color:rgba(55,65,89,.92) !important;
  color:#f7f8fc !important;
  box-shadow:0 18px 50px rgba(0,0,0,.34) !important;
}
:root.dark #home .stats{
  background:linear-gradient(135deg, rgba(17,24,39,.92), rgba(13,18,31,.88)) !important;
  border-color:rgba(55,65,89,.92) !important;
}
:root.dark #home .stats .stat-card{
  background:rgba(15,23,42,.78) !important;
}
:root.dark #home .hero-card{
  background:linear-gradient(135deg, rgba(26,20,46,.95), rgba(15,23,42,.92)) !important;
}
:root.dark .hero-card::after{
  background:linear-gradient(90deg, rgba(15,23,42,.95) 0%, rgba(15,23,42,.72) 45%, rgba(15,23,42,.12) 100%) !important;
}
:root.dark input,
:root.dark select,
:root.dark textarea,
:root.dark .upload-box,
:root.dark .filter-row input,
:root.dark .qr-real-box,
:root.dark .text-inline-controls,
:root.dark .tool-preview-box,
:root.dark .canvas-area{
  background:#0f172a !important;
  border-color:#2a3651 !important;
  color:#f7f8fc !important;
}
:root.dark button,
:root.dark .outline-btn,
:root.dark .ghost,
:root.dark .icon-btn,
:root.dark .load-more{
  background:rgba(17,24,39,.86);
  border-color:rgba(55,65,89,.92);
  color:#f7f8fc;
}
:root.dark .subtitle,
:root.dark small,
:root.dark .brand-note,
:root.dark .hero-copy p,
:root.dark .image-card small,
:root.dark .list-panel p,
:root.dark .tool-note{
  color:#a1abc1 !important;
}
:root.dark .purple{background:rgba(123,82,246,.18) !important;color:#bba7ff !important;}
:root.dark .blue{background:rgba(44,125,240,.18) !important;color:#7fb0ff !important;}
:root.dark .pink{background:rgba(255,79,141,.16) !important;color:#ff9cc2 !important;}
:root.dark .green{background:rgba(24,182,91,.16) !important;color:#74e2a4 !important;}
:root.dark .image-card button,
:root.dark .favorite-star{
  background:rgba(15,23,42,.84) !important;
  color:#f5c451 !important;
}
:root.dark .dropdown-menu,
:root.dark .fav-dropdown,
:root.dark .context-menu{
  background:#111827 !important;
  border-color:#2a3651 !important;
  color:#f7f8fc !important;
}

/* 首页在较窄窗口保持不溢出 */
@media (max-width: 1450px){
  #home .home-grid{grid-template-columns:1fr 420px !important;}
  #home .hero-card .hero-copy{width:68% !important;padding:30px !important;}
  #home .hero-card .hero-copy h2{font-size:30px !important;}
  #home .stats .stat-card{height:96px !important;}
}
@media (max-width: 1160px){
  #home .home-grid{grid-template-columns:1fr !important;}
  #home .hero-card{order:1 !important;}
  #home .stats{order:2 !important;grid-template-columns:repeat(4,1fr) !important;}
}


/* ===== V62 首页主视觉高级化 ===== */
#home .hero-card{
  min-height: 360px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  position:relative !important;
  isolation:isolate !important;
  border-radius:28px !important;
  border:1px solid rgba(221,226,242,.95) !important;
  background:linear-gradient(135deg, rgba(253,251,255,.98), rgba(244,247,255,.96)) !important;
  box-shadow:0 24px 60px rgba(29,38,60,.08) !important;
}
#home .hero-card > img{
  display:none !important;
}
#home .hero-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background-image:
    linear-gradient(90deg, rgba(252,250,255,.98) 0%, rgba(252,250,255,.96) 28%, rgba(252,250,255,.84) 42%, rgba(252,250,255,.18) 58%, rgba(252,250,255,.04) 100%),
    url("./assets/hero_luxury_light.svg");
  background-size:cover, cover;
  background-repeat:no-repeat, no-repeat;
  background-position:center center, center center;
}
#home .hero-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(460px 320px at 77% 38%, rgba(163,129,255,.13), transparent 70%),
    radial-gradient(300px 220px at 90% 68%, rgba(132,182,255,.10), transparent 74%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0));
  pointer-events:none;
}
#home .hero-copy{
  position:relative !important;
  z-index:2 !important;
  width:min(47%, 520px) !important;
  min-height:100% !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:flex-start !important;
  padding:54px 0 54px 44px !important;
  margin:0 !important;
}
#home .hero-kicker{
  background:rgba(255,255,255,.78) !important;
  border:1px solid rgba(151,128,245,.18) !important;
  box-shadow:0 12px 28px rgba(123,82,246,.08) !important;
  margin-bottom:18px !important;
}
#home .hero-copy h2{
  max-width:360px !important;
  margin:0 0 14px 0 !important;
  font-size:56px !important;
  line-height:0.96 !important;
  letter-spacing:-1.8px !important;
  font-weight:900 !important;
  color:#171b29 !important;
}
#home .hero-copy p{
  max-width:380px !important;
  font-size:18px !important;
  line-height:1.7 !important;
  color:#69748d !important;
  margin:0 0 18px 0 !important;
}
#home .hero-actions{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin:2px 0 20px 0 !important;
}
#home .hero-actions .ghost{
  min-height:38px !important;
  padding:0 16px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.70) !important;
  border:1px solid rgba(224,228,240,.88) !important;
  box-shadow:0 10px 24px rgba(42,52,74,.05) !important;
}
#home .hero-copy .primary{
  min-width:126px !important;
  height:48px !important;
  border-radius:16px !important;
  padding:0 22px !important;
  box-shadow:0 16px 36px rgba(123,82,246,.24) !important;
}

:root.dark #home .hero-card{
  border-color:rgba(53,67,97,.96) !important;
  background:linear-gradient(135deg, rgba(16,22,38,.98), rgba(9,13,24,.96)) !important;
  box-shadow:0 30px 70px rgba(0,0,0,.34) !important;
}
:root.dark #home .hero-card::before{
  background-image:
    linear-gradient(90deg, rgba(8,12,23,.96) 0%, rgba(9,13,24,.94) 30%, rgba(9,13,24,.80) 44%, rgba(9,13,24,.26) 58%, rgba(9,13,24,.10) 100%),
    url("./assets/hero_luxury_dark.svg");
}
:root.dark #home .hero-card::after{
  background:
    radial-gradient(420px 280px at 76% 36%, rgba(134,92,255,.20), transparent 68%),
    radial-gradient(300px 220px at 90% 68%, rgba(59,130,246,.18), transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
}
:root.dark #home .hero-kicker{
  background:rgba(19,27,45,.82) !important;
  border-color:rgba(123,82,246,.24) !important;
  color:#bca8ff !important;
  box-shadow:0 14px 30px rgba(0,0,0,.16) !important;
}
:root.dark #home .hero-copy h2{
  color:#f7f8fc !important;
}
:root.dark #home .hero-copy p{
  color:#a6b0c7 !important;
}
:root.dark #home .hero-actions .ghost{
  background:rgba(19,27,45,.84) !important;
  border-color:rgba(46,58,86,.94) !important;
  color:#eef2ff !important;
  box-shadow:0 12px 24px rgba(0,0,0,.18) !important;
}
:root.dark #home .hero-copy .primary{
  box-shadow:0 18px 38px rgba(123,82,246,.34) !important;
}

@media (max-width: 1450px){
  #home .hero-card{min-height:340px !important;}
  #home .hero-copy{width:min(50%, 500px) !important; padding-left:38px !important;}
  #home .hero-copy h2{font-size:48px !important; max-width:330px !important;}
  #home .hero-copy p{font-size:16px !important; max-width:340px !important;}
}
@media (max-width: 1160px){
  #home .hero-card{min-height:320px !important;}
  #home .hero-copy{
    width:min(58%, 520px) !important;
    padding:38px 26px 38px 30px !important;
  }
  #home .hero-copy h2{font-size:42px !important; max-width:310px !important;}
  #home .hero-copy p{font-size:15px !important; max-width:320px !important;}
}


/* ===== V63 风格/比例/视频按钮优化 ===== */
#generateVideoBtn{
  background: linear-gradient(135deg, #8a5cff 0%, #6f4cf2 100%) !important;
  color:#fff !important;
  border:1px solid transparent !important;
  box-shadow: 0 12px 28px rgba(123,82,246,.28) !important;
}
#generateVideoBtn:hover{
  filter: brightness(1.03);
  transform: translateY(-1px);
}
:root.dark #generateVideoBtn{
  background: linear-gradient(135deg, #9b78ff 0%, #7b52f6 100%) !important;
  color:#fff !important;
  box-shadow: 0 12px 30px rgba(123,82,246,.36) !important;
}
#videoModel{
  min-width: 180px;
}


/* ===== V64 风格按钮与主视觉标题优化 ===== */
.preset-row.style-only{
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.preset-row.style-only button{
  min-width: 64px;
}
.hero-copy h2{
  white-space: nowrap;
  line-height: 1.08;
  font-size: clamp(34px, 3vw, 52px);
  letter-spacing: -0.03em;
}
@media (max-width: 1280px){
  .hero-copy h2{
    white-space: normal;
  }
}


/* ===== V65 风格下拉替换 + 深色主视觉与技能卡优化 ===== */
.style-select-compact{
  width:100%;
  margin:6px 0 10px;
  height:42px !important;
  border-radius:14px !important;
  font-weight:700;
}
:root.dark .style-select-compact{
  background:linear-gradient(180deg, rgba(15,23,42,.95), rgba(12,18,34,.95)) !important;
  border:1px solid rgba(90,108,150,.52) !important;
  color:#f7f8fc !important;
}

:root.dark #home .hero-card{
  background:
    radial-gradient(480px 220px at 78% 18%, rgba(128,97,255,.28), transparent 56%),
    radial-gradient(380px 200px at 92% 86%, rgba(86,160,255,.18), transparent 54%),
    linear-gradient(135deg, rgba(18,22,39,.98), rgba(10,14,26,.98)) !important;
  border:1px solid rgba(97,107,152,.38) !important;
  box-shadow:0 24px 60px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.03) !important;
}
:root.dark #home .hero-card::after{
  background:linear-gradient(90deg, rgba(10,14,26,.88) 0%, rgba(12,16,30,.66) 36%, rgba(12,16,30,.18) 62%, rgba(12,16,30,.04) 100%) !important;
}
:root.dark #home .hero-copy h2{
  color:#ffffff !important;
  text-shadow:0 8px 34px rgba(0,0,0,.28);
}
:root.dark #home .hero-copy p{
  color:#b6c0d8 !important;
}
:root.dark #home .hero-tag,
:root.dark #home .hero-pills button{
  background:rgba(255,255,255,.05) !important;
  border-color:rgba(114,129,170,.36) !important;
  color:#dce4ff !important;
}
:root.dark #home .hero-card img{
  opacity:.9;
  filter:saturate(1.05) brightness(.86) contrast(1.06);
}

:root.dark .workflow-visual-grid,
:root.dark .scene-workflows,
:root.dark .workflow-preview-wrap{
  background:transparent !important;
}
:root.dark .workflow-skill-card{
  background:
    linear-gradient(180deg, rgba(19,26,45,.95), rgba(14,19,34,.96)) !important;
  border:1px solid rgba(83,97,134,.44) !important;
  box-shadow:0 16px 44px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.03) !important;
}
:root.dark .workflow-skill-card:hover{
  border-color:rgba(138,108,255,.66) !important;
  box-shadow:0 20px 52px rgba(0,0,0,.34), 0 0 0 1px rgba(138,108,255,.14) !important;
}
:root.dark .workflow-skill-card .wf-icon,
:root.dark .workflow-skill-card b{
  color:#eef2ff !important;
}
:root.dark .workflow-skill-card small,
:root.dark .workflow-skill-card p{
  color:#9eacc9 !important;
}
:root.dark .workflow-skill-card img,
:root.dark .workflow-skill-card .workflow-preview-img,
:root.dark .workflow-skill-card .wf-preview{
  border-radius:16px !important;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
:root.dark #scene .workflow-visual-grid,
:root.dark #scene .workflow-grid,
:root.dark #scene .skill-extended-grid{
  gap:14px !important;
}


/* ===== V68 深色模式同步修复：收藏夹 / 工作流 / 下拉二级菜单 ===== */
.fav-dropdown{
  position:absolute;
  z-index:9999;
  display:none;
  min-width:160px;
  padding:10px;
  border-radius:16px;
  border:1px solid rgba(216,221,236,.98);
  background:rgba(255,255,255,.98);
  box-shadow:0 18px 48px rgba(17,24,39,.16);
  backdrop-filter:blur(18px);
}
.fav-dropdown.show{display:block;}
.fav-dropdown .fav-menu-title{
  font-size:12px;
  line-height:1;
  color:#7b52f6;
  font-weight:800;
  padding:4px 6px 10px;
}
.fav-dropdown .fav-menu-options{display:flex;flex-direction:column;gap:6px;}
.fav-dropdown .fav-menu-options button{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border:1px solid rgba(229,232,243,.95);
  background:#ffffff;
  color:#172033;
  border-radius:12px;
  padding:10px 12px;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  transition:all .18s ease;
}
.fav-dropdown .fav-menu-options button:hover{
  border-color:rgba(123,82,246,.36);
  background:#f7f3ff;
}
.fav-dropdown .fav-menu-options button.active{
  background:linear-gradient(135deg, rgba(123,82,246,.18), rgba(91,118,255,.12));
  border-color:rgba(123,82,246,.5);
  color:#6f43f4;
}
.fav-dropdown .fav-menu-options button b{font-size:13px;color:inherit;}

:root.dark #favorite .favorite-panel{
  background:linear-gradient(180deg, rgba(4,12,28,.92) 0%, rgba(8,18,36,.90) 100%) !important;
  border:1px solid rgba(40,56,86,.88) !important;
  box-shadow:0 26px 60px rgba(0,0,0,.32) !important;
}
:root.dark #favorite .counts{
  gap:12px;
}
:root.dark #favorite .counts button,
:root.dark #favorite .favorite-simple-row button,
:root.dark #favorite .favorite-simple-row input{
  background:linear-gradient(180deg, rgba(12,20,38,.96), rgba(8,15,30,.98)) !important;
  border:1px solid rgba(51,69,104,.96) !important;
  color:#f6f8ff !important;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}
:root.dark #favorite .counts button b{
  background:rgba(123,82,246,.22) !important;
  color:#c7b5ff !important;
}
:root.dark #favorite .counts button.active,
:root.dark #favorite .counts button:hover,
:root.dark #favorite #favGridBtn.selected,
:root.dark #favorite #favListBtn.selected,
:root.dark #favorite .favorite-simple-row button:hover{
  border-color:rgba(133,103,255,.88) !important;
  box-shadow:0 14px 32px rgba(66,39,152,.22);
}
:root.dark #favorite .counts button.active{
  background:linear-gradient(135deg, rgba(40,26,78,.96), rgba(20,27,52,.96)) !important;
  color:#f8f9ff !important;
}
:root.dark #favorite .favorite-simple-row input::placeholder{color:#7f8ca8 !important;}
:root.dark #favorite .favorite-grid article{
  background:linear-gradient(180deg, rgba(8,16,32,.98), rgba(10,20,38,.96)) !important;
  border:1px solid rgba(38,56,90,.95) !important;
  box-shadow:0 18px 40px rgba(0,0,0,.24) !important;
}
:root.dark #favorite .favorite-grid article:hover{
  border-color:rgba(127,97,255,.7) !important;
  box-shadow:0 20px 48px rgba(28,16,68,.28) !important;
}
:root.dark #favorite .favorite-grid b{color:#f7f9ff !important;}
:root.dark #favorite .favorite-grid small{color:#9aaccc !important;}
:root.dark #favorite .favorite-grid label{
  background:rgba(123,82,246,.20) !important;
  color:#d7cbff !important;
  border:1px solid rgba(144,115,255,.30) !important;
}
:root.dark #favorite .favorite-grid .starbtn{
  background:rgba(15,23,42,.92) !important;
  border:1px solid rgba(67,83,114,.88) !important;
  color:#ffcc57 !important;
}
:root.dark #favorite .pagination button,
:root.dark #favorite .pagination span{
  background:rgba(12,20,38,.94);
  color:#d8def0;
  border:1px solid rgba(46,61,91,.92);
}
:root.dark #favorite .pagination .active{
  background:linear-gradient(135deg, rgba(123,82,246,.28), rgba(84,118,255,.18)) !important;
  color:#f7f8ff !important;
  border-color:rgba(133,103,255,.82) !important;
}
:root.dark .fav-dropdown{
  background:linear-gradient(180deg, rgba(8,16,32,.98), rgba(10,20,38,.98)) !important;
  border-color:rgba(40,58,92,.96) !important;
  color:#f7f8fc !important;
  box-shadow:0 22px 56px rgba(0,0,0,.42) !important;
}
:root.dark .fav-dropdown .fav-menu-title{color:#bea8ff !important;}
:root.dark .fav-dropdown .fav-menu-options button{
  background:rgba(13,22,40,.96) !important;
  border-color:rgba(51,69,104,.96) !important;
  color:#f7f8ff !important;
}
:root.dark .fav-dropdown .fav-menu-options button:hover{
  background:rgba(29,24,55,.96) !important;
  border-color:rgba(133,103,255,.76) !important;
}
:root.dark .fav-dropdown .fav-menu-options button.active{
  background:linear-gradient(135deg, rgba(59,36,125,.88), rgba(24,38,80,.96)) !important;
  border-color:rgba(142,112,255,.92) !important;
  color:#f7f8ff !important;
}

:root.dark .workflow-skill-card{
  background:linear-gradient(180deg, rgba(8,16,32,.98) 0%, rgba(9,18,34,.94) 100%) !important;
  border:1px solid rgba(39,57,90,.92) !important;
  box-shadow:0 20px 44px rgba(0,0,0,.30) !important;
}
:root.dark .workflow-skill-card:hover,
:root.dark .workflow-skill-card:focus,
:root.dark .workflow-skill-card:focus-visible{
  border-color:rgba(133,103,255,.84) !important;
  box-shadow:0 20px 52px rgba(37,23,98,.30) !important;
}
:root.dark .workflow-skill-card .wf-icon{color:#aebcff !important;}
:root.dark .workflow-skill-card b{color:#f8f9ff !important;}
:root.dark .workflow-skill-card small{color:#95a7ca !important;}
:root.dark .workflow-skill-card img{
  background:linear-gradient(180deg, rgba(11,19,35,.98), rgba(14,24,42,.94)) !important;
  border:1px solid rgba(41,60,96,.84) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), 0 12px 28px rgba(0,0,0,.22) !important;
  object-position:center center !important;
  opacity:.98 !important;
  filter:saturate(1.03) contrast(1.03) brightness(.98) !important;
}


/* ===== V69 星标防跳转 + 工作流深色图面 + 上传可点 ===== */
.favorite-toggle,
.favorite-star,
.starbtn{
  cursor:pointer !important;
  user-select:none;
}
.favorite-toggle.is-favorited,
.favorite-star.is-favorited,
.starbtn.is-favorited{
  color:#ffbf38 !important;
}
.image-card .favorite-toggle,
.image-card .favorite-star,
.favorite-grid .starbtn{
  position:absolute !important;
  right:12px !important;
  top:12px !important;
  z-index:8 !important;
  width:34px !important;
  height:34px !important;
  border-radius:999px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:18px !important;
  font-weight:900 !important;
  background:rgba(255,255,255,.86) !important;
  border:1px solid rgba(235,238,248,.92) !important;
  box-shadow:0 8px 20px rgba(20,30,50,.12) !important;
}
:root.dark .image-card .favorite-toggle,
:root.dark .image-card .favorite-star,
:root.dark .favorite-grid .starbtn{
  background:rgba(11,18,34,.92) !important;
  border:1px solid rgba(60,78,114,.96) !important;
  color:#8e9ab3 !important;
  box-shadow:0 10px 26px rgba(0,0,0,.32) !important;
}
:root.dark .image-card .favorite-toggle.is-favorited,
:root.dark .image-card .favorite-star.is-favorited,
:root.dark .favorite-grid .starbtn.is-favorited{
  color:#ffca4e !important;
  border-color:rgba(255,202,78,.36) !important;
  background:rgba(44,34,13,.88) !important;
}

:root.dark #scene .workflow-skill-card,
:root.dark .workflow-skill-card{
  background:linear-gradient(180deg, rgba(7,14,28,.98) 0%, rgba(9,17,32,.96) 100%) !important;
  border-color:rgba(37,58,94,.92) !important;
}
:root.dark #scene .workflow-skill-card img,
:root.dark .workflow-skill-card img{
  background:linear-gradient(180deg, rgba(6,14,28,.98), rgba(8,17,34,.96)) !important;
  border:1px solid rgba(45,64,98,.84) !important;
  filter:brightness(.9) contrast(1.02) saturate(.98) !important;
  opacity:1 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03), 0 12px 28px rgba(0,0,0,.24) !important;
}
:root.dark #scene .workflow-skill-card:hover img,
:root.dark .workflow-skill-card:hover img{
  filter:brightness(.96) contrast(1.04) saturate(1) !important;
  opacity:1 !important;
}

#skillUploadBox{
  cursor:pointer !important;
}
#skillUploadBox.dragover{
  border-color:#7b52f6 !important;
  box-shadow:0 0 0 3px rgba(123,82,246,.16) !important;
}
#skillUploadBox input[type=file]{
  cursor:pointer !important;
}
:root.dark #skillUploadBox{
  background:linear-gradient(180deg, rgba(13,20,36,.96), rgba(9,16,31,.98)) !important;
  border-color:rgba(77,92,126,.9) !important;
  color:#f7f8ff !important;
}
:root.dark #skillUploadBox b{color:#f7f8ff !important;}
:root.dark #skillUploadBox span{color:#b8a8ff !important;}
:root.dark .skill-upload-preview{
  background:#091124 !important;
  border-color:rgba(48,65,98,.92) !important;
}

:root.dark .skill-upload-card{background:linear-gradient(180deg, rgba(7,14,28,.98), rgba(10,18,34,.98)) !important;border:1px solid rgba(43,61,95,.92) !important;box-shadow:0 26px 60px rgba(0,0,0,.42) !important;}
:root.dark .skill-shot label{color:#eef3ff !important;}
:root.dark .skill-shot-box,
:root.dark .skill-upload-preview{background:linear-gradient(180deg, rgba(8,18,34,.98), rgba(10,20,38,.98)) !important;border-color:rgba(44,62,98,.9) !important;}
:root.dark .skill-shot-box em,
:root.dark .skill-upload-preview em{color:#9fb0cf !important;}
:root.dark .skill-shot-box img,
:root.dark .skill-upload-preview img{background:#081224 !important;}
:root.dark #library .filter-row button,
:root.dark #sortLibrary{background:linear-gradient(180deg, rgba(9,18,36,.98), rgba(7,14,29,.98)) !important;border:1px solid rgba(44,63,98,.92) !important;color:#f7f8ff !important;}
:root.dark #library .filter-row button:hover,
:root.dark #sortLibrary:hover{border-color:rgba(135,103,255,.82) !important;box-shadow:0 12px 28px rgba(44,28,109,.18) !important;}
:root.dark .selection-color{border-color:rgba(255,255,255,.82) !important;box-shadow:0 0 0 1px rgba(148,163,184,.35), inset 0 0 0 1px rgba(255,255,255,.18) !important;}
:root.dark .selection-color.active{box-shadow:0 0 0 2px rgba(123,82,246,.42), 0 0 0 4px var(--swatch) !important;}
@media (max-width: 760px){.skill-upload-dual{grid-template-columns:1fr;}}


/* ===== V71 调整面板色相/饱和度/明度彩色显示 + 工作流图片夜间模式 ===== */
.hsl-panel .color-hsl-line{
  grid-template-columns:72px minmax(120px,1fr) 56px !important;
  gap:12px !important;
}
.hsl-panel .color-slider-wrap{
  position:relative !important;
  height:22px !important;
  display:flex !important;
  align-items:center !important;
}
.hsl-panel .color-gradient-slider{
  -webkit-appearance:none !important;
  appearance:none !important;
  width:100% !important;
  height:22px !important;
  background:transparent !important;
  outline:none !important;
  cursor:pointer !important;
}
.hsl-panel .color-gradient-slider::-webkit-slider-runnable-track{
  height:6px !important;
  border-radius:999px !important;
  background:var(--track-bg) !important;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.16) !important;
}
.hsl-panel .color-gradient-slider::-moz-range-track{
  height:6px !important;
  border-radius:999px !important;
  background:var(--track-bg) !important;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.16) !important;
}
.hsl-panel .color-gradient-slider::-webkit-slider-thumb{
  -webkit-appearance:none !important;
  appearance:none !important;
  width:14px !important;
  height:14px !important;
  border-radius:50% !important;
  background:#ffffff !important;
  border:2px solid rgba(15,23,42,.55) !important;
  box-shadow:0 2px 7px rgba(0,0,0,.35) !important;
  margin-top:-4px !important;
}
.hsl-panel .color-gradient-slider::-moz-range-thumb{
  width:14px !important;
  height:14px !important;
  border-radius:50% !important;
  background:#ffffff !important;
  border:2px solid rgba(15,23,42,.55) !important;
  box-shadow:0 2px 7px rgba(0,0,0,.35) !important;
}
:root.dark .hsl-panel .color-gradient-slider::-webkit-slider-runnable-track{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18), 0 0 0 1px rgba(0,0,0,.18) !important;
}
:root.dark .hsl-panel .color-gradient-slider::-moz-range-track{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18), 0 0 0 1px rgba(0,0,0,.18) !important;
}
:root.dark .hsl-panel .color-gradient-slider::-webkit-slider-thumb,
:root.dark .hsl-panel .color-gradient-slider::-moz-range-thumb{
  background:#f8fafc !important;
  border-color:rgba(15,23,42,.92) !important;
}
.hsl-panel .color-num{
  height:28px !important;
  border-radius:6px !important;
  background:rgba(248,250,252,.96) !important;
}
:root.dark .hsl-panel .color-num{
  background:#0b1427 !important;
  border-color:rgba(72,91,132,.84) !important;
  color:#f8fafc !important;
}

/* 工作流预览图在深色模式中不再保留大面积白底，改为夜间深色融合 */
:root.dark #scene .workflow-skill-card,
:root.dark .workflow-skill-card{
  background:linear-gradient(180deg, rgba(8,16,32,.98), rgba(7,14,28,.98)) !important;
  border-color:rgba(47,66,104,.94) !important;
}
:root.dark #scene .workflow-skill-card img,
:root.dark .workflow-skill-card img{
  background:#071225 !important;
  border:1px solid rgba(52,74,112,.90) !important;
  filter:brightness(.78) contrast(1.08) saturate(1.08) !important;
  mix-blend-mode:multiply !important;
  opacity:.96 !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035), 0 14px 32px rgba(0,0,0,.28) !important;
}
:root.dark #scene .workflow-skill-card:hover img,
:root.dark .workflow-skill-card:hover img{
  filter:brightness(.86) contrast(1.1) saturate(1.15) !important;
  opacity:1 !important;
}

/* ===== V72 修复工作流预览图过黑：保留夜间模式但让图标清晰可见 ===== */
:root.dark #scene .workflow-skill-card,
:root.dark .workflow-skill-card{
  background:linear-gradient(180deg, rgba(8,16,32,.98), rgba(9,18,36,.96)) !important;
  border-color:rgba(58,78,118,.96) !important;
}
:root.dark #scene .workflow-skill-card img,
:root.dark .workflow-skill-card img,
:root.dark #scene .workflow-skill-card .workflow-preview-img,
:root.dark .workflow-skill-card .workflow-preview-img,
:root.dark #scene .workflow-skill-card .wf-preview,
:root.dark .workflow-skill-card .wf-preview{
  background:linear-gradient(180deg, #111b2f 0%, #0c162a 100%) !important;
  border:1px solid rgba(64,88,132,.88) !important;
  mix-blend-mode:normal !important;
  opacity:1 !important;
  filter:brightness(.74) contrast(1.04) saturate(.96) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04), 0 12px 26px rgba(0,0,0,.24) !important;
}
:root.dark #scene .workflow-skill-card:hover img,
:root.dark .workflow-skill-card:hover img,
:root.dark #scene .workflow-skill-card:hover .workflow-preview-img,
:root.dark .workflow-skill-card:hover .workflow-preview-img,
:root.dark #scene .workflow-skill-card:hover .wf-preview,
:root.dark .workflow-skill-card:hover .wf-preview{
  mix-blend-mode:normal !important;
  opacity:1 !important;
  filter:brightness(.86) contrast(1.06) saturate(1) !important;
}


/* ===== V73 参考图同款蓝紫线性工作流图标 ===== */
.workflow-skill-card .wf-icon{
  width:22px !important;
  height:22px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#5f82ff !important;
  margin-bottom:9px !important;
  opacity:1 !important;
}
.workflow-skill-card .wf-icon svg{
  width:22px !important;
  height:22px !important;
  display:block !important;
  stroke:currentColor !important;
  fill:none !important;
  stroke-width:1.75 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  filter:drop-shadow(0 5px 12px rgba(93,130,255,.20));
}
.workflow-skill-card .wf-icon-sparkle svg,
.workflow-skill-card .wf-icon-wand svg{
  stroke-width:1.65 !important;
}
:root.dark .workflow-skill-card .wf-icon{
  color:#5f8dff !important;
}
:root.dark .workflow-skill-card .wf-icon svg{
  filter:drop-shadow(0 0 10px rgba(91,130,255,.35));
}

/* V74 exact workflow icons */
.workflow-skill-card .wf-icon{width:24px !important;height:24px !important;color:#5d87ff !important;margin-bottom:10px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;opacity:1 !important;}
.workflow-skill-card .wf-icon svg{width:24px !important;height:24px !important;stroke:currentColor !important;fill:none !important;stroke-width:1.8 !important;stroke-linecap:round !important;stroke-linejoin:round !important;filter:drop-shadow(0 0 8px rgba(93,135,255,.28));}
