/* 字典页 — 复用品牌色 var(--color-*) */
.dict-page { max-width: 720px; margin: 0 auto; padding: 16px; }

/* 搜索框 */
.dict-search { display: flex; gap: 8px; margin-bottom: 20px; }
.dict-search-input {
    flex: 1; height: 44px; padding: 0 16px;
    border: 2px solid var(--color-border,#e2e8f0); border-radius: 22px;
    font-size: 1rem; outline: none; transition: border 0.15s;
}
.dict-search-input:focus { border-color: var(--color-primary); }
.dict-search-btn {
    height: 44px; padding: 0 24px;
    background: var(--color-primary); color: #fff; border: none;
    border-radius: 22px; font-size: 1rem; font-weight: 600; cursor: pointer;
}

/* 首页推荐 */
.dict-home { padding: 12px 0; }
.dict-rec-title { font-size: 1rem; font-weight: 600; margin-bottom: 12px; }
.dict-rec-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.dict-rec-card {
    display: flex; flex-direction: column; gap: 4px; padding: 14px;
    background: #fff; border: 1px solid var(--color-border,#e2e8f0); border-radius: 12px;
    text-decoration: none; transition: border-color 0.15s;
}
.dict-rec-card:hover { border-color: var(--color-primary); }
.dict-rec-word { font-size: 1rem; font-weight: 600; color: var(--color-primary); }
.dict-rec-pinyin { font-size: 0.72rem; color: var(--color-text-secondary); }
.dict-en-bar { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 0.9rem; }
.dict-en-bar a { color: var(--color-primary); padding: 4px 14px; background: var(--color-primary-light); border-radius: 14px; text-decoration: none; }
.dict-en-bar a:hover { background: var(--color-primary); color: #fff; }

/* 结果 */
.dict-result { background: #fff; border-radius: 12px; padding: 24px 20px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.dict-word-head { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
.dict-word { font-size: 1.6rem; color: var(--color-primary); }
.dict-phonetic { color: var(--color-text-secondary); font-size: 0.95rem; }
.dict-section { margin-bottom: 14px; }
.dict-label { display: inline-block; background: var(--color-primary-light); color: var(--color-primary); font-size: 0.75rem; font-weight: 600; padding: 2px 8px; border-radius: 4px; margin-bottom: 6px; }
.dict-text { font-size: 0.95rem; line-height: 1.7; }
.dict-example { font-size: 0.85rem; color: var(--color-text-secondary); font-style: italic; margin-top: 4px; }
.dict-subtitle { font-size: 1.1rem; margin-bottom: 12px; }
.dict-empty { text-align: center; padding: 60px 20px; color: var(--color-text-secondary); font-size: 1.1rem; }

/* 建议列表 */
.dict-suggest-list { display: flex; flex-direction: column; gap: 6px; }
.dict-suggest-item { display: flex; justify-content: space-between; padding: 10px 14px; background: var(--color-bg,#f8fafc); border-radius: 8px; text-decoration: none; color: var(--color-text); }
.dict-suggest-item:hover { background: var(--color-primary-light); }

/* ===== 3种布局变体 ===== */
/* 布局 B: 紧凑 (T4-T6) */
[data-template="4"] .dict-rec-grid,
[data-template="5"] .dict-rec-grid,
[data-template="6"] .dict-rec-grid,
[data-template="12"] .dict-rec-grid,
[data-template="13"] .dict-rec-grid,
[data-template="20"] .dict-rec-grid,
[data-template="21"] .dict-rec-grid,
[data-template="29"] .dict-rec-grid,
[data-template="33"] .dict-rec-grid,
[data-template="34"] .dict-rec-grid,
[data-template="35"] .dict-rec-grid,
[data-template="39"] .dict-rec-grid,
[data-template="41"] .dict-rec-grid,
[data-template="42"] .dict-rec-grid,
[data-template="45"] .dict-rec-grid,
[data-template="48"] .dict-rec-grid,
[data-template="49"] .dict-rec-grid { grid-template-columns: repeat(3, 1fr); }
[data-template="4"] .dict-search,
[data-template="5"] .dict-search,
[data-template="6"] .dict-search,
[data-template="12"] .dict-search,
[data-template="13"] .dict-search,
[data-template="20"] .dict-search,
[data-template="21"] .dict-search,
[data-template="29"] .dict-search,
[data-template="33"] .dict-search,
[data-template="34"] .dict-search,
[data-template="35"] .dict-search,
[data-template="39"] .dict-search,
[data-template="41"] .dict-search,
[data-template="42"] .dict-search,
[data-template="45"] .dict-search,
[data-template="48"] .dict-search,
[data-template="49"] .dict-search { margin-bottom: 12px; }
[data-template="4"] .dict-search-input,
[data-template="5"] .dict-search-input,
[data-template="6"] .dict-search-input,
[data-template="12"] .dict-search-input,
[data-template="13"] .dict-search-input,
[data-template="20"] .dict-search-input,
[data-template="21"] .dict-search-input,
[data-template="29"] .dict-search-input,
[data-template="33"] .dict-search-input,
[data-template="34"] .dict-search-input,
[data-template="35"] .dict-search-input,
[data-template="39"] .dict-search-input,
[data-template="41"] .dict-search-input,
[data-template="42"] .dict-search-input,
[data-template="45"] .dict-search-input,
[data-template="48"] .dict-search-input,
[data-template="49"] .dict-search-input { height: 38px; font-size: 0.9rem; }
[data-template="4"] .dict-search-btn,
[data-template="5"] .dict-search-btn,
[data-template="6"] .dict-search-btn,
[data-template="12"] .dict-search-btn,
[data-template="13"] .dict-search-btn,
[data-template="20"] .dict-search-btn,
[data-template="21"] .dict-search-btn,
[data-template="29"] .dict-search-btn,
[data-template="33"] .dict-search-btn,
[data-template="34"] .dict-search-btn,
[data-template="35"] .dict-search-btn,
[data-template="39"] .dict-search-btn,
[data-template="41"] .dict-search-btn,
[data-template="42"] .dict-search-btn,
[data-template="45"] .dict-search-btn,
[data-template="48"] .dict-search-btn,
[data-template="49"] .dict-search-btn { height: 38px; font-size: 0.9rem; }

/* 布局 C: 极简 (T7-T8) */
[data-template="7"] .dict-rec-grid,
[data-template="8"] .dict-rec-grid,
[data-template="15"] .dict-rec-grid,
[data-template="16"] .dict-rec-grid,
[data-template="23"] .dict-rec-grid,
[data-template="24"] .dict-rec-grid,
[data-template="31"] .dict-rec-grid,
[data-template="32"] .dict-rec-grid,
[data-template="36"] .dict-rec-grid,
[data-template="37"] .dict-rec-grid,
[data-template="43"] .dict-rec-grid,
[data-template="44"] .dict-rec-grid,
[data-template="46"] .dict-rec-grid,
[data-template="47"] .dict-rec-grid,
[data-template="50"] .dict-rec-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
[data-template="7"] .dict-search,
[data-template="8"] .dict-search,
[data-template="15"] .dict-search,
[data-template="16"] .dict-search,
[data-template="23"] .dict-search,
[data-template="24"] .dict-search,
[data-template="31"] .dict-search,
[data-template="32"] .dict-search,
[data-template="36"] .dict-search,
[data-template="37"] .dict-search,
[data-template="43"] .dict-search,
[data-template="44"] .dict-search,
[data-template="46"] .dict-search,
[data-template="47"] .dict-search,
[data-template="50"] .dict-search { margin-bottom: 8px; }
[data-template="7"] .dict-search-input,
[data-template="8"] .dict-search-input,
[data-template="15"] .dict-search-input,
[data-template="16"] .dict-search-input,
[data-template="23"] .dict-search-input,
[data-template="24"] .dict-search-input,
[data-template="31"] .dict-search-input,
[data-template="32"] .dict-search-input,
[data-template="36"] .dict-search-input,
[data-template="37"] .dict-search-input,
[data-template="43"] .dict-search-input,
[data-template="44"] .dict-search-input,
[data-template="46"] .dict-search-input,
[data-template="47"] .dict-search-input,
[data-template="50"] .dict-search-input { height: 36px; font-size: 0.85rem; border-radius: 8px; }
[data-template="7"] .dict-search-btn,
[data-template="8"] .dict-search-btn,
[data-template="15"] .dict-search-btn,
[data-template="16"] .dict-search-btn,
[data-template="23"] .dict-search-btn,
[data-template="24"] .dict-search-btn,
[data-template="31"] .dict-search-btn,
[data-template="32"] .dict-search-btn,
[data-template="36"] .dict-search-btn,
[data-template="37"] .dict-search-btn,
[data-template="43"] .dict-search-btn,
[data-template="44"] .dict-search-btn,
[data-template="46"] .dict-search-btn,
[data-template="47"] .dict-search-btn,
[data-template="50"] .dict-search-btn { height: 36px; font-size: 0.85rem; border-radius: 8px; }
[data-template="7"] .dict-rec-title,
[data-template="8"] .dict-rec-title,
[data-template="15"] .dict-rec-title,
[data-template="16"] .dict-rec-title,
[data-template="23"] .dict-rec-title,
[data-template="24"] .dict-rec-title,
[data-template="31"] .dict-rec-title,
[data-template="32"] .dict-rec-title,
[data-template="36"] .dict-rec-title,
[data-template="37"] .dict-rec-title,
[data-template="43"] .dict-rec-title,
[data-template="44"] .dict-rec-title,
[data-template="46"] .dict-rec-title,
[data-template="47"] .dict-rec-title,
[data-template="50"] .dict-rec-title { font-size: 0.9rem; }

@media (max-width: 480px) {
    .dict-rec-grid { grid-template-columns: repeat(2, 1fr); }
    .dict-word { font-size: 1.3rem; }
    [data-template="4"] .dict-rec-grid,
    [data-template="5"] .dict-rec-grid,
    [data-template="6"] .dict-rec-grid { grid-template-columns: repeat(2, 1fr); }
}
