/* ============================================================================
 * 提示词工程 · 两个可视化工具的统一样式（暗色主题 + 中文）
 *   · PromptFill（提示词填空器）：.pf-*
 *   · PromptStudio（可视化提示词编辑器）：.ops-*
 * ========================================================================== */

/* ============== 共通变量 ============== */
.pf-root, .ops-root {
    --bg: #0f141c;
    --bg-panel: #161c28;
    --bg-panel-2: #1e2430;
    --bg-panel-3: #2b3140;
    --border: #2b3140;
    --text: var(--bg-warm);
    --text-2: var(--border);
    --text-3: #8c99b3;
    --text-4: #6b7a95;
    --brand: #4aa3ff;
    --brand-2: #3a91ed;
    --danger: #f87171;
    --success: #10b981;
    --warning: #f59e0b;

    background: var(--bg);
    color: var(--text);
    min-height: calc(100vh - 60px);
    padding: 20px;
    box-sizing: border-box;
}

/* ======================================
 * PromptFill · 提示词填空器
 * ====================================== */
.pf-wrap {
    display: flex; flex-direction: column; gap: 16px;
    max-width: 1600px; margin: 0 auto;
}

.pf-header {
    display: flex; justify-content: space-between; align-items: flex-start;
    background: var(--bg-panel); border: 1px solid var(--border);
    border-radius: 12px; padding: 16px 20px;
}
.pf-header-title { display: flex; gap: 14px; align-items: flex-start; }
.pf-header-title > i {
    font-size: 26px; color: var(--brand);
    background: linear-gradient(135deg, rgba(74,163,255,.15), rgba(74,163,255,.05));
    width: 46px; height: 46px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
}
.pf-title { font-size: 18px; font-weight: 600; color: var(--text); }
.pf-sub { font-size: 12px; color: var(--text-3); margin-top: 4px; line-height: 1.5; max-width: 720px; }
.pf-sub a { color: var(--brand); text-decoration: none; }
.pf-sub a:hover { text-decoration: underline; }
.pf-header-actions { display: flex; gap: 8px; }

