/* pcs.css - the pitch-class set calculator. */
.pc-in label{display:block;font-weight:700;margin:0 0 6px}
.pc-row{display:flex;gap:10px;flex-wrap:wrap}
.pc-row input{flex:1 1 260px;min-width:0;font:500 20px var(--f-body);min-height:52px;padding:10px 14px;border-radius:14px;border:2px solid var(--rule-2);background:var(--surface);color:var(--ink)}
.pc-err{color:var(--bad,#b8432f);font-weight:600;margin:8px 0 0}
.pc-kb{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;margin:16px 0 0;max-width:760px;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
@media (max-width:560px){.pc-kb{grid-template-columns:repeat(6,minmax(0,1fr))}}
.pc-key{display:grid;place-items:center;gap:2px;min-height:62px;border-radius:12px;border:2px solid var(--rule-2);background:var(--surface);color:var(--ink);cursor:pointer;
  box-shadow:inset 0 -4px 0 rgba(var(--ink-rgb),.1);touch-action:manipulation;padding:4px 0}
.pc-key.blk{background:var(--sunk)}
.pc-key .n{font:700 17px var(--f-body)}.pc-key .i{font:500 13px var(--f-mono);color:var(--ink-3)}
.pc-key[aria-pressed="true"]{background:var(--study);border-color:var(--study);color:#fff}
.pc-key[aria-pressed="true"] .i{color:rgba(255,255,255,.85)}
:root[data-theme="dark"] .pc-key[aria-pressed="true"]{color:#04161c}
.pc-key:active{transform:translateY(2px);box-shadow:none}
.pc-out{margin:26px 0 0;display:grid;gap:8px 40px}
@media (min-width:980px){.pc-out{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.pc-out .mn-fig{grid-column:1/-1}}
.pc-dl{display:grid;grid-template-columns:max-content 1fr;gap:10px 22px;margin:0;align-content:start}
.pc-dl dt{color:var(--ink-3);font-weight:600}
.pc-dl dd{margin:0;font-weight:600}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.pc-out h2{font-size:19px;margin:0 0 8px}
.pc-subs{list-style:none;margin:0;padding:0;columns:2;column-gap:24px}
.pc-subs li{padding:4px 0;border-bottom:1px solid var(--rule)}