.hanzi-chart{display:flex;flex-direction:column;height:100%;padding:var(--spacing-lg);gap:var(--spacing-lg)}.hanzi-header{display:flex;flex-direction:column;gap:var(--spacing-md)}.hanzi-title-row{display:flex;align-items:baseline;gap:var(--spacing-md);flex-wrap:wrap}.hanzi-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0}.hanzi-count{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.hanzi-search{position:relative;max-width:400px}.hanzi-search-input{width:100%;padding:var(--spacing-sm) var(--spacing-md);padding-right:var(--spacing-xl);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);background:var(--color-surface);color:var(--color-text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.hanzi-search-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #4a90e21a}.hanzi-search-input::placeholder{color:var(--color-text-tertiary)}.hanzi-search-clear{position:absolute;right:var(--spacing-sm);top:50%;transform:translateY(-50%);background:none;border:none;font-size:var(--font-size-xl);color:var(--color-text-tertiary);cursor:pointer;padding:var(--spacing-xs);line-height:1}.hanzi-search-clear:hover{color:var(--color-text)}.hanzi-level-tabs{display:flex;gap:var(--spacing-sm);flex-wrap:wrap}.hanzi-level-tab{display:flex;flex-direction:column;align-items:center;padding:var(--spacing-sm) var(--spacing-lg);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);cursor:pointer;transition:all var(--transition-fast);min-width:80px}.hanzi-level-tab:hover:not(.disabled){border-color:var(--color-primary);background:#4a90e20d}.hanzi-level-tab.active{border-color:var(--color-primary);background:#4a90e21a;color:var(--color-primary)}.hanzi-level-tab.disabled{opacity:.5;cursor:not-allowed}.tab-level{font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm)}.tab-count{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.hanzi-level-tab.active .tab-count{color:var(--color-primary)}.hanzi-detail{display:flex;align-items:center;gap:var(--spacing-lg);padding:var(--spacing-md) var(--spacing-lg);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm)}.detail-hanzi{font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);font-family:Noto Sans SC,SimHei,Microsoft YaHei,sans-serif}.detail-pinyin{font-size:var(--font-size-xl);color:var(--color-primary)}.detail-meaning{font-size:var(--font-size-base);color:var(--color-text-secondary)}.hanzi-grid-container{flex:1;overflow-y:auto;min-height:0}.hanzi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--spacing-md);padding:var(--spacing-xs)}.hanzi-grid:focus{outline:none}.hanzi-grid-empty{display:flex;align-items:center;justify-content:center;padding:var(--spacing-2xl);color:var(--color-text-secondary);font-size:var(--font-size-lg)}.hanzi-card{display:flex;flex-direction:column;align-items:center;padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);cursor:pointer;transition:all var(--transition-fast);position:relative;min-height:100px}.hanzi-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--color-primary)}.hanzi-card.selected{border-color:var(--color-primary);box-shadow:0 0 0 2px #4a90e233}.hanzi-card.playing{background:#4a90e20d}.hanzi-card.error{border-color:var(--color-error)}.hanzi-character{font-size:2rem;font-weight:var(--font-weight-bold);font-family:Noto Sans SC,SimHei,Microsoft YaHei,sans-serif;line-height:1.2;color:var(--color-text)}.hanzi-pinyin{font-size:var(--font-size-sm);color:var(--tone-color, var(--color-primary));margin-top:var(--spacing-xs)}.hanzi-meaning{font-size:var(--font-size-xs);color:var(--color-text-secondary);text-align:center;margin-top:var(--spacing-xs);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.tone-indicator{position:absolute;top:var(--spacing-xs);right:var(--spacing-xs);width:6px;height:6px;border-radius:var(--radius-full);background:var(--tone-color, var(--color-text-tertiary))}.hanzi-card .playing-indicator,.hanzi-card .error-indicator{position:absolute;top:var(--spacing-xs);left:var(--spacing-xs);font-size:var(--font-size-xs)}.hanzi-keyboard-hint{display:flex;justify-content:center;gap:var(--spacing-lg);padding:var(--spacing-md);font-size:var(--font-size-xs);color:var(--color-text-tertiary)}@media(max-width:768px){.hanzi-chart{padding:var(--spacing-md)}.hanzi-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:var(--spacing-sm)}.hanzi-card{padding:var(--spacing-sm);min-height:80px}.hanzi-character{font-size:1.5rem}.hanzi-level-tabs{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}.hanzi-level-tab{min-width:70px;padding:var(--spacing-xs) var(--spacing-md)}.hanzi-keyboard-hint{display:none}.hanzi-detail{flex-wrap:wrap;gap:var(--spacing-sm)}.detail-hanzi{font-size:var(--font-size-3xl)}}.hanzi-page[data-astro-cid-uus5siax]{width:100%;height:100%;display:flex;flex-direction:column}.hanzi-content[data-astro-cid-uus5siax]{flex:1;overflow:hidden;display:flex;flex-direction:column}