.pf-btn {
    padding: 7px 12px; border-radius: 6px;
    background: var(--bg-panel-3); border: 1px solid var(--border);
    color: var(--text-2); font-size: 12px; cursor: pointer;
    display: inline-flex; align-items: center; gap: 5px;
    transition: all .15s ease;
}
.pf-btn:hover { background: #3a3f4d; color: var(--text); }
.pf-btn.primary, .pf-btn.is-primary {
    background: linear-gradient(90deg, var(--brand), var(--brand-2));
    border-color: transparent; color: #fff; font-weight: 500;
}
.pf-btn.primary:hover { filter: brightness(1.1); }
.pf-btn.ghost { background: transparent; }
.pf-btn.ghost:hover { background: var(--bg-panel-2); }
.pf-btn.danger { color: var(--danger); }
.pf-btn.danger:hover { background: rgba(248,113,113,.1); border-color: rgba(248,113,113,.3); }
.pf-btn.xs { padding: 3px 8px; font-size: 11px; border-radius: 4px; }

.pf-main {
    display: grid;
    grid-template-columns: 260px 1fr 360px;
    gap: 16px;
    min-height: 600px;
}
.pf-col {
    background: var(--bg-panel); border: 1px solid var(--border);
    border-radius: 12px; overflow: hidden;
    display: flex; flex-direction: column;
}
.pf-col-title {
    padding: 12px 14px; border-bottom: 1px solid var(--border);
    font-size: 13px; font-weight: 600; color: var(--text-2);
    display: flex; justify-content: space-between; align-items: center;
}
.pf-col-title i { margin-right: 4px; opacity: .75; }
.pf-col-hint { font-size: 11px; color: var(--text-3); font-weight: 400; }

/* 模板库列表 */
.pf-tpl-list { overflow-y: auto; flex: 1; padding: 8px; }
.pf-tpl-list::-webkit-scrollbar { width: 6px; }
.pf-tpl-list::-webkit-scrollbar-thumb { background: #3a3f4d; border-radius: 3px; }
.pf-tpl-item {
    padding: 10px 12px; margin-bottom: 6px;
    background: var(--bg-panel-2); border: 1px solid transparent;
    border-radius: 8px; cursor: pointer;
    transition: all .15s ease;
}
.pf-tpl-item:hover { border-color: var(--brand-2); }
.pf-tpl-item.is-active { border-color: var(--brand); background: rgba(74,163,255,.08); }
.pf-tpl-item-name { font-size: 13px; font-weight: 600; color: var(--text); }
.pf-tpl-item-desc { font-size: 11px; color: var(--text-3); margin-top: 3px; line-height: 1.4; max-height: 30px; overflow: hidden; }
.pf-tpl-item-meta {
    font-size: 11px; color: var(--text-3); margin-top: 6px;
    display: flex; justify-content: space-between; align-items: center;
}
.pf-tpl-item-actions { display: flex; gap: 8px; }
.pf-tpl-item-actions i { cursor: pointer; opacity: .6; transition: opacity .15s ease; }
.pf-tpl-item-actions i:hover { opacity: 1; color: var(--text); }
.pf-tpl-item-actions i.fa-trash:hover { color: var(--danger); }

/* 中栏 */
.pf-col-mid { background: transparent; border: none; gap: 16px; }
.pf-card {
    background: var(--bg-panel); border: 1px solid var(--border);
    border-radius: 12px; overflow: hidden;
}
.pf-card-head {
    padding: 12px 14px; border-bottom: 1px solid var(--border);
    display: flex; justify-content: space-between; align-items: center; gap: 10px;
}
.pf-card-title { font-size: 13px; font-weight: 600; color: var(--text-2); }
.pf-card-head-actions { display: flex; gap: 8px; }
.pf-card-body { padding: 14px 16px; }

.pf-tpl-name-input, .pf-tpl-desc-input {
    background: var(--bg-panel-2); border: 1px solid var(--border);
    color: var(--text); padding: 6px 10px; border-radius: 6px;
    font-size: 13px;
}
.pf-tpl-name-input { font-weight: 600; flex: 0 0 220px; }
.pf-tpl-desc-input { flex: 1; color: var(--text-2); font-size: 12px; }
.pf-tpl-name-input:focus, .pf-tpl-desc-input:focus { border-color: var(--brand); outline: none; }

.pf-field-label {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 12px; color: var(--text-2); margin-bottom: 6px;
}
.pf-field-hint { font-size: 11px; color: var(--text-3); font-weight: 400; }
.pf-field-hint code {
    background: rgba(255,255,255,.05); padding: 1px 5px;
    border-radius: 3px; font-size: 11px; color: var(--text);
}

.pf-tpl-body {
    width: 100%; box-sizing: border-box;
    padding: 10px 12px;
    background: var(--bg-panel-2); border: 1px solid var(--border);
    color: var(--text); border-radius: 6px; font-size: 13px;
    font-family: 'Menlo','Monaco','Consolas',monospace;
    line-height: 1.6; resize: vertical;
}
.pf-tpl-body:focus { border-color: var(--brand); outline: none; }

.pf-highlight-preview {
    margin-top: 10px; padding: 10px 12px;
    background: var(--bg-panel-2); border: 1px dashed var(--border);
    border-radius: 6px; font-size: 12px; line-height: 1.8;
    color: var(--text-2); word-break: break-all;
}
.pf-var-chip {
    display: inline-flex; align-items: center; gap: 4px;
    background: rgba(74,163,255,.12); color: var(--brand);
    padding: 2px 7px; border-radius: 4px;
    font-size: 11px; font-weight: 500;
    margin: 0 2px;
}
.pf-var-chip i { font-style: normal; color: var(--text-3); font-size: 10px; }

.pf-result {
    padding: 12px; background: var(--bg-panel-2);
    border: 1px solid var(--border); border-radius: 6px;
    font-family: 'Menlo','Monaco','Consolas',monospace;
    font-size: 13px; line-height: 1.7; color: var(--text);
    word-break: break-all; white-space: pre-wrap;
    min-height: 56px;
}
.pf-result-meta {
    display: flex; gap: 16px; margin-top: 8px;
    font-size: 11px; color: var(--text-3);
}
.pf-result-meta i { margin-right: 4px; opacity: .75; }
.pf-empty-hint {
    color: var(--text-4); font-size: 12px; font-style: normal;
}
.pf-empty-hint code { background: rgba(255,255,255,.05); padding: 1px 4px; border-radius: 3px; }

/* 右栏 · 变量词库 */
.pf-bindings { padding: 10px; overflow-y: auto; flex: 1; }
.pf-bindings::-webkit-scrollbar { width: 6px; }
.pf-bindings::-webkit-scrollbar-thumb { background: #3a3f4d; border-radius: 3px; }
.pf-binding {
    background: var(--bg-panel-2); border: 1px solid var(--border);
    border-radius: 8px; padding: 10px; margin-bottom: 10px;
}
.pf-binding-head {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 8px;
}
.pf-binding-name {
    font-size: 12px; font-weight: 600; color: var(--text);
    display: flex; align-items: center; gap: 6px;
}
.pf-binding-name > i { color: var(--brand); font-size: 10px; }
.pf-binding-count {
    background: rgba(74,163,255,.15); color: var(--brand);
    padding: 1px 6px; border-radius: 10px; font-size: 10px; font-weight: 600;
}
.pf-binding-head-actions { display: flex; gap: 4px; }

.pf-opts { display: flex; flex-direction: column; gap: 4px; }
.pf-opt {
    padding: 5px 8px; background: var(--bg-panel-3);
    border: 1px solid transparent; border-radius: 4px;
    font-size: 11px; color: var(--text-2); cursor: pointer;
    display: flex; align-items: center; gap: 6px;
    transition: all .12s ease;
}
.pf-opt:hover { border-color: var(--brand-2); }
.pf-opt.is-picked {
    background: rgba(74,163,255,.15);
    border-color: var(--brand); color: var(--text); font-weight: 500;
}
.pf-opt-text { flex: 1; word-break: break-word; }
.pf-opt-actions { display: flex; gap: 6px; opacity: 0; transition: opacity .15s ease; }
.pf-opt:hover .pf-opt-actions { opacity: 1; }
.pf-opt-actions i {
    cursor: pointer; color: var(--text-3); font-size: 10px;
}
.pf-opt-actions i:hover { color: var(--text); }
.pf-opt-actions i.fa-times:hover { color: var(--danger); }

/* 响应式 */
@media (max-width: 1280px) {
    .pf-main { grid-template-columns: 220px 1fr 320px; }
}
@media (max-width: 1024px) {
    .pf-main { grid-template-columns: 1fr; }
}

/* ======================================
 * PromptStudio · 可视化提示词编辑器
 * ====================================== */
.ops-wrap {
    display: flex; flex-direction: column; gap: 16px;
    max-width: 1600px; margin: 0 auto;
}

.ops-header {
    display: flex; justify-content: space-between; align-items: flex-start;
    background: var(--bg-panel); border: 1px solid var(--border);
    border-radius: 12px; padding: 16px 20px;
}
.ops-header-title { display: flex; gap: 14px; align-items: flex-start; }
.ops-header-title > i {
    font-size: 26px; color: #e8c073;
    background: linear-gradient(135deg, rgba(167,139,250,.15), rgba(167,139,250,.05));
    width: 46px; height: 46px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
}
.ops-title { font-size: 18px; font-weight: 600; color: var(--text); }
.ops-sub { font-size: 12px; color: var(--text-3); margin-top: 4px; line-height: 1.5; max-width: 780px; }
.ops-sub a { color: #e8c073; text-decoration: none; }
.ops-sub a:hover { text-decoration: underline; }
.ops-header-actions { display: flex; gap: 8px; }

.ops-btn {
    padding: 7px 12px; border-radius: 6px;
    background: var(--bg-panel-3); border: 1px solid var(--border);
    color: var(--text-2); font-size: 12px; cursor: pointer;
    display: inline-flex; align-items: center; gap: 5px;
}
.ops-btn:hover { background: #3a3f4d; color: var(--text); }
.ops-btn.primary {
    background: linear-gradient(90deg, #e8c073, #b9791d);
    color: #fff; border-color: transparent;
}
.ops-btn.primary:hover { filter: brightness(1.1); }
.ops-btn.ghost { background: transparent; }
.ops-btn.ghost:hover { background: var(--bg-panel-2); }
.ops-btn.danger { color: var(--danger); }
.ops-btn.danger:hover { background: rgba(248,113,113,.1); border-color: rgba(248,113,113,.3); }
.ops-btn.xs { padding: 3px 8px; font-size: 11px; border-radius: 4px; }

.ops-input-bar {
    background: var(--bg-panel); border: 1px solid var(--border);
    border-radius: 12px; padding: 14px 16px;
    display: flex; flex-direction: column; gap: 10px;
}
.ops-input-head { font-size: 12px; color: var(--text-3); line-height: 1.5; }
.ops-input {
    width: 100%; box-sizing: border-box;
    padding: 8px 10px;
    background: var(--bg-panel-2); border: 1px solid var(--border);
    color: var(--text); border-radius: 6px;
    font-size: 13px; line-height: 1.6; resize: vertical;
    font-family: 'Menlo','Monaco','Consolas',monospace;
}
.ops-input:focus { border-color: #e8c073; outline: none; }
.ops-input-actions { display: flex; gap: 8px; }

.ops-main {
    display: grid; grid-template-columns: 1fr 360px; gap: 16px;
    min-height: 500px;
}
.ops-col-left { display: flex; flex-direction: column; gap: 14px; }
.ops-col-right {
    background: var(--bg-panel); border: 1px solid var(--border);
    border-radius: 12px; display: flex; flex-direction: column; overflow: hidden;
}

.ops-cards-head {
    display: flex; justify-content: space-between; align-items: center;
    padding: 4px 2px; font-size: 12px; color: var(--text-3);
}
.ops-col-hint { font-size: 11px; color: var(--text-4); }

.ops-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 10px;
}
.ops-card {
    background: var(--bg-panel); border: 1px solid var(--border);
    border-radius: 8px;
    display: flex; flex-direction: column;
    transition: all .15s ease;
    cursor: grab;
}
.ops-card:active { cursor: grabbing; }
.ops-card:hover { border-color: #e8c07366; }
.ops-card.is-hidden { opacity: 0.4; }
.ops-card-head {
    display: flex; justify-content: space-between; align-items: center;
    padding: 7px 10px; border-bottom: 1px solid var(--border);
}
.ops-card-type {
    font-size: 10px; padding: 2px 7px;
    border-radius: 10px; font-weight: 600;
}
.ops-card-actions { display: flex; gap: 8px; }
.ops-card-actions i {
    font-size: 12px; color: var(--text-3); cursor: pointer;
}
.ops-card-actions i:hover { color: var(--text); }
.ops-card-actions i.ops-card-del:hover { color: var(--danger); }
.ops-card-grip { cursor: grab; }

.ops-card-body { padding: 8px 10px; flex: 1; }
.ops-card-en {
    font-size: 13px; font-weight: 500; color: var(--text);
    word-break: break-all; line-height: 1.4;
    font-family: 'Menlo','Monaco','Consolas',monospace;
    outline: none; padding: 2px 0;
}
.ops-card-en:focus { background: var(--bg-panel-2); border-radius: 3px; padding: 2px 4px; }
.ops-card-zh {
    font-size: 11px; color: var(--text-3); margin-top: 4px;
    line-height: 1.5; outline: none;
}
.ops-card-zh:focus {
    background: var(--bg-panel-2); border-radius: 3px;
    padding: 2px 4px; color: var(--text-2);
}

.ops-card-foot { padding: 6px 10px 8px; }
.ops-card-foot select {
    width: 100%; padding: 3px 6px;
    background: var(--bg-panel-2); border: 1px solid var(--border);
    color: var(--text-2); border-radius: 4px;
    font-size: 11px; cursor: pointer;
}

.ops-empty {
    padding: 40px; text-align: center;
    color: var(--text-4); font-size: 13px;
    background: var(--bg-panel); border: 1px dashed var(--border);
    border-radius: 8px;
    grid-column: 1/-1;
}
.ops-empty.small { padding: 24px; font-size: 12px; }

.ops-final {
    background: var(--bg-panel); border: 1px solid var(--border);
    border-radius: 12px; padding: 12px 14px;
}
.ops-final-head {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 12px; color: var(--text-3); margin-bottom: 8px;
}
.ops-final-stats { font-size: 11px; }
.ops-final-text {
    margin: 0; padding: 10px 12px;
    background: var(--bg-panel-2); border: 1px solid var(--border);
    border-radius: 6px; color: var(--text);
    font-size: 13px; line-height: 1.7; word-break: break-all;
    white-space: pre-wrap;
    font-family: 'Menlo','Monaco','Consolas',monospace;
}
.ops-final-text em { color: var(--text-4); font-style: normal; }

/* 词典 */
.ops-dict { display: flex; flex-direction: column; flex: 1; overflow: hidden; }
.ops-dict-head {
    padding: 12px 14px; border-bottom: 1px solid var(--border);
    display: flex; justify-content: space-between; align-items: center;
    font-size: 13px; font-weight: 600; color: var(--text-2);
}
.ops-dict-tabs {
    padding: 8px 10px; display: flex; gap: 4px; flex-wrap: wrap;
    border-bottom: 1px solid var(--border);
}
.ops-dict-tab {
    padding: 4px 10px; border-radius: 4px;
    background: var(--bg-panel-2); border: 1px solid transparent;
    color: var(--text-3); font-size: 11px; cursor: pointer;
}
.ops-dict-tab:hover { color: var(--text); }
.ops-dict-tab.is-active {
    background: rgba(167,139,250,.15); color: #e8c073;
    border-color: #e8c07355;
}
.ops-dict-search {
    margin: 10px; padding: 6px 10px;
    background: var(--bg-panel-2); border: 1px solid var(--border);
    color: var(--text); border-radius: 6px; font-size: 12px;
}
.ops-dict-search:focus { border-color: #e8c073; outline: none; }

.ops-dict-list { flex: 1; overflow-y: auto; padding: 0 8px 10px; }
.ops-dict-list::-webkit-scrollbar { width: 6px; }
.ops-dict-list::-webkit-scrollbar-thumb { background: #3a3f4d; border-radius: 3px; }
.ops-dict-item {
    display: flex; gap: 10px; align-items: center;
    padding: 7px 8px; margin-bottom: 4px;
    background: var(--bg-panel-2); border: 1px solid transparent;
    border-radius: 6px; cursor: pointer;
    transition: all .12s ease;
}
.ops-dict-item:hover { border-color: #e8c073; background: rgba(167,139,250,.08); }
.ops-dict-item-type {
    flex: 0 0 36px; text-align: center;
    font-size: 10px; padding: 2px 0;
    border-radius: 3px; font-weight: 600;
}
.ops-dict-item-main { flex: 1; min-width: 0; }
.ops-dict-item-en {
    font-size: 12px; color: var(--text); font-weight: 500;
    font-family: 'Menlo','Monaco','Consolas',monospace;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ops-dict-item-zh { font-size: 11px; color: var(--text-3); margin-top: 2px; }
.ops-dict-item > i { color: var(--text-3); font-size: 11px; }
.ops-dict-item:hover > i { color: #e8c073; }

/* 响应式 */
@media (max-width: 1024px) {
    .ops-main { grid-template-columns: 1fr; }
}

/* ======================================
 * 中文使用指南 + 模板分类 Tab（v2 追加）
 * ====================================== */

/* ---- PromptFill 使用指南 ---- */
.pf-guide {
    background: linear-gradient(135deg, rgba(74,163,255,.06), rgba(74,163,255,.02));
    border: 1px solid rgba(74,163,255,.22);
    border-radius: 12px;
    padding: 14px 18px;
    display: flex; flex-direction: column; gap: 10px;
}
.pf-guide-head {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 13px; font-weight: 600; color: var(--text);
}
.pf-guide-head i { margin-right: 6px; color: var(--brand); }
.pf-guide-body {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}
.pf-guide-step {
    display: flex; gap: 10px; align-items: flex-start;
    background: var(--bg-panel-2);
    border: 1px solid var(--border);
    border-radius: 8px; padding: 10px;
}
.pf-guide-num {
    flex: 0 0 28px; height: 28px;
    background: linear-gradient(135deg, var(--brand), var(--brand-2));
    color: #fff; font-size: 14px; font-weight: 600;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
}
.pf-guide-step b {
    display: block; font-size: 13px; color: var(--text); margin-bottom: 4px;
}
.pf-guide-step p {
    margin: 0; font-size: 11.5px; color: var(--text-3); line-height: 1.55;
}
.pf-guide-step code,
.pf-guide-tip code {
    background: rgba(74,163,255,.15); color: var(--brand);
    padding: 1px 5px; border-radius: 3px; font-size: 11px;
    font-family: 'Menlo','Monaco','Consolas',monospace;
}
.pf-guide-tip {
    font-size: 11.5px; color: var(--text-2);
    padding: 8px 12px;
    background: rgba(245, 158, 11, .08);
    border-left: 3px solid var(--warning);
    border-radius: 4px;
    line-height: 1.6;
}
.pf-guide-tip i { color: var(--warning); margin-right: 5px; }
.pf-guide-reopen { margin-bottom: 4px; }

@media (max-width: 1200px) {
    .pf-guide-body { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
    .pf-guide-body { grid-template-columns: 1fr; }
}

/* ---- PromptFill 模板分类 Tab ---- */
.pf-tpl-tabs {
    display: flex; gap: 4px;
    padding: 8px 8px 6px;
    border-bottom: 1px solid var(--border);
}
.pf-tpl-tab {
    flex: 1;
    padding: 5px 6px;
    background: var(--bg-panel-2); border: 1px solid transparent;
    color: var(--text-3); font-size: 11px; cursor: pointer;
    border-radius: 5px;
    display: inline-flex; align-items: center; justify-content: center; gap: 5px;
    transition: all .15s ease;
}
.pf-tpl-tab:hover { color: var(--text); }
.pf-tpl-tab.is-active {
    background: rgba(74,163,255,.15);
    border-color: rgba(74,163,255,.4);
    color: var(--brand);
    font-weight: 600;
}
.pf-tpl-tab-count {
    font-size: 10px; font-weight: 600;
    background: rgba(255,255,255,.1);
    padding: 1px 5px; border-radius: 8px;
    color: var(--text-2);
}
.pf-tpl-tab.is-active .pf-tpl-tab-count {
    background: rgba(74,163,255,.25);
    color: var(--brand);
}

/* 模板卡片上的分类小标签 */
.pf-tpl-cat {
    display: inline-block;
    font-size: 9px; font-weight: 600;
    padding: 1px 6px;
    border-radius: 8px;
    margin-right: 6px;
    vertical-align: middle;
    letter-spacing: .3px;
}
.pf-tpl-cat.drama {
    background: rgba(245, 158, 11, .15);
    color: var(--warning);
}
.pf-tpl-cat.general {
    background: rgba(74,163,255,.12);
    color: var(--brand);
}

/* ---- PromptStudio 使用指南 ---- */
.ops-guide {
    background: linear-gradient(135deg, rgba(167,139,250,.06), rgba(167,139,250,.02));
    border: 1px solid rgba(167,139,250,.22);
    border-radius: 12px;
    padding: 14px 18px;
    display: flex; flex-direction: column; gap: 12px;
}
.ops-guide-head {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 13px; font-weight: 600; color: var(--text);
}
.ops-guide-head i { margin-right: 6px; color: #e8c073; }
.ops-guide-body {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}
.ops-guide-col {
    background: var(--bg-panel-2);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 12px 14px;
}
.ops-guide-title {
    font-size: 12.5px; font-weight: 600;
    color: var(--text); margin-bottom: 8px;
    display: flex; align-items: center; gap: 6px;
}
.ops-guide-title i { color: #e8c073; font-size: 12px; }
.ops-guide-col ol,
.ops-guide-col ul {
    margin: 0; padding-left: 18px;
    font-size: 11.5px; color: var(--text-2);
    line-height: 1.7;
}
.ops-guide-col li { margin-bottom: 3px; }
.ops-guide-col code {
    background: rgba(167,139,250,.18);
    color: #e8c073;
    padding: 1px 5px; border-radius: 3px; font-size: 11px;
    font-family: 'Menlo','Monaco','Consolas',monospace;
}
.ops-guide-col b { color: var(--text); }
.ops-guide-cates li,
.ops-guide-tips li {
    list-style: none; padding-left: 0;
}
.ops-guide-cates { padding-left: 0 !important; }
.ops-guide-tips { padding-left: 0 !important; }
.ops-cate-chip {
    display: inline-block;
    font-size: 10px; font-weight: 600;
    padding: 1px 8px;
    border-radius: 10px;
    margin-right: 6px;
    vertical-align: middle;
}
.ops-guide-reopen { margin-bottom: 4px; }

@media (max-width: 1024px) {
    .ops-guide-body { grid-template-columns: 1fr; }
}

/* ======================================
 * PromptFill · 变量插入工具条（v3）
 * ====================================== */
.pf-var-toolbar {
    display: flex; flex-wrap: wrap; gap: 6px;
    padding: 8px 10px;
    background: var(--bg-panel-2);
    border: 1px solid var(--border);
    border-bottom: none;
    border-radius: 6px 6px 0 0;
    align-items: center;
}
.pf-var-toolbar-label {
    font-size: 11px; color: var(--text-3);
    display: inline-flex; align-items: center; gap: 4px;
    margin-right: 2px;
}
.pf-var-toolbar-label i { color: var(--warning); font-size: 10px; }
.pf-var-toolbar-empty {
    font-size: 11px; color: var(--text-4); font-style: italic;
}

/* 现有变量快速插入 chip */
.pf-var-insert-chip {
    padding: 3px 8px;
    background: rgba(74,163,255,.12);
    border: 1px solid rgba(74,163,255,.25);
    color: var(--brand);
    font-size: 11px; font-weight: 500;
    border-radius: 10px; cursor: pointer;
    display: inline-flex; align-items: center; gap: 4px;
    transition: all .12s ease;
}
.pf-var-insert-chip i { font-size: 9px; opacity: .7; }
.pf-var-insert-chip:hover {
    background: rgba(74,163,255,.25);
    border-color: var(--brand);
    color: #fff;
    transform: translateY(-1px);
}
.pf-var-insert-chip:active { transform: translateY(0); }

/* 新增变量 + 复制正文 按钮 */
.pf-var-add-btn {
    padding: 3px 10px;
    background: linear-gradient(90deg, var(--brand), var(--brand-2));
    border: none; color: #fff;
    font-size: 11px; font-weight: 600;
    border-radius: 10px; cursor: pointer;
    display: inline-flex; align-items: center; gap: 5px;
    margin-left: auto;
    transition: filter .12s ease;
}
.pf-var-add-btn:hover { filter: brightness(1.1); }
.pf-var-add-btn.ghost {
    background: transparent;
    border: 1px solid var(--border);
    color: var(--text-3);
    margin-left: 0;
}
.pf-var-add-btn.ghost:hover { background: var(--bg-panel-3); color: var(--text); }

/* textarea 与工具条对齐 */
.pf-tpl-body {
    border-radius: 0 0 6px 6px !important;
}

/* ======================================
 * PromptFill v2 · 完整继承开源版新增样式
 * ====================================== */

/* 顶部版本号 / 语言切换 */
.pf-ver {
    display: inline-block; margin-left: 6px;
    padding: 1px 6px; font-size: 10px; font-weight: 500;
    background: rgba(74,163,255,.15); color: var(--brand);
    border-radius: 10px; vertical-align: middle;
}
.pf-lang-switch {
    display: inline-flex; background: var(--bg-panel-3);
    border: 1px solid var(--border); border-radius: 6px; overflow: hidden;
    margin-right: 4px;
}
.pf-lang-switch button {
    padding: 5px 12px; background: transparent; color: var(--text-3);
    border: none; font-size: 12px; font-weight: 600; cursor: pointer;
    transition: all .15s ease;
}
.pf-lang-switch button.is-active {
    background: linear-gradient(90deg, var(--brand), var(--brand-2));
    color: #fff;
}
.pf-lang-switch button:not(.is-active):hover { color: var(--text); background: var(--bg-panel-2); }

/* 标签过滤行 */
.pf-tag-filter {
    display: flex; flex-wrap: wrap; gap: 6px;
    background: var(--bg-panel); border: 1px solid var(--border);
    border-radius: 12px; padding: 10px 14px;
}
.pf-tag-btn {
    padding: 5px 10px; font-size: 12px; border-radius: 20px;
    background: var(--bg-panel-2); border: 1px solid var(--border);
    color: var(--text-3); cursor: pointer;
    transition: all .15s ease;
    display: inline-flex; align-items: center; gap: 5px;
}
.pf-tag-btn:hover { color: var(--text); border-color: var(--brand-2); }
.pf-tag-btn.is-active {
    background: linear-gradient(90deg, rgba(74,163,255,.2), rgba(74,163,255,.08));
    color: var(--brand); border-color: var(--brand);
}
.pf-tag-count {
    font-size: 10px; background: rgba(255,255,255,.06);
    padding: 1px 5px; border-radius: 8px; color: inherit;
}

/* 左栏：模板卡片（封面 + 作者 + tags） */
.pf-tpl-cards {
    display: flex; flex-direction: column; gap: 8px;
    padding: 10px; overflow-y: auto; flex: 1;
}
.pf-tpl-cards::-webkit-scrollbar { width: 6px; }
.pf-tpl-cards::-webkit-scrollbar-thumb { background: #3a3f4d; border-radius: 3px; }
.pf-tpl-card {
    position: relative; cursor: pointer;
    background: var(--bg-panel-2); border: 1px solid transparent;
    border-radius: 10px; overflow: hidden;
    transition: all .15s ease;
    display: flex; flex-direction: column;
}
.pf-tpl-card:hover { border-color: var(--brand-2); transform: translateY(-1px); }
.pf-tpl-card.is-active {
    border-color: var(--brand);
    background: rgba(74,163,255,.1);
    box-shadow: 0 4px 12px rgba(74,163,255,.15);
}
.pf-tpl-cover {
    width: 100%; height: 110px;
    background-size: cover; background-position: center;
    background-color: var(--bg-panel-3);
    border-bottom: 1px solid var(--border);
}
.pf-tpl-cover-empty {
    display: flex; align-items: center; justify-content: center;
    color: var(--text-4); font-size: 24px;
}
.pf-tpl-card-body { padding: 10px 12px; }
.pf-tpl-card-name {
    font-size: 13px; font-weight: 600; color: var(--text);
    line-height: 1.3; margin-bottom: 6px;
    display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.pf-tpl-badge-official, .pf-tpl-badge-custom {
    font-size: 9px; font-weight: 500;
    padding: 1px 6px; border-radius: 3px;
}
.pf-tpl-badge-official { background: rgba(16,185,129,.15); color: var(--success); }
.pf-tpl-badge-custom   { background: rgba(245,158,11,.15); color: var(--warning); }

.pf-tpl-card-meta {
    display: flex; flex-wrap: wrap; gap: 5px;
    font-size: 11px; color: var(--text-3); align-items: center;
}
.pf-tpl-author { color: var(--text-3); }
.pf-tpl-author i { margin-right: 3px; opacity: .7; }
.pf-tpl-tag {
    background: rgba(255,255,255,.06);
    padding: 1px 6px; border-radius: 3px;
    font-size: 10px; color: var(--text-2);
}

.pf-tpl-actions {
    position: absolute; top: 8px; right: 8px;
    display: flex; gap: 4px; opacity: 0;
    transition: opacity .15s ease;
}
.pf-tpl-card:hover .pf-tpl-actions { opacity: 1; }
.pf-tpl-actions i {
    width: 24px; height: 24px;
    background: rgba(0,0,0,.55); color: #fff;
    border-radius: 4px; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 11px;
}
.pf-tpl-actions i:hover { background: rgba(0,0,0,.85); }
.pf-tpl-actions i.fa-trash:hover { background: var(--danger); }

/* 中栏：封面大图 + 模板标题 + 合成结果 */
.pf-tpl-preview {
    border-radius: 12px; overflow: hidden;
    border: 1px solid var(--border);
    background: var(--bg-panel);
    max-height: 280px;
    display: flex; justify-content: center;
}
.pf-tpl-preview img {
    max-width: 100%; max-height: 280px;
    object-fit: contain; display: block;
}
.pf-card-author {
    font-size: 11px; font-weight: 400;
    color: var(--text-3); margin-left: 8px;
}

/* 彩色变量 chip（使用 inline style 指定颜色） */
.pf-var-chip {
    background: transparent !important;
    border: 1px solid;
    padding: 2px 8px !important;
}
.pf-var-chip sup {
    font-size: 9px; margin-left: 2px; opacity: .75;
    background: rgba(255,255,255,.12);
    padding: 0 3px; border-radius: 2px;
}

/* 高亮预览大区 */
.pf-highlight-big {
    font-size: 13px !important; line-height: 2 !important;
    padding: 14px 16px !important;
    max-height: 420px; overflow-y: auto;
    background: var(--bg-panel-2);
    white-space: pre-wrap;
}
.pf-highlight-big::-webkit-scrollbar { width: 6px; }
.pf-highlight-big::-webkit-scrollbar-thumb { background: #3a3f4d; border-radius: 3px; }

/* 右栏：分类分区 */
.pf-cat-section { margin-bottom: 14px; }
.pf-cat-head {
    display: flex; align-items: center; gap: 6px;
    font-size: 11px; font-weight: 700;
    letter-spacing: 0.5px; text-transform: uppercase;
    border-left: 3px solid;
    padding: 4px 10px; margin-bottom: 8px;
    background: rgba(255,255,255,.02); border-radius: 0 4px 4px 0;
}
.pf-cat-head i { font-size: 8px; }
.pf-cat-count {
    margin-left: auto;
    background: rgba(255,255,255,.08);
    padding: 1px 6px; border-radius: 8px;
    font-size: 10px; color: var(--text-3);
}

.pf-binding { border-left: 3px solid var(--cat-color, var(--brand)); }
.pf-binding-key {
    font-size: 10px; color: var(--text-4);
    font-family: 'Menlo','Monaco','Consolas',monospace;
    background: rgba(255,255,255,.04);
    padding: 1px 5px; border-radius: 3px; margin-left: 4px;
}
.pf-binding-inst { margin-bottom: 6px; }
.pf-binding-inst:last-child { margin-bottom: 0; }
.pf-binding-inst-idx {
    font-size: 10px; color: var(--text-3);
    margin: 2px 0 4px 0;
}

/* 选中候选项彩色高亮（inline style 会覆盖） */
.pf-opt.is-picked {
    background: rgba(74,163,255,.1) !important;
}

/* ======================================
 * v2.1 · 内联编辑 + 智能补全 + 社交分享
 * ====================================== */

/* 内联编辑器提示条 */
.pf-editor-hint {
    font-size: 11px; color: var(--text-3);
    margin-bottom: 6px;
    display: flex; align-items: center; gap: 4px;
}
.pf-editor-hint code {
    background: rgba(255,255,255,.06);
    padding: 1px 5px; border-radius: 3px;
    font-family: 'Menlo','Monaco','Consolas',monospace;
    font-size: 10px; color: var(--brand);
}

/* 编辑器 textarea 样式覆盖 */
#pfTplBody {
    width: 100%; box-sizing: border-box;
    padding: 12px 14px;
    background: var(--bg-panel-2);
    border: 1px solid var(--brand-2);
    color: var(--text);
    border-radius: 6px;
    font-size: 13px;
    font-family: 'Menlo','Monaco','Consolas',monospace;
    line-height: 1.8;
    resize: vertical;
    min-height: 120px;
    outline: none;
}
#pfTplBody:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(74,163,255,.12); }

/* 智能补全面板 */
.pf-ac-panel {
    position: relative;
    margin-top: 4px;
    max-height: 280px; overflow-y: auto;
    background: var(--bg-panel);
    border: 1px solid var(--brand);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,.4);
    z-index: 10;
}
.pf-ac-panel::-webkit-scrollbar { width: 6px; }
.pf-ac-panel::-webkit-scrollbar-thumb { background: #3a3f4d; border-radius: 3px; }
.pf-ac-item {
    display: flex; align-items: flex-start; gap: 10px;
    padding: 8px 12px; cursor: pointer;
    border-bottom: 1px solid rgba(255,255,255,.04);
    transition: background .1s ease;
}
.pf-ac-item:last-child { border-bottom: none; }
.pf-ac-item:hover, .pf-ac-item.is-focus {
    background: rgba(74,163,255,.1);
}
.pf-ac-cat {
    flex: 0 0 4px; width: 4px; height: 32px;
    border-radius: 2px; margin-top: 2px;
}
.pf-ac-body { flex: 1; min-width: 0; }
.pf-ac-name {
    font-size: 12px; color: var(--text);
    display: flex; align-items: center; gap: 6px;
}
.pf-ac-name b { font-weight: 600; }
.pf-ac-key {
    font-size: 10px;
    color: var(--text-4);
    font-family: 'Menlo','Monaco','Consolas',monospace;
    background: rgba(255,255,255,.05);
    padding: 1px 5px; border-radius: 3px;
}
.pf-ac-preview {
    font-size: 11px; color: var(--text-3);
    margin-top: 2px;
    white-space: nowrap; text-overflow: ellipsis; overflow: hidden;
}

/* ======================================
 * v2.2 · 新建模板模态框 + 自定义/短剧 tab
 * ====================================== */

/* 特殊 tab：自定义 / 短剧 */
.pf-tag-btn.pf-tag-special {
    background: linear-gradient(90deg, rgba(245,158,11,.12), rgba(245,158,11,.04));
    color: var(--warning);
    border-color: rgba(245,158,11,.3);
}
.pf-tag-btn.pf-tag-special.is-active {
    background: linear-gradient(90deg, rgba(245,158,11,.3), rgba(245,158,11,.12));
    color: var(--warning);
    border-color: var(--warning);
    box-shadow: 0 2px 8px rgba(245,158,11,.25);
}
.pf-tag-btn.pf-tag-special i { font-size: 11px; }

/* 新建模态框 */
.pf-modal {
    position: fixed; inset: 0; z-index: 2000;
    display: flex; align-items: center; justify-content: center;
}
.pf-modal-back {
    position: absolute; inset: 0;
    background: rgba(0,0,0,.65);
    backdrop-filter: blur(4px);
}
.pf-modal-wrap {
    position: relative; z-index: 1;
    width: 720px; max-width: calc(100vw - 40px);
    max-height: calc(100vh - 60px);
    background: var(--bg-panel);
    border: 1px solid var(--border);
    border-radius: 14px;
    display: flex; flex-direction: column;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,.5);
}
.pf-modal-head {
    padding: 16px 22px;
    border-bottom: 1px solid var(--border);
    font-size: 15px; font-weight: 600; color: var(--text);
    display: flex; align-items: center; gap: 8px;
    background: linear-gradient(180deg, rgba(74,163,255,.08), transparent);
}
.pf-modal-head > i { color: var(--brand); }
.pf-modal-close {
    margin-left: auto; cursor: pointer;
    color: var(--text-3);
    width: 28px; height: 28px;
    border-radius: 6px;
    display: inline-flex; align-items: center; justify-content: center;
    transition: all .15s ease;
}
.pf-modal-close:hover { background: var(--bg-panel-3); color: var(--text); }
.pf-modal-body {
    padding: 20px 22px; overflow-y: auto; flex: 1;
}
.pf-modal-body::-webkit-scrollbar { width: 6px; }
.pf-modal-body::-webkit-scrollbar-thumb { background: #3a3f4d; border-radius: 3px; }
.pf-modal-foot {
    padding: 14px 22px;
    border-top: 1px solid var(--border);
    display: flex; justify-content: flex-end; gap: 10px;
    background: var(--bg-panel-2);
}

/* 新建 · 模式切换卡 */
.pf-nt-modes {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 10px; margin-bottom: 20px;
}
.pf-nt-mode {
    padding: 14px 14px;
    background: var(--bg-panel-2);
    border: 1.5px solid var(--border);
    border-radius: 10px;
    cursor: pointer;
    display: flex; gap: 10px; align-items: flex-start;
    transition: all .15s ease;
}
.pf-nt-mode:hover { border-color: var(--brand-2); transform: translateY(-1px); }
.pf-nt-mode.is-active {
    border-color: var(--brand);
    background: rgba(74,163,255,.1);
    box-shadow: 0 0 0 3px rgba(74,163,255,.12);
}
.pf-nt-mode > i {
    width: 28px; height: 28px; flex: 0 0 28px;
    border-radius: 6px;
    background: linear-gradient(135deg, var(--brand), var(--brand-2));
    color: #fff; font-size: 13px;
    display: inline-flex; align-items: center; justify-content: center;
}
.pf-nt-mode > div b { font-size: 13px; font-weight: 600; color: var(--text); }
.pf-nt-mode > div > div { font-size: 11px; color: var(--text-3); margin-top: 2px; line-height: 1.4; }

/* 新建 · 字段 */
.pf-nt-field { margin-bottom: 16px; }
.pf-nt-field > label {
    display: block; margin-bottom: 6px;
    font-size: 12px; font-weight: 600; color: var(--text-2);
}
.pf-nt-field label code {
    background: rgba(255,255,255,.06);
    padding: 1px 4px; border-radius: 3px;
    font-size: 11px; color: var(--brand);
}
.pf-nt-sub { font-size: 11px; color: var(--text-3); font-weight: 400; margin-left: 4px; }
.pf-nt-input, .pf-nt-textarea {
    width: 100%; box-sizing: border-box;
    padding: 9px 12px;
    background: var(--bg-panel-2);
    border: 1px solid var(--border);
    color: var(--text);
    border-radius: 6px;
    font-size: 13px;
    outline: none;
    transition: border-color .15s;
}
.pf-nt-textarea {
    font-family: 'Menlo','Monaco','Consolas',monospace;
    line-height: 1.7;
    resize: vertical;
    min-height: 100px;
}
.pf-nt-input:focus, .pf-nt-textarea:focus { border-color: var(--brand); }
.pf-nt-hint {
    margin-top: 6px; font-size: 11px; color: var(--text-3);
}
.pf-nt-hint code {
    background: rgba(255,255,255,.06);
    padding: 1px 4px; border-radius: 3px;
    font-size: 11px; color: var(--brand);
}

/* 新建 · 变量勾选 */
.pf-nt-bank-wrap {
    max-height: 320px; overflow-y: auto;
    background: var(--bg-panel-2);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 10px 12px;
}
.pf-nt-bank-wrap::-webkit-scrollbar { width: 5px; }
.pf-nt-bank-wrap::-webkit-scrollbar-thumb { background: #3a3f4d; border-radius: 3px; }
.pf-nt-bank-group { margin-bottom: 12px; }
.pf-nt-bank-group:last-child { margin-bottom: 0; }
.pf-nt-bank-cat {
    font-size: 11px; font-weight: 700;
    letter-spacing: 0.5px;
    padding-bottom: 4px;
    margin-bottom: 6px;
    border-bottom: 1px dashed rgba(255,255,255,.06);
}
.pf-nt-bank-items {
    display: flex; flex-wrap: wrap; gap: 6px;
}
.pf-nt-bank-chk {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 4px 8px;
    background: rgba(255,255,255,.02);
    border: 1px solid var(--border);
    border-radius: 14px;
    font-size: 11px;
    color: var(--text-2);
    cursor: pointer;
    transition: all .15s ease;
}
.pf-nt-bank-chk:hover { background: var(--bg-panel-3); color: var(--text); }
.pf-nt-bank-chk input { margin: 0; cursor: pointer; width: 12px; height: 12px; }
.pf-nt-bank-chk .dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; }
.pf-nt-bank-chk:has(input:checked) {
    background: rgba(74,163,255,.15);
    border-color: var(--brand);
    color: var(--brand);
}

/* 新建 · 标签多选 */
.pf-nt-tags {
    display: flex; flex-wrap: wrap; gap: 5px;
}
.pf-nt-tag-chk {
    padding: 3px 10px;
    background: var(--bg-panel-3);
    border: 1px solid var(--border);
    border-radius: 14px;
    font-size: 11px; color: var(--text-3);
    cursor: pointer; user-select: none;
}
.pf-nt-tag-chk:hover { color: var(--text); }
.pf-nt-tag-chk input { display: none; }
.pf-nt-tag-chk:has(input:checked) {
    background: rgba(74,163,255,.18);
    border-color: var(--brand);
    color: var(--brand);
}

/* ============================================================================
 * Prompt Studio v2 · 对齐 Moonvy/OpenPromptStudio 新增样式
 * ========================================================================== */

.ops-badge-v2 {
    display: inline-block; margin-left: 6px;
    padding: 1px 7px; font-size: 10px; font-weight: 600;
    background: linear-gradient(90deg, #4aa3ff, #3a91ed);
    color: #fff; border-radius: 10px; vertical-align: middle;
}

/* —— 指南：dir 徽章列表 —— */
.ops-guide-dirs {
    display: flex; flex-wrap: wrap; gap: 4px;
}
.ops-dir-badge {
    display: inline-block;
    padding: 2px 7px;
    font-size: 10px;
    background: rgba(74,163,255,.1);
    color: #60a5fa;
    border-radius: 3px;
    border: 1px solid rgba(74,163,255,.2);
}

/* —— MJ 命令速查面板 —— */
.ops-mj-panel {
    margin: 12px 0;
    background: var(--bg-panel);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
}
.ops-mj-head {
    display: flex; justify-content: space-between; align-items: center;
    padding: 10px 14px;
    font-size: 13px; font-weight: 600;
    background: linear-gradient(180deg, rgba(245,158,11,.1), transparent);
    border-bottom: 1px solid var(--border);
    color: var(--text);
}
.ops-mj-head > span > i { color: #f59e0b; margin-right: 5px; }
.ops-mj-body {
    padding: 12px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 10px;
    max-height: 320px;
    overflow-y: auto;
}
.ops-mj-body::-webkit-scrollbar { width: 6px; }
.ops-mj-body::-webkit-scrollbar-thumb { background: #3a3f4d; border-radius: 3px; }
.ops-mj-item {
    padding: 9px 11px;
    background: var(--bg-panel-2);
    border: 1px solid var(--border);
    border-radius: 7px;
    cursor: pointer;
    transition: all .15s ease;
}
.ops-mj-item:hover {
    border-color: #f59e0b;
    background: rgba(245,158,11,.06);
    transform: translateY(-1px);
}
.ops-mj-keys {
    display: flex; flex-wrap: wrap; gap: 4px;
    margin-bottom: 4px;
}
.ops-mj-keys code {
    background: rgba(245,158,11,.15);
    color: #f59e0b;
    padding: 1px 6px;
    border-radius: 3px;
    font-size: 11px;
    font-family: 'Menlo','Monaco','Consolas',monospace;
}
.ops-mj-zh {
    font-size: 12px; color: var(--text);
    margin-bottom: 2px;
}
.ops-mj-zh em {
    color: var(--text-3); font-style: normal;
    font-size: 11px;
    background: rgba(255,255,255,.04);
    padding: 1px 4px; border-radius: 3px;
    margin-left: 3px;
}
.ops-mj-desc {
    font-size: 11px; color: var(--text-3);
    line-height: 1.4;
}

/* —— 词典：dir 子分类 tab —— */
.ops-dir-tabs {
    display: flex; flex-wrap: wrap; gap: 4px;
    padding: 6px 0 8px;
    border-bottom: 1px dashed rgba(255,255,255,.06);
    margin-bottom: 8px;
}
.ops-dir-tab {
    padding: 3px 8px;
    font-size: 11px;
    background: transparent;
    color: var(--text-3);
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    transition: all .15s ease;
}
.ops-dir-tab:hover { color: var(--text); background: var(--bg-panel-3); }
.ops-dir-tab.is-active {
    background: rgba(74,163,255,.15);
    color: #4aa3ff;
    border-color: rgba(74,163,255,.3);
}
.ops-dir-tab-n {
    font-size: 10px;
    color: inherit;
    opacity: .7;
    margin-left: 2px;
}

/* —— 词典 tab 数量徽标 —— */
.ops-dict-tab-n {
    font-size: 10px;
    background: rgba(255,255,255,.08);
    padding: 0 5px;
    border-radius: 8px;
    margin-left: 4px;
    color: inherit;
}

/* —— 词典条目扩展 —— */
.ops-dict-custom {
    display: inline-block;
    margin-left: 5px;
    padding: 0 5px;
    font-size: 9px;
    font-weight: 600;
    background: rgba(245,158,11,.2);
    color: #f59e0b;
    border-radius: 3px;
    vertical-align: middle;
}
.ops-dict-dir {
    color: var(--text-4);
    font-style: normal;
    font-size: 10px;
    background: rgba(255,255,255,.04);
    padding: 1px 4px;
    border-radius: 3px;
    margin-left: 2px;
}

/* 词典底部统计 */
.ops-dict-foot {
    padding: 8px 4px 0;
    font-size: 10px;
    color: var(--text-4);
    text-align: center;
    border-top: 1px dashed rgba(255,255,255,.04);
    margin-top: 4px;
}

/* 展开指南的 reopen 按钮 */
.ops-guide-reopen {
    display: inline-flex !important;
    margin: 8px 0 !important;
}

/* ============================================================================
 * v2.3 · 新建模板模态框 · UI 加亮优化 + OPS 词典导入区
 * ============================================================================
 * 目标：把模态框从"一片墨黑看不清"改为清晰可读的暗色面板
 *   - 主面板背景从 var(--bg-panel) #161c28 → 更亮的 #232936
 *   - 标题栏加深色渐变 + 高对比度白字
 *   - 输入框/按钮/勾选 chip 提升对比度
 */

/* 主容器：加亮 + 更强阴影 */
#pfNewTplModal .pf-modal-wrap {
    background: #232936 !important;               /* 比原 #161c28 明显更亮 */
    border: 1px solid #3a4152 !important;
    box-shadow: 0 25px 70px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.03);
}

/* 顶部标题栏：更饱满的蓝色渐变 + 更大字号 + 白字 */
#pfNewTplModal .pf-modal-head {
    padding: 18px 24px !important;
    background: linear-gradient(135deg, rgba(74,163,255,.22), rgba(167,139,250,.12)) !important;
    border-bottom: 1px solid #3a4152 !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px;
}
#pfNewTplModal .pf-modal-head > i {
    color: #60a5fa !important;
    font-size: 18px;
}
#pfNewTplModal .pf-modal-close {
    background: rgba(255,255,255,.06);
    color: var(--border) !important;
}
#pfNewTplModal .pf-modal-close:hover {
    background: rgba(239,68,68,.2);
    color: #fff !important;
}

/* 底部按钮栏：更亮的背景 */
#pfNewTplModal .pf-modal-foot {
    background: #1b212c !important;
    border-top: 1px solid #3a4152 !important;
    padding: 16px 24px !important;
}

/* 模式卡：默认更亮 + 激活状态更明显 */
#pfNewTplModal .pf-nt-mode {
    background: #2b3140 !important;
    border: 1.5px solid #3a4152 !important;
}
#pfNewTplModal .pf-nt-mode:hover {
    border-color: #60a5fa !important;
    background: #2f3646 !important;
}
#pfNewTplModal .pf-nt-mode.is-active {
    border-color: #4aa3ff !important;
    background: linear-gradient(135deg, rgba(74,163,255,.18), rgba(167,139,250,.08)) !important;
    box-shadow: 0 0 0 3px rgba(74,163,255,.18), 0 4px 16px rgba(74,163,255,.2);
}
#pfNewTplModal .pf-nt-mode > div b {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
}
#pfNewTplModal .pf-nt-mode > div > div {
    font-size: 12px !important;
    color: #b5bdce !important;
    margin-top: 4px !important;
}

/* 字段 label：更亮、更大 */
#pfNewTplModal .pf-nt-field > label {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--bg-warm) !important;
    margin-bottom: 8px !important;
}
#pfNewTplModal .pf-nt-field label code {
    background: rgba(74,163,255,.25) !important;
    color: #82bbff !important;
    font-weight: 600;
}
#pfNewTplModal .pf-nt-sub {
    color: #8c99b3 !important;
    font-weight: 400;
}

/* 输入框 / textarea：明显更亮 */
#pfNewTplModal .pf-nt-input,
#pfNewTplModal .pf-nt-textarea {
    background: #1b212c !important;
    border: 1.5px solid #3a4152 !important;
    color: #ffffff !important;
    font-size: 14px !important;
    padding: 11px 14px !important;
}
#pfNewTplModal .pf-nt-input::placeholder,
#pfNewTplModal .pf-nt-textarea::placeholder {
    color: #5f6a82;
}
#pfNewTplModal .pf-nt-input:focus,
#pfNewTplModal .pf-nt-textarea:focus {
    border-color: #4aa3ff !important;
    background: #1f2632 !important;
    box-shadow: 0 0 0 3px rgba(74,163,255,.2);
}
#pfNewTplModal .pf-nt-hint {
    color: #b5bdce !important;
    font-size: 12px !important;
    margin-top: 8px !important;
}
#pfNewTplModal .pf-nt-hint code {
    background: rgba(74,163,255,.2) !important;
    color: #82bbff !important;
}

