/* Shared hierarchy for the static edition. Equivalent Chinese and English pages stay aligned. */
.tool-title:is(section),.sim-head,.nr-head,.ip-head{box-sizing:border-box;display:grid!important;grid-template-columns:minmax(0,1fr) 320px!important;gap:42px!important;align-items:end!important;max-width:none!important;min-height:190px;padding-bottom:24px!important;border-bottom:1px solid var(--line-dark)!important}
.tool-title:is(section) h1,.sim-head h1,.nr-head h1,.ip-head h1{margin:0!important;font-family:var(--display)!important;font-size:clamp(32px,3.7vw,42px)!important;font-weight:500!important;line-height:1.16!important;letter-spacing:-.018em!important}
.tool-title:is(section)>div>p:not(.kicker),.sim-head .intro,.nr-head>div>p:not(.kicker),.ip-head>div>p:not(.kicker){max-width:760px!important;margin:15px 0 0!important;color:var(--muted)!important;font-family:var(--sans)!important;font-size:15px!important;line-height:1.75!important}
.tool-title:is(section) .kicker,.sim-head .kicker,.nr-head .kicker,.ip-head .kicker{margin:0 0 9px!important;font-family:var(--sans)!important;font-size:12px!important;font-weight:600!important;line-height:1.2!important;letter-spacing:.13em!important;text-transform:uppercase}
@media(min-width:851px){html[lang="en"] .nr-head h1{font-size:clamp(26px,2.55vw,34px)!important;white-space:nowrap}}
.tool-meta,.theory-note,.nr-note,.ip-note{box-sizing:border-box;min-height:96px;align-self:end}
input,textarea,select,.field input,.input-row input,.tool-meta,.tool-meta .pitch-name,.tool-meta .accidental{font-family:var(--sans)!important;font-variant-numeric:lining-nums tabular-nums}
.hero-title{font-size:clamp(38px,4.7vw,54px)!important}.hero-title em{font-size:clamp(18px,2vw,24px)!important}.lead{font-size:clamp(15px,1.3vw,18px)!important}
.person-entry{grid-template-columns:minmax(0,760px) minmax(230px,300px)!important}.person-portrait{display:block;width:100%;height:auto;margin-bottom:18px;border-radius:2px;filter:saturate(.86) contrast(1.03)}
.person-entry .entry-section p{margin:0;color:var(--soft-ink);line-height:1.85}.person-entry .entry-section p+p{margin-top:12px}.person-entry .works-list{margin:0;padding-left:20px}.source-link{display:inline-block;margin-top:14px;font-size:12px}
@media(max-width:850px){.tool-title:is(section),.sim-head,.nr-head,.ip-head{grid-template-columns:1fr!important;min-height:0;gap:20px!important}}
/* Reusable editorial page primitives */
.page-heading {
    margin: 0;
    font-size: clamp(1.9rem, 3vw, 2.25rem);
}

.page-deck {
    max-width: 780px;
    color: var(--muted);
    font-size: 1.0625rem;
}

.table-scroll { overflow-x: auto; }
.empty-table { text-align: center; color: var(--muted); }

site-header, site-footer { display: block; }

/* Alphabetical theory index */
.az-index { margin-top: 30px; border-top: 1px solid var(--line); }
.az-group { display: grid; grid-template-columns: 54px minmax(0, 1fr); border-bottom: 1px solid var(--line); }
.az-group h2 { margin: 0; padding: 18px 0; color: var(--accent); font-family: var(--num); font-size: 16px; font-weight: 600; }
.az-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.az-links a { display: flex; justify-content: space-between; gap: 18px; padding: 18px 20px; border-left: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.az-links a:hover, .az-links a:focus-visible { color: var(--accent-dark); background: var(--accent-quiet); outline: 0; }
.az-links span { color: var(--accent); }

/* One tool per row; abbreviations are intentionally omitted. */
.tools-directory h1 { margin: 0; font-size: 36px; }
.tools-directory-list { margin-top: 30px; border-top: 1px solid var(--line); }
.tools-directory-row { display: grid; grid-template-columns: minmax(240px, .55fr) minmax(0, 1fr) 24px; gap: 28px; align-items: baseline; padding: 22px 0; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.tools-directory-title { font-size: 19px; }
.tools-directory-desc { color: var(--muted); font-size: 14px; }
.tools-directory-arrow { color: var(--accent); font-size: 21px; text-align: right; transition: transform .15s ease; }
.tools-directory-row:hover, .tools-directory-row:focus-visible { color: var(--accent-dark); background: var(--accent-quiet); outline: 0; }
.tools-directory-row:hover .tools-directory-arrow { transform: translateX(4px); }
@media (max-width: 760px) {
  .az-links { grid-template-columns: 1fr; }
  .tools-directory-row { grid-template-columns: 1fr 22px; gap: 5px 16px; }
  .tools-directory-desc { grid-column: 1; }
  .tools-directory-arrow { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
}
