/* Components share the word-tree reading pattern; the diagram is optional. */
#entry:has(.component-study)>.component-symbol{width:100px;padding:6px 12px;font-size:60px;margin:16px 0;border-radius:16px}
.component-study .tree-study-header{margin-bottom:10px}
.component-study .tree-study-header h3{margin:0}
.component-study .ct-legend{border:0;padding:0;margin:10px 0 22px;font-size:13px}
.ct-count{margin:14px 0}
.component-study .tree-filters input,.component-study .tree-filters select{width:100%;min-width:0}
.ct-groups{display:flex;flex-wrap:wrap;gap:8px;padding:0 0 18px;border-bottom:1px solid var(--line)}
.ct-groups button{display:flex;gap:9px;align-items:center;min-height:44px;font-size:14px;padding:9px 13px}
.ct-groups button span{font-size:12px;opacity:.8;font-variant-numeric:tabular-nums}
.ct-groups [aria-pressed=true]{color:var(--accent);border-color:var(--accent);background:var(--soft);font-weight:650}
.ct-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:14px;margin-top:20px}
.ct-card-position{align-self:flex-start;font-size:12px;line-height:1.5;color:var(--muted);padding:3px 8px;background:#f0f3eb;border-radius:8px}
.ct-card-grid .ct-leaf{width:100%;padding:20px;gap:7px;box-shadow:none;border:1px solid var(--line);background:#fffefb;border-radius:14px;min-height:260px;transform:none;touch-action:auto}
.ct-card-grid .ct-leaf[aria-pressed=true]{border-color:var(--accent);background:var(--soft);box-shadow:0 0 0 1px var(--accent)}
.ct-card-grid .ct-leaf .ct-glyph{width:96px;max-width:100%;height:96px}
.ct-card-grid .ct-leaf .pinyin{font-size:21px;line-height:1.65;color:var(--accent)}
.ct-card-grid .ct-traditional{font-size:19px}
.ct-card-grid .ct-meaning{font-size:15px;line-height:1.7}
.ct-card-meta{display:block;border-top:1px solid var(--line);padding-top:12px;margin-top:auto;width:100%;font-size:12px;line-height:1.7;color:var(--muted)}
.ct-card-action{font-size:13px;line-height:1.6;color:var(--accent)}
.ct-empty{padding:24px 12px;text-align:center;font-size:15px;color:var(--muted)}
.ct-leaf:focus-visible,.ct-groups button:focus-visible,.ct-group-all:focus-visible,.ct-dialog button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.ct-group-all{width:100%;font-size:13px;margin-top:12px;min-height:44px;color:var(--accent);background:var(--soft)}
#ct-map-panel{margin-top:18px}
#ct-map-panel .ct-meaning,#ct-map-panel .ct-traditional{display:none}
#ct-map-panel .ct-canvas[data-chinese=false] .ct-meaning{display:block}
#ct-map-panel .ct-leaf .ct-glyph{max-width:70px}
#ct-map-panel .ct-leaves{grid-template-columns:repeat(auto-fit,minmax(96px,1fr))}
.ct-dialog{box-sizing:border-box;width:min(740px,calc(100vw - 28px));max-height:calc(100dvh - 28px);margin:auto;padding:24px;border:1px solid var(--line);border-radius:22px;overflow-y:auto;background:var(--paper);color:var(--ink);box-shadow:0 22px 80px #102b2540}
.ct-dialog::backdrop{background:#102b25a8;backdrop-filter:blur(3px)}
.ct-dialog-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0 16px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--paper);z-index:1}
.ct-dialog-bar h3{font-size:19px;margin:0}
.ct-dialog-bar button{min-height:44px;font-size:13px;flex-shrink:0}
.ct-dialog .ct-detail{border:0;padding:0;margin-top:20px;outline:none}
.ct-dialog .ct-detail-heading{margin-bottom:16px}
.ct-dialog .ct-detail-body{grid-template-columns:180px minmax(0,1fr)}
.ct-dialog .ct-explanation .hanzi{font-size:30px}
.ct-dialog .ct-explanation .pinyin{font-size:22px}
.ct-dialog .ct-explanation .traditional{font-size:21px}
.ct-dialog .ct-explanation .translation{font-size:16px}
.ct-dialog .ct-position{margin-top:20px}
.ct-dialog-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding-top:18px;margin-top:20px}
.ct-dialog-nav button{min-height:44px;font-size:13px}
.ct-dialog-position{white-space:nowrap}
@media(max-width:600px){.ct-dialog{padding:16px;border-radius:17px}.ct-dialog .ct-detail-body{grid-template-columns:1fr}.ct-dialog-bar{flex-wrap:wrap}.ct-dialog-bar h3{font-size:18px}.ct-dialog-nav{gap:6px}.ct-dialog-nav button{font-size:12px;padding:9px}.ct-card-grid .ct-leaf{padding:18px}.ct-groups{gap:7px}}
@media print{#ct-map-panel,.ct-groups,.component-study .tree-filters,.component-study .tree-view-switch,.ct-dialog,.ct-card-action,.component-study .tree-list-footer button{display:none!important}.ct-card-grid{grid-template-columns:repeat(3,1fr)}.ct-card-grid .ct-leaf{break-inside:avoid;box-shadow:none}.ct-card-grid .ct-leaf[aria-pressed=true]{box-shadow:none}}