.pc{display:grid;gap:var(--space-6);padding-top:104px;padding-bottom:var(--space-16)}.pc-head .lead,.pc-head h1{margin:0}.pc-head .lead{margin-top:var(--space-2)}.pc-detail{display:grid;gap:var(--space-4);min-height:120px;align-content:start}.pc-detail>p{margin:0}.pc-detail-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-3)}.pc-syllable{margin:0;font-family:var(--font-pinyin)}.pc-detail-head .btn{gap:8px}.pc-tones{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:var(--space-3)}.pc .pc-tone{position:relative;display:grid;justify-items:center;gap:var(--space-1);width:100%;padding:var(--space-3);background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-control);color:inherit;cursor:pointer}.pc .pc-tone:hover,.pc .pc-tone[aria-pressed=true]{border-color:var(--control);box-shadow:0 6px 18px -10px rgb(var(--shadow)/.35)}.pc .pc-tone[aria-pressed=true]{box-shadow:inset 0 0 0 2px var(--primary)}.pc-tone-pinyin{font-size:20px}.pc-tone-icon{position:absolute;top:8px;right:8px;color:var(--muted)}.pc-sounds{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-1) var(--space-4);font-size:var(--fs-small)}.pc-sounds dt{color:var(--muted);white-space:nowrap}.pc-sounds dt b{color:var(--text);font-family:var(--font-pinyin)}.pc-sounds dd{margin:0}.pc-groups{justify-self:start}.pc-skeleton{height:320px}.pc-scroll{overflow-x:auto;overscroll-behavior-x:contain;border:1px solid var(--border);border-radius:var(--radius-control)}.pc-table{border-collapse:separate;border-spacing:0;min-width:100%;font-family:var(--font-pinyin)}.pc-table th{position:sticky;background:var(--surface);color:var(--muted);font-weight:700;font-size:14px;padding:var(--space-2);text-align:center;z-index:1}.pc-table thead th{top:0;border-bottom:1px solid var(--border)}.pc-table tbody th{left:0;border-right:1px solid var(--border);min-width:48px}.pc-table thead th:first-child{left:0;z-index:2}.pc-table td{padding:2px;text-align:center;border-bottom:1px solid color-mix(in srgb,var(--border) 50%,transparent)}.pc-cell{min-width:56px;min-height:40px;padding:0 var(--space-2);border:0;border-radius:8px;background:transparent;color:var(--text);font:inherit;font-size:15px;cursor:pointer}.pc-cell:hover{background:var(--surface)}.pc-cell[aria-pressed=true]{background:var(--primary);color:var(--on-primary)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}