/* —— 汉字 / 词语 字典 —— */
.zi-hero { display:flex; gap:var(--sp-5); flex-wrap:wrap; align-items:flex-start; }
.zi-fonts { display:flex; gap:14px; flex-wrap:wrap; }
.zi-font { text-align:center; }
.zi-font .big { font-size:80px; line-height:1; width:118px; height:118px; display:grid; place-items:center; border:1px solid var(--c-line); border-radius:var(--radius); background:#fff; color:var(--c-ink); }
.zi-font .lbl { font-size:var(--t-xs); color:var(--c-ink-3); margin-top:5px; }
/* 开源可商用字体（思源=Noto，霞鹜文楷；字体文件后续放 /assets/fonts 并 @font-face，未就位时回退系统字体） */
.zi-font.hei  .big { font-family:"Noto Sans CJK SC","Source Han Sans SC","思源黑体",system-ui,sans-serif; }
.zi-font.song .big { font-family:"Noto Serif CJK SC","Source Han Serif SC","思源宋体","SimSun",serif; }
.zi-font.kai  .big { font-family:"LXGW WenKai","霞鹜文楷","KaiTi","STKaiti",serif; }
.zi-meta { flex:1; min-width:240px; }
.zi-speak { display:inline-flex; gap:8px; margin:8px 0; }
.zi-fields { width:100%; border-collapse:collapse; margin-top:6px; }
.zi-fields th, .zi-fields td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--c-line); font-size:var(--t-sm); vertical-align:top; }
.zi-fields th { color:var(--c-ink-3); width:84px; font-weight:400; white-space:nowrap; }
.zi-fields .code, .zi-fields .num { font-family:var(--font-mono); }
.zi-evo { display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; }
.zi-evo .step { text-align:center; min-width:72px; }
.zi-evo .step .glyph { height:80px; width:72px; display:grid; place-items:center; border:1px dashed var(--c-line); border-radius:8px; color:var(--c-ink-3); font-size:12px; padding:4px; background:#fff; }
.zi-evo .step .glyph img { max-width:100%; max-height:100%; }
.zi-evo .step .nm { font-size:var(--t-xs); color:var(--c-ink-3); margin-top:5px; }
/* 汉字字格：更大更松、更好点 */
.zi-index-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(72px,1fr)); gap:12px; }
.zi-cell { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-height:76px; padding:12px 6px; border:1px solid var(--c-line); border-radius:10px; background:#fff; text-decoration:none; transition:border-color .15s, box-shadow .15s, transform .15s; }
.zi-cell:hover { border-color:var(--c-primary); box-shadow:0 4px 14px rgba(0,0,0,.08); transform:translateY(-1px); }
.zi-cell .c { font-size:30px; line-height:1.1; font-family:"Noto Serif CJK SC",serif; color:var(--c-ink); }
.zi-cell .p { font-size:12px; color:var(--c-ink-3); }
@media (max-width:640px){ .zi-index-grid { grid-template-columns:repeat(auto-fill,minmax(64px,1fr)); gap:10px; } }

/* 词语网格卡片：多字词更宽、间距舒适 */
.ci-word-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; }
.ci-word-card { display:flex; flex-direction:column; gap:4px; padding:12px 14px; border:1px solid var(--c-line); border-radius:10px; background:#fff; text-decoration:none; transition:border-color .15s, box-shadow .15s, transform .15s; }
.ci-word-card:hover { border-color:var(--c-primary); box-shadow:0 4px 14px rgba(0,0,0,.08); transform:translateY(-1px); }
.ci-word-card .w { font-size:18px; color:var(--c-ink); font-family:var(--font-serif); }
.ci-word-card .meta { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ci-word-card .py { font-size:12px; color:var(--c-ink-3); }
.ci-word-card .wt { font-size:11px; color:var(--c-ink-3); background:var(--c-line); border-radius:6px; padding:1px 7px; }

/* 快速查询面板：更松、chips 可点区更大 */
.zi-finder .panel-bd { padding: 14px 16px; }
.zi-finder-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; margin: 10px 0; }
.zi-finder-row + .zi-finder-row { border-top: 1px dashed var(--c-line, #eee); padding-top: 12px; }
.zi-finder-row .search-hot-lbl { min-width: 76px; color: var(--c-ink-3); font-size: var(--t-sm); }
.zi-finder-row .search-hot a { padding:5px 12px; border:1px solid var(--c-line); border-radius:999px; line-height:1.4; transition:all .15s; }
.zi-finder-row .search-hot a:hover { border-color:var(--c-primary); color:var(--c-primary); }
.zi-finder-row .search-hot a.on { background:var(--c-primary); color:#fff; border-color:transparent; }
.zi-finder-row select, .zi-finder-row input { min-height:36px; }
