/* =====================================================================
 * N14 / 42 · AI 提示词模板库 —— 独立皮肤「卡片图书馆」
 * 左侧索引抽屉 + 右侧变量填充纸卡；模板卡墙、批量与校验。
 * 主题：只消费公共导航写入的 <html data-theme>，不自建开关。
 * ===================================================================== */

.pl-page {
    --nx-bg:        #f8f6f1;
    --nx-bg-2:      #f0ece2;
    --nx-surface:   #fffdf8;
    --nx-surface-2: #f6f2e9;
    --nx-surface-3: #ece5d7;
    --nx-ink:       #1d2c25;
    --nx-ink-2:     #4f6258;
    --nx-ink-3:     #8a978d;
    --nx-line:      #e0dacb;
    --nx-line-2:    #eee9dd;
    --nx-a:         #1f6d5a;
    --nx-b:         #b07d2b;
    --nx-tint:      #e3f0e9;
    --nx-deep:      #175442;
    --tsk-card: #fffdf8; --tsk-line: #e0dacb; --tsk-faint: #8a978d; --tsk-sub: #4f6258; --tsk-ink: #1d2c25;
    background-image: repeating-linear-gradient(90deg, rgba(31, 109, 90, .018) 0 1px, transparent 1px 8px);
}
:root[data-theme="dark"] .pl-page {
    --nx-bg:        #0c1311;
    --nx-bg-2:      #111b17;
    --nx-surface:   #16231e;
    --nx-surface-2: #1d2e27;
    --nx-surface-3: #263a31;
    --nx-ink:       #eef5ee;
    --nx-ink-2:     #aebfb3;
    --nx-ink-3:     #82968a;
    --nx-line:      #2a3d33;
    --nx-line-2:    #203128;
    --nx-a:         #6cc4a5;
    --nx-b:         #e0b663;
    --nx-tint:      rgba(108, 196, 165, .15);
    --nx-deep:      #a3e0c7;
    --tsk-card: #16231e; --tsk-line: #2a3d33; --tsk-faint: #82968a; --tsk-sub: #aebfb3; --tsk-ink: #eef5ee;
    background-image: repeating-linear-gradient(90deg, rgba(108, 196, 165, .02) 0 1px, transparent 1px 8px);
}

.pl-page .n14-hero h1 em { color: var(--nx-a); }
.pl-hero { display: grid; grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr); gap: clamp(20px, 3.4vw, 44px); align-items: start; }
.pl-search { margin-top: 22px; }
.pl-search .n14-input { background: var(--nx-surface); }
.pl-drawers { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.pl-drawer { font-size: 12.5px; font-weight: 650; cursor: pointer; border-radius: 7px 7px 0 0; padding: 7px 12px 8px; background: var(--nx-surface-2); border: 1px solid var(--nx-line); border-bottom: 3px solid var(--nx-line); color: var(--nx-ink-2); }
.pl-drawer:hover { border-bottom-color: var(--nx-b); }
.pl-drawer[aria-pressed="true"] { background: var(--nx-surface); color: var(--nx-deep); border-bottom-color: var(--nx-a); }
.pl-searchmeta { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-top: 14px; font-size: 12px; color: var(--nx-ink-3); }
.pl-searchmeta span:first-child { color: var(--nx-deep); font-weight: 750; margin-right: auto; }

/* 变量填充台：纸卡 */
.pl-filler { border-top: 3px solid var(--nx-a); }
.pl-filler__tpl { font-size: 13px; line-height: 1.8; color: var(--nx-ink-2); background: var(--nx-surface-2); border: 1px dashed var(--nx-line); border-radius: 9px; padding: 11px 13px; max-height: 130px; overflow: auto; }
.pl-filler__tpl b { color: var(--nx-deep); }
.pl-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.pl-fields .n14-field { margin-bottom: 0; }
.pl-fields .n14-label { font-size: 12px; }
.pl-fields .n14-input { font-size: 13.5px; padding: 8px 11px; }
.pl-preview { margin-top: 15px; background: var(--nx-surface-2); border: 1px solid var(--nx-line); border-radius: 10px; padding: 13px 15px; }
.pl-preview__cap { display: flex; justify-content: space-between; gap: 10px; font-family: var(--nx-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--nx-ink-3); margin-bottom: 9px; }
.pl-preview__body { font-size: 14px; line-height: 1.9; color: var(--nx-ink); white-space: pre-wrap; word-break: break-word; max-height: 220px; overflow: auto; min-height: 60px; }
.pl-preview__body .pl-var { background: var(--nx-tint); color: var(--nx-deep); border-radius: 4px; padding: 0 3px; font-weight: 700; }
.pl-validmsg { margin-top: 14px; white-space: pre-line; }
.pl-filler .n14-btn--accent { background: var(--nx-b); border-color: var(--nx-b); color: #fff; }

/* 模板卡墙 */
.pl-wall { display: grid; grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); gap: 11px; }
.pl-card { position: relative; display: flex; flex-direction: column; gap: 8px; text-align: left; background: var(--nx-surface); border: 1px solid var(--nx-line); border-left: 4px solid var(--nx-a); border-radius: 11px; padding: 13px 14px; cursor: pointer; transition: transform .13s, box-shadow .13s; }
.pl-card:hover { transform: translateY(-2px); box-shadow: var(--nx-sh); }
.pl-card[aria-pressed="true"] { border-color: var(--nx-a); box-shadow: 0 0 0 2px var(--nx-tint); }
.pl-card__cat { font-size: 10.5px; letter-spacing: .08em; color: var(--nx-ink-3); }
.pl-card__title { font-size: 15px; font-weight: 750; color: var(--nx-ink); padding-right: 22px; }
.pl-card__vars { display: flex; flex-wrap: wrap; gap: 4px; }
.pl-card__vars span { font-family: var(--nx-mono); font-size: 10.5px; background: var(--nx-surface-2); border: 1px solid var(--nx-line); border-radius: 5px; padding: 1px 6px; color: var(--nx-ink-2); }
.pl-card__tip { font-size: 11.5px; line-height: 1.6; color: var(--nx-ink-3); }
.pl-card__fav { position: absolute; top: 10px; right: 10px; background: none; border: 0; cursor: pointer; font-size: 17px; color: var(--nx-ink-3); line-height: 1; }
.pl-card__fav[aria-pressed="true"] { color: var(--nx-b); }
.pl-card__del { position: absolute; bottom: 8px; right: 10px; font-size: 11px; color: var(--nx-err); background: none; border: 0; cursor: pointer; }

.pl-split { align-items: start; }
.pl-batchout { display: grid; gap: 9px; max-height: 240px; overflow: auto; }
.pl-batchitem { background: var(--nx-surface-2); border: 1px solid var(--nx-line); border-radius: 9px; padding: 10px 12px; font-size: 13px; line-height: 1.75; white-space: pre-wrap; word-break: break-word; }
.pl-batchitem b { font-family: var(--nx-mono); font-size: 11px; color: var(--nx-deep); }
.pl-card--custom { border-left-color: var(--nx-b); }

@media (max-width: 980px) {
    .pl-hero { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .pl-fields { grid-template-columns: 1fr; }
    .pl-wall { grid-template-columns: 1fr; }
}