/* 变量勾选区 */
#pfNewTplModal .pf-nt-bank-wrap {
    background: #1b212c !important;
    border: 1px solid #3a4152 !important;
}
#pfNewTplModal .pf-nt-bank-chk {
    background: #2b3140 !important;
    border: 1px solid #3a4152 !important;
    color: var(--border) !important;
}
#pfNewTplModal .pf-nt-bank-chk:hover {
    background: #353c4d !important;
    color: #ffffff !important;
}

/* 标签 chip：加亮 */
#pfNewTplModal .pf-nt-tag-chk {
    background: #2b3140 !important;
    border: 1px solid #3a4152 !important;
    color: #b5bdce !important;
    padding: 5px 12px !important;
}
#pfNewTplModal .pf-nt-tag-chk:hover { color: #ffffff !important; }

/* ==========================================
 * 🆕 OPS 词典导入区（对齐可视化提示词编辑器）
 * ========================================== */
.pf-nt-ops-search {
    margin-bottom: 8px;
}

.pf-nt-ops-wrap {
    max-height: 360px;
    overflow-y: auto;
    background: #1b212c;
    border: 1px solid #3a4152;
    border-radius: 8px;
    padding: 10px 12px;
}
.pf-nt-ops-wrap::-webkit-scrollbar { width: 6px; }
.pf-nt-ops-wrap::-webkit-scrollbar-thumb { background: #4a5168; border-radius: 3px; }
.pf-nt-ops-wrap::-webkit-scrollbar-track { background: #1b212c; }

.pf-nt-ops-group {
    margin-bottom: 14px;
}
.pf-nt-ops-group:last-child { margin-bottom: 0; }

.pf-nt-ops-cat {
    font-size: 12px;
    font-weight: 700;
    color: var(--bg-warm);
    padding: 4px 8px 6px;
    margin-bottom: 6px;
    border-bottom: 1px dashed rgba(255,255,255,.08);
    display: flex; align-items: center; gap: 4px;
}
.pf-nt-ops-count {
    font-size: 10px;
    font-weight: 600;
    background: rgba(74,163,255,.2);
    color: #82bbff;
    padding: 1px 6px;
    border-radius: 8px;
    margin-left: 4px;
}

.pf-nt-ops-items {
    display: flex; flex-wrap: wrap; gap: 6px;
}

.pf-nt-ops-chk {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 9px;
    background: #2b3140;
    border: 1px solid #3a4152;
    border-radius: 14px;
    font-size: 11px;
    cursor: pointer;
    transition: all .12s ease;
    max-width: 100%;
}
.pf-nt-ops-chk:hover {
    background: #353c4d;
    border-color: #60a5fa;
    transform: translateY(-1px);
}
.pf-nt-ops-chk input {
    margin: 0;
    width: 12px; height: 12px;
    cursor: pointer;
    accent-color: #4aa3ff;
}
.pf-nt-ops-chk:has(input:checked) {
    background: rgba(74,163,255,.2);
    border-color: #4aa3ff;
    box-shadow: 0 0 0 2px rgba(74,163,255,.15);
}
.pf-nt-ops-chk:has(input:checked) .pf-nt-ops-zh {
    color: #ffffff;
    font-weight: 600;
}

.pf-nt-ops-type {
    font-size: 9px;
    font-weight: 600;
    padding: 1px 5px;
    border-radius: 3px;
}
.pf-nt-ops-zh {
    color: var(--border);
    font-weight: 500;
}
.pf-nt-ops-en {
    color: #8c99b3;
    font-size: 10px;
    font-style: italic;
    border-left: 1px solid rgba(255,255,255,.1);
    padding-left: 5px;
    margin-left: 2px;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ============================================================================
 * 📚 全局变量词库管家（Bank Manager）
 * ============================================================================ */
.pf-bm-wrap {
    width: 1000px !important;
    max-width: calc(100vw - 40px) !important;
    height: 85vh;
    max-height: 900px;
    background: #232936 !important;
    border: 1px solid #3a4152 !important;
}
.pf-bm .pf-modal-head {
    position: relative;
    flex-wrap: wrap;
}
.pf-bm-sub {
    display: block;
    font-size: 11px;
    font-weight: 400;
    color: #b5bdce !important;
    margin-top: 3px;
    width: 100%;
}
.pf-bm-body {
    flex: 1; overflow: hidden;
    display: flex; flex-direction: column;
    padding: 14px 20px 4px;
    gap: 10px;
}

/* 工具条 */
.pf-bm-toolbar {
    display: flex; justify-content: space-between; align-items: center;
    gap: 10px;
}
.pf-bm-tabs { display: flex; gap: 4px; }
.pf-bm-tab {
    padding: 6px 14px;
    background: #2b3140;
    border: 1px solid #3a4152;
    color: var(--border);
    border-radius: 6px;
    font-size: 13px;
    cursor: pointer;
    display: inline-flex; align-items: center; gap: 5px;
}
.pf-bm-tab:hover { background: #353c4d; color: #fff; }
.pf-bm-tab.is-active {
    background: linear-gradient(90deg, rgba(74,163,255,.25), rgba(167,139,250,.1));
    border-color: #4aa3ff;
    color: #fff;
}
.pf-bm-tab .n {
    font-size: 11px;
    padding: 1px 7px;
    background: rgba(255,255,255,.08);
    border-radius: 8px;
    color: inherit;
}

.pf-bm-toolbar-right { display: flex; gap: 5px; }
.pf-btn.sm { padding: 5px 10px; font-size: 11px; }

/* 过滤行 */
.pf-bm-filter-row {
    display: flex; align-items: center; flex-wrap: wrap; gap: 4px;
    padding: 4px 0;
}
.pf-bm-filter-label {
    font-size: 11px;
    color: #8c99b3;
    font-weight: 600;
    margin-right: 4px;
}
.pf-bm-chip {
    padding: 3px 10px;
    background: #2b3140;
    border: 1px solid #3a4152;
    color: var(--border);
    border-radius: 12px;
    font-size: 11px;
    cursor: pointer;
    transition: all .12s ease;
}
.pf-bm-chip:hover { color: #fff; background: #353c4d; }
.pf-bm-chip.is-active {
    background: rgba(74,163,255,.2);
    border-color: #4aa3ff;
    color: #82bbff;
}

/* 搜索框 */
.pf-bm-search {
    background: #1b212c !important;
    border: 1.5px solid #3a4152 !important;
    color: #fff !important;
    font-size: 13px !important;
    padding: 9px 12px !important;
}

/* 列表容器 */
.pf-bm-list {
    flex: 1;
    overflow-y: auto;
    padding: 4px 4px 18px;
    display: flex; flex-direction: column; gap: 8px;
}
.pf-bm-list::-webkit-scrollbar { width: 7px; }
.pf-bm-list::-webkit-scrollbar-thumb { background: #4a5168; border-radius: 3px; }
.pf-bm-list::-webkit-scrollbar-track { background: #1b212c; }

.pf-bm-empty {
    padding: 40px 16px;
    text-align: center;
    color: #6b7a95;
    font-size: 13px;
}

/* 变量行 */
.pf-bm-item {
    background: #2b3140;
    border: 1px solid #3a4152;
    border-radius: 8px;
    padding: 10px 14px;
    transition: border-color .12s ease;
}
.pf-bm-item:hover { border-color: #60a5fa; }
.pf-bm-item.is-hidden { opacity: .5; }
.pf-bm-item.is-editing {
    border-color: #4aa3ff;
    box-shadow: 0 0 0 2px rgba(74,163,255,.18);
}

.pf-bm-item-head {
    display: flex; justify-content: space-between; align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}
.pf-bm-item-left { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pf-bm-cat-dot { width: 10px; height: 10px; border-radius: 50%; flex: 0 0 10px; }
.pf-bm-item-name { font-size: 14px; font-weight: 600; color: #fff; }
.pf-bm-key {
    font-size: 11px;
    font-family: 'Menlo','Monaco','Consolas',monospace;
    background: rgba(255,255,255,.05);
    color: #82bbff;
    padding: 2px 6px;
    border-radius: 3px;
}
.pf-bm-badge {
    font-size: 9px;
    padding: 1px 5px;
    border-radius: 3px;
    font-weight: 600;
}
.pf-bm-badge.official { background: rgba(16,185,129,.2); color: #10b981; }
.pf-bm-badge.custom   { background: rgba(245,158,11,.2); color: #f59e0b; }
.pf-bm-badge.hidden   { background: rgba(100,116,139,.3); color: #94a3b8; }

.pf-bm-item-actions { display: flex; gap: 4px; }

.pf-bm-tags-row {
    display: flex; flex-wrap: wrap; gap: 4px;
    margin-bottom: 6px;
}
.pf-bm-tag {
    font-size: 11px;
    background: rgba(167,139,250,.18);
    color: #f2d391;
    padding: 2px 7px;
    border-radius: 10px;
    display: inline-flex; align-items: center; gap: 4px;
}
.pf-bm-tag i { cursor: pointer; font-size: 9px; opacity: .6; }
.pf-bm-tag i:hover { opacity: 1; color: #fff; }

.pf-bm-opts {
    display: flex; flex-wrap: wrap; gap: 5px;
}
.pf-bm-opt {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 3px 8px;
    background: #1b212c;
    border: 1px solid #3a4152;
    border-radius: 12px;
    font-size: 11px;
    max-width: 320px;
}
.pf-bm-opt.is-custom {
    background: rgba(245,158,11,.08);
    border-color: rgba(245,158,11,.3);
}
.pf-bm-opt-cn { color: var(--bg-warm); font-weight: 500; }
.pf-bm-opt-en {
    color: #8c99b3;
    font-size: 10px;
    font-style: italic;
    border-left: 1px solid rgba(255,255,255,.1);
    padding-left: 5px;
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pf-bm-opt i {
    cursor: pointer; font-size: 10px; opacity: .5;
    margin-left: 2px;
}
.pf-bm-opt i:hover { opacity: 1; color: #ef4444; }
.pf-bm-opt i.fa-pen:hover { color: #60a5fa; }
.pf-bm-opt-tag {
    font-size: 9px;
    background: rgba(16,185,129,.15);
    color: #10b981;
    padding: 1px 5px;
    border-radius: 3px;
}
.pf-bm-opts-empty { color: #6b7a95; font-size: 11px; font-style: italic; }
.pf-bm-more { color: #8c99b3; font-size: 11px; align-self: center; padding: 0 6px; }

/* 编辑态表单 */
.pf-bm-edit-form {
    display: grid;
    grid-template-columns: 1fr 1fr 180px;
    gap: 10px;
    padding: 8px 0;
}
.pf-bm-field label {
    display: block;
    font-size: 11px;
    color: #b5bdce;
    margin-bottom: 4px;
}

/* OPS 词典 dict 行 */
.pf-bm-dict {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: #2b3140;
    border: 1px solid #3a4152;
    border-radius: 6px;
}
.pf-bm-dict:hover { border-color: #60a5fa; }
.pf-bm-dict.is-custom {
    background: rgba(245,158,11,.06);
    border-color: rgba(245,158,11,.3);
}
.pf-bm-dict-type {
    flex: 0 0 auto;
    font-size: 10px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 3px;
}
.pf-bm-dict-main { flex: 1; min-width: 0; }
.pf-bm-dict-zh { font-size: 13px; color: #fff; }
.pf-bm-dict-en {
    font-size: 11px; color: #8c99b3;
    font-family: 'Menlo','Monaco','Consolas',monospace;
}
.pf-bm-dict-dir {
    color: #e8c073; font-style: normal;
    background: rgba(167,139,250,.12);
    padding: 1px 5px; border-radius: 3px;
    font-size: 10px;
    margin-left: 4px;
}
.pf-bm-dict-actions { display: flex; gap: 6px; }
.pf-bm-dict-actions i {
    cursor: pointer; font-size: 11px; color: #8c99b3;
    padding: 4px;
    border-radius: 4px;
}
.pf-bm-dict-actions i:hover { background: #3a4152; color: #fff; }
.pf-bm-dict-actions i.fa-times:hover { color: #ef4444; }

/* ============================================================================
 * v2.4 · 新建模板模态框（分栏 + 变量速插 + 实时预览）+ OPS badge
 * ============================================================================ */

/* 大尺寸模态 */
.pf-nt-wrap-lg {
    width: 1060px !important;
    max-width: calc(100vw - 40px) !important;
}

/* 左右分栏 */
.pf-nt-split {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 16px;
    align-items: stretch;
}
.pf-nt-split-left,
.pf-nt-split-right {
    display: flex; flex-direction: column; gap: 12px;
    min-width: 0;
}

/* 实时预览区 */
.pf-nt-preview {
    padding: 12px 14px;
    background: #1b212c;
    border: 1px dashed #3a4152;
    border-radius: 6px;
    color: var(--bg-warm);
    font-size: 13px;
    line-height: 1.9;
    min-height: 80px;
    max-height: 240px;
    overflow-y: auto;
    white-space: pre-wrap;
    word-break: break-word;
}
.pf-nt-preview em { color: #6b7a95; font-style: italic; }
.pf-nt-preview::-webkit-scrollbar { width: 5px; }
.pf-nt-preview::-webkit-scrollbar-thumb { background: #3a4152; border-radius: 3px; }

/* 预览内的变量 chip */
.pf-nt-pv-chip {
    display: inline-flex; align-items: center; gap: 4px;
    margin: 2px 3px;
    padding: 2px 8px;
    border: 1px solid;
    border-radius: 12px;
    font-size: 12px;
    background: rgba(74,163,255,.06);
    vertical-align: middle;
}
.pf-nt-pv-chip code {
    font-size: 9px;
    background: rgba(255,255,255,.08);
    padding: 0 4px;
    border-radius: 2px;
    opacity: .7;
    color: inherit;
}
.pf-nt-pv-chip sup {
    font-size: 9px;
    background: rgba(255,255,255,.15);
    padding: 0 3px;
    border-radius: 2px;
    margin-left: 2px;
}
.pf-nt-pv-default {
    font-size: 10px;
    color: #8c99b3;
    font-style: italic;
    margin-left: 3px;
}

/* 变量速插面板 */
.pf-nt-var-wrap {
    max-height: 500px;
    overflow-y: auto;
    background: #1b212c;
    border: 1px solid #3a4152;
    border-radius: 8px;
    padding: 10px 10px 8px;
}
.pf-nt-var-wrap::-webkit-scrollbar { width: 5px; }
.pf-nt-var-wrap::-webkit-scrollbar-thumb { background: #3a4152; border-radius: 3px; }

.pf-nt-var-group { margin-bottom: 12px; }
.pf-nt-var-group:last-child { margin-bottom: 0; }
.pf-nt-var-cat {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.3px;
    padding-bottom: 4px;
    margin-bottom: 6px;
    border-bottom: 1px dashed rgba(255,255,255,.06);
    display: flex; align-items: center; gap: 4px;
}
.pf-nt-var-cat-n {
    font-size: 9px;
    font-weight: 600;
    background: rgba(255,255,255,.08);
    color: var(--border);
    padding: 1px 5px;
    border-radius: 7px;
    margin-left: auto;
}

.pf-nt-var-items {
    display: flex; flex-wrap: wrap; gap: 5px;
}

.pf-nt-var-chip {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 4px 8px;
    background: #2b3140;
    border: 1.5px solid #3a4152;
    border-radius: 14px;
    font-size: 11px;
    cursor: pointer;
    transition: all .12s ease;
    color: var(--border);
    max-width: 100%;
    text-align: left;
}
button.pf-nt-var-chip {
    font-family: inherit;
}
.pf-nt-var-chip:hover {
    background: #353c4d;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(74,163,255,.2);
}
.pf-nt-var-chip code {
    font-size: 9px;
    background: rgba(255,255,255,.05);
    color: #82bbff;
    padding: 1px 4px;
    border-radius: 2px;
    font-family: 'Menlo','Monaco','Consolas',monospace;
}
.pf-nt-var-chip-name {
    font-weight: 500;
    color: #fff;
}
.pf-nt-var-chip-n {
    font-size: 9px;
    background: rgba(16,185,129,.2);
    color: #10b981;
    padding: 1px 5px;
    border-radius: 7px;
    font-weight: 600;
}
.pf-nt-var-chip input[type="checkbox"] {
    margin: 0;
    width: 12px; height: 12px;
    accent-color: #4aa3ff;
    cursor: pointer;
}
.pf-nt-var-chip:has(input:checked) {
    background: rgba(74,163,255,.2);
    border-color: #4aa3ff;
    box-shadow: 0 0 0 2px rgba(74,163,255,.15);
}

.pf-nt-var-search { margin-bottom: 8px; }

/* 词库管家：OPS badge */
.pf-bm-badge.ops { background: rgba(167,139,250,.2); color: #e8c073; }

/* 小屏优化：单列 */
@media (max-width: 920px) {
    .pf-nt-split { grid-template-columns: 1fr; }
    .pf-nt-var-wrap { max-height: 320px; }
}

/* ============================================================================
 * v2.5 · 新建模板的「分类」字段 + 模板列表按分类分组
 * ============================================================================ */

/* 分类输入行 */
.pf-nt-cat-row { display: flex; gap: 8px; align-items: center; }
.pf-nt-cat-chips {
    display: flex; flex-wrap: wrap; gap: 4px;
    margin-top: 6px;
}
.pf-nt-cat-chip {
    padding: 3px 10px;
    background: #2b3140;
    border: 1px solid #3a4152;
    color: var(--border);
    border-radius: 12px;
    font-size: 11px;
    cursor: pointer;
    transition: all .12s ease;
}
.pf-nt-cat-chip:hover {
    color: #fff;
    background: #353c4d;
    border-color: #60a5fa;
}
.pf-nt-cat-chip:active {
    transform: scale(.96);
}

/* 模板列表分组 */
.pf-tpl-group { margin-bottom: 14px; }
.pf-tpl-group:last-child { margin-bottom: 0; }
.pf-tpl-group-head {
    display: flex; align-items: center; gap: 6px;
    padding: 6px 10px 6px 14px;
    font-size: 11px;
    font-weight: 700;
    color: var(--border);
    letter-spacing: 0.3px;
    border-bottom: 1px dashed rgba(255,255,255,.06);
    margin-bottom: 6px;
    position: sticky;
    top: 0;
    background: linear-gradient(180deg, var(--bg-panel, #161c28) 70%, transparent);
    z-index: 2;
}
.pf-tpl-group-dot {
    width: 8px; height: 8px; border-radius: 50%;
    background: linear-gradient(135deg, #4aa3ff, #e8c073);
    box-shadow: 0 0 0 2px rgba(74,163,255,.15);
    flex: 0 0 8px;
}
.pf-tpl-group-n {
    margin-left: auto;
    font-size: 10px;
    font-weight: 600;
    background: rgba(74,163,255,.15);
    color: #82bbff;
    padding: 1px 7px;
    border-radius: 8px;
}
.pf-tpl-group-items {
    display: flex; flex-direction: column; gap: 10px;
}

/* ============================================================================
 * v2.6 · 新建模板 · 示例图片上传（点击/拖拽/URL）
 * ============================================================================ */
.pf-nt-cover-drop {
    position: relative;
    min-height: 150px;
    max-height: 260px;
    background: #1b212c;
    border: 2px dashed #3a4152;
    border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    overflow: hidden;
    transition: all .15s ease;
}
.pf-nt-cover-drop:hover {
    border-color: #60a5fa;
    background: #212938;
}
.pf-nt-cover-drop.is-dragover {
    border-color: #4aa3ff;
    background: rgba(74,163,255,.1);
    transform: scale(.99);
}
.pf-nt-cover-placeholder {
    display: flex; flex-direction: column; align-items: center;
    gap: 8px; padding: 18px 20px;
    text-align: center;
    color: #8c99b3;
}
.pf-nt-cover-placeholder > i {
    font-size: 28px;
    color: #60a5fa;
    opacity: .7;
}
.pf-nt-cover-hint {
    font-size: 12px;
    color: var(--border);
    font-weight: 500;
}
.pf-nt-cover-hint2 {
    font-size: 11px;
    color: #8c99b3;
    display: flex; align-items: center; gap: 6px;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 4px;
}
.pf-nt-cover-url {
    background: #2b3140;
    border: 1px solid #3a4152;
    color: #fff;
    border-radius: 4px;
    font-size: 11px;
    padding: 3px 8px;
    width: 300px;
    max-width: 100%;
    outline: none;
}
.pf-nt-cover-url:focus { border-color: #4aa3ff; }
.pf-nt-cover-preview {
    width: 100%;
    max-height: 260px;
    object-fit: contain;
    display: block;
    border-radius: 8px;
    background: #0f141c;
}
.pf-nt-cover-clear {
    position: absolute;
    top: 8px; right: 8px;
    width: 28px; height: 28px;
    border: none;
    background: rgba(0,0,0,.65);
    color: #fff;
    border-radius: 50%;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background .12s ease;
}
.pf-nt-cover-clear:hover { background: #ef4444; }

/* 自定义分类 tab（与官方 TEMPLATE_TAGS 区分） */
.pf-tag-btn.pf-tag-custom-cat {
    background: rgba(167,139,250,.1);
    border-color: rgba(167,139,250,.3);
    color: #f2d391;
}
.pf-tag-btn.pf-tag-custom-cat:hover {
    background: rgba(167,139,250,.2);
    border-color: #e8c073;
    color: #fff;
}
.pf-tag-btn.pf-tag-custom-cat.is-active {
    background: linear-gradient(90deg, rgba(167,139,250,.3), rgba(167,139,250,.1));
    border-color: #e8c073;
    color: #fff;
}

/* ============================================================================
 * 编辑模板信息 Modal（#pfEditMetaModal）
 * 和新建模板 Modal 共享一套加亮样式，解决默认背景过暗看不清的问题
 * ============================================================================ */
#pfEditMetaModal .pf-modal-wrap {
    width: 640px !important;
    max-width: calc(100vw - 40px) !important;
    background: #232936 !important;
    border: 1px solid #3a4152 !important;
    box-shadow: 0 25px 70px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.03);
}
#pfEditMetaModal .pf-modal-back {
    background: rgba(0,0,0,.78) !important;
    backdrop-filter: blur(6px);
}
#pfEditMetaModal .pf-modal-head {
    padding: 18px 24px !important;
    background: linear-gradient(135deg, rgba(74,163,255,.22), rgba(167,139,250,.12)) !important;
    border-bottom: 1px solid #3a4152 !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px;
}
#pfEditMetaModal .pf-modal-head > i {
    color: #60a5fa !important;
    font-size: 18px;
}
#pfEditMetaModal .pf-modal-close {
    background: rgba(255,255,255,.06);
    color: var(--border) !important;
}
#pfEditMetaModal .pf-modal-close:hover {
    background: rgba(239,68,68,.2);
    color: #fff !important;
}
#pfEditMetaModal .pf-modal-body {
    padding: 22px 24px !important;
    background: #232936 !important;
}
#pfEditMetaModal .pf-modal-foot {
    background: #1b212c !important;
    border-top: 1px solid #3a4152 !important;
    padding: 16px 24px !important;
}

/* 字段：label 更亮、间距更大 */
#pfEditMetaModal .pf-nt-field {
    margin-bottom: 18px;
}
#pfEditMetaModal .pf-nt-field > label {
    display: block;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--bg-warm) !important;
    margin-bottom: 8px !important;
}
#pfEditMetaModal .pf-nt-sub {
    color: #8c99b3 !important;
    font-weight: 400;
    font-size: 12px;
}

/* 输入框 */
#pfEditMetaModal .pf-nt-input {
    width: 100%;
    background: #1b212c !important;
    border: 1.5px solid #3a4152 !important;
    border-radius: 8px;
    color: #ffffff !important;
    font-size: 14px !important;
    padding: 11px 14px !important;
    outline: none;
    transition: all .15s ease;
    box-sizing: border-box;
}
#pfEditMetaModal .pf-nt-input::placeholder { color: #5f6a82; }
#pfEditMetaModal .pf-nt-input:focus {
    border-color: #4aa3ff !important;
    background: #1f2632 !important;
    box-shadow: 0 0 0 3px rgba(74,163,255,.2);
}

/* 分类 chip 组 */
#pfEditMetaModal .pf-nt-cat-chip {
    background: #2b3140 !important;
    border: 1px solid #3a4152 !important;
    color: var(--border) !important;
}
#pfEditMetaModal .pf-nt-cat-chip:hover {
    color: #fff !important;
    background: #353c4d !important;
    border-color: #60a5fa !important;
}

/* 封面上传区 */
#pfEditMetaModal .pf-nt-cover-drop {
    background: #1b212c !important;
    border: 2px dashed #3a4152 !important;
}
#pfEditMetaModal .pf-nt-cover-drop:hover {
    border-color: #60a5fa !important;
    background: #212938 !important;
}
#pfEditMetaModal .pf-nt-cover-placeholder,
#pfEditMetaModal .pf-nt-cover-hint,
#pfEditMetaModal .pf-nt-cover-hint2 {
    color: var(--border) !important;
}
#pfEditMetaModal .pf-nt-cover-placeholder > i {
    color: #60a5fa !important;
}
#pfEditMetaModal .pf-nt-cover-url {
    background: #2b3140 !important;
    border: 1px solid #3a4152 !important;
    color: #fff !important;
}
#pfEditMetaModal .pf-nt-cover-url::placeholder { color: #5f6a82 !important; }
#pfEditMetaModal .pf-nt-cover-url:focus {
    border-color: #4aa3ff !important;
    outline: none;
}

/* 标签 chip：加亮 */
#pfEditMetaModal .pf-nt-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
#pfEditMetaModal .pf-nt-tag-chk {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px !important;
    background: #2b3140 !important;
    border: 1px solid #3a4152 !important;
    border-radius: 16px;
    color: #b5bdce !important;
    font-size: 12px;
    cursor: pointer;
    transition: all .15s ease;
}
#pfEditMetaModal .pf-nt-tag-chk:hover {
    color: #ffffff !important;
    border-color: #60a5fa !important;
    background: #353c4d !important;
}
#pfEditMetaModal .pf-nt-tag-chk input[type="checkbox"] {
    margin: 0;
    accent-color: #4aa3ff;
}
#pfEditMetaModal .pf-nt-tag-chk:has(input:checked) {
    background: rgba(74,163,255,.2) !important;
    border-color: #4aa3ff !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 2px rgba(74,163,255,.15);
}

/* 按钮（底部）*/
#pfEditMetaModal .pf-btn.ghost {
    background: #2b3140 !important;
    border: 1px solid #3a4152 !important;
    color: var(--border) !important;
}
#pfEditMetaModal .pf-btn.ghost:hover {
    background: #353c4d !important;
    color: #fff !important;
}
#pfEditMetaModal .pf-btn.primary {
    background: linear-gradient(135deg, #4aa3ff, #60a5fa) !important;
    border: 1px solid #4aa3ff !important;
    color: #fff !important;
    font-weight: 600;
}
#pfEditMetaModal .pf-btn.primary:hover {
    background: linear-gradient(135deg, #60a5fa, #82bbff) !important;
    box-shadow: 0 4px 16px rgba(74,163,255,.35);
}