.hsk-nav-bar:where(.io-7cbb3cle){flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:2rem;font-size:.875rem;display:flex}.nav-back-link:where(.io-7cbb3cle){color:var(--text-secondary,#475569);align-items:center;gap:.35rem;font-weight:500;text-decoration:none;transition:color .15s;display:inline-flex}.nav-back-link:where(.io-7cbb3cle):hover{color:var(--primary,#0f172a)}.nav-breadcrumbs:where(.io-7cbb3cle){color:var(--text-muted,#94a3b8);align-items:center;gap:.4rem;display:inline-flex}.nav-breadcrumbs:where(.io-7cbb3cle) a:where(.io-7cbb3cle){color:var(--text-secondary,#475569);text-decoration:none;transition:color .15s}.nav-breadcrumbs:where(.io-7cbb3cle) a:where(.io-7cbb3cle):hover{color:var(--primary,#0f172a)}.nav-breadcrumbs:where(.io-7cbb3cle) .sep:where(.io-7cbb3cle){color:var(--text-muted,#cbd5e1)}.nav-breadcrumbs:where(.io-7cbb3cle) .current:where(.io-7cbb3cle){color:var(--text-heading,#0f172a);font-weight:500}.hsk-section-container:where(.io-7cbb3cle){max-width:var(--page-max-width,1140px);margin:0 auto;padding:1.5rem 1rem 4rem}.hsk-section-header:where(.io-7cbb3cle){flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1.5rem;margin-bottom:2rem;display:flex}.section-badge-row:where(.io-7cbb3cle){align-items:center;gap:.5rem;margin-bottom:.5rem;display:flex}.section-h1:where(.io-7cbb3cle){color:var(--text-heading,#0f172a);letter-spacing:-.02em;margin:0 0 .5rem;font-size:clamp(1.6rem,3vw,2.25rem);font-weight:800;line-height:1.25}.section-lead:where(.io-7cbb3cle){color:var(--text-secondary,#475569);max-width:44rem;margin:0;font-size:1rem;line-height:1.55}.header-action:where(.io-7cbb3cle){flex-shrink:0}.char-filter-bar:where(.io-7cbb3cle){background:var(--bg-surface-elevated,#fff);border:1px solid var(--border,#0000001a);border-radius:var(--radius-medium,8px);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;padding:.75rem 1rem;display:flex}.search-input-wrapper:where(.io-7cbb3cle){flex-grow:1;align-items:center;gap:.5rem;max-width:28rem;display:flex}.search-icon:where(.io-7cbb3cle){color:var(--text-muted,#94a3b8);flex-shrink:0}.char-search-field:where(.io-7cbb3cle){width:100%;color:var(--text-heading,#0f172a);background:0 0;border:none;outline:none;padding:.25rem 0;font-size:.875rem}.filter-controls-right:where(.io-7cbb3cle){align-items:center;gap:1rem;display:flex}.view-pill-selector:where(.io-7cbb3cle){background:var(--bg-subtle,#0000000a);border-radius:var(--radius-medium,6px);padding:.15rem;display:inline-flex}.view-pill-btn:where(.io-7cbb3cle){color:var(--text-muted,#64748b);border-radius:var(--radius-small,4px);cursor:pointer;background:0 0;border:none;padding:.25rem .65rem;font-size:.75rem;font-weight:600;transition:all .15s}.view-pill-btn:where(.io-7cbb3cle).active{background:var(--bg-surface-elevated,#fff);color:var(--primary,#059669);box-shadow:0 1px 2px #0000000f}.filter-count-indicator:where(.io-7cbb3cle){color:var(--text-muted,#64748b);font-size:.8125rem;font-weight:500}.char-cards-grid:where(.io-7cbb3cle){grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.75rem;display:grid}.char-card:where(.io-7cbb3cle){content-visibility:auto;contain-intrinsic-size:0 90px;border-radius:var(--radius-medium,8px);background:var(--bg-surface-elevated,#fff);border:1px solid var(--border,#00000014);transition:border-color .15s,box-shadow .15s;position:relative;overflow:hidden}.char-corner-badge:where(.io-7cbb3cle){color:var(--primary,#059669);opacity:.7;pointer-events:none;justify-content:center;align-items:center;transition:opacity .15s,transform .15s;display:inline-flex;position:absolute;top:.4rem;right:.45rem}.char-card:where(.io-7cbb3cle):hover .char-corner-badge:where(.io-7cbb3cle){opacity:1;transform:scale(1.1)}.char-card:where(.io-7cbb3cle)[hidden]{display:none!important}.char-card:where(.io-7cbb3cle).has-enrichment{border-color:light-dark(#0596694d,#05966966)}.char-card:where(.io-7cbb3cle).has-enrichment:hover{border-color:var(--primary,#059669);box-shadow:var(--shadow-small,0 2px 4px #0000000d)}.char-card-inner-link:where(.io-7cbb3cle),.char-card-inner-plain:where(.io-7cbb3cle){color:inherit;text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:.875rem .5rem;text-decoration:none;display:flex}.char-card-inner-link:where(.io-7cbb3cle){cursor:pointer}.char-header-row:where(.io-7cbb3cle){justify-content:center;align-items:center;margin-bottom:.25rem;display:flex}.char-pinyin:where(.io-7cbb3cle){color:var(--primary,#059669);font-size:.8125rem;font-weight:600}.char-glyph-row:where(.io-7cbb3cle){justify-content:center;align-items:center;margin:.1rem 0;display:inline-flex;position:relative}.hanzi-glyph:where(.io-7cbb3cle){color:var(--text-heading,#0f172a);font-size:2.25rem;font-weight:600;line-height:1.2;font-family:var(--font-sans)}.char-link-icon:where(.io-7cbb3cle){color:var(--primary,#059669);opacity:.6;position:absolute;top:-.2rem;right:-.75rem}.char-card:where(.io-7cbb3cle):hover .char-link-icon:where(.io-7cbb3cle){opacity:1}.char-meta-row:where(.io-7cbb3cle){color:var(--text-muted,#94a3b8);align-items:center;gap:.35rem;margin-top:.25rem;font-size:.6875rem;display:flex}@media (width<=640px){.hsk-section-header:where(.io-7cbb3cle){flex-direction:column;align-items:stretch}.header-action:where(.io-7cbb3cle) .button:where(.io-7cbb3cle){justify-content:center;width:100%}.char-filter-bar:where(.io-7cbb3cle){flex-direction:column;align-items:stretch}.filter-controls-right:where(.io-7cbb3cle){justify-content:space-between}.char-cards-grid:where(.io-7cbb3cle){grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}}