/* Cheat-sheet tables, "train it" callouts and the download card.
   Used by /eq-frequency-chart and the per-instrument EQ guides (/vocal-eq etc).
   Tokens come from instrument.css. */

/* ---------- cheat-sheet table ---------- */
.eqs-tbl{width:100%;max-width:980px;border-collapse:collapse;border:1px solid var(--line);background:var(--module);margin:8px 0 28px;font-size:15px;line-height:1.5}
.eqs-tbl caption{caption-side:top;text-align:left;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint);padding:0 0 10px}
.eqs-tbl th{font-family:'Space Mono',monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);font-weight:400;text-align:left;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--panel);vertical-align:bottom}
.eqs-tbl td{padding:13px 16px;border-bottom:1px solid var(--line);color:var(--ink-dim);vertical-align:top}
.eqs-tbl tbody tr:last-child td{border-bottom:none}
.eqs-tbl td:first-child{color:var(--ink);font-weight:600}
.eqs-tbl td:first-child a{color:var(--ink);border-bottom:1px solid var(--signal-dim)}
.eqs-tbl td:first-child a:hover{color:var(--signal)}
.eqs-tbl .hz{font-family:'Space Mono',monospace;font-size:13px;color:var(--signal);white-space:nowrap}
.eqs-tbl .hz--cut{color:#ff8a7a}
.eqs-tbl .it{display:block;padding:1px 0}
.eqs-tbl td:first-child .eqs-guide{display:inline-block;margin-top:6px;font-family:'Space Mono',monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:400;color:var(--signal);border-bottom:1px solid var(--signal-dim)}
.eqs-tbl tr.is-target td{background:rgba(45,212,191,.06)}   /* set by site.js: :target doesn't follow pushState */
.eqs-tbl tr[id]{scroll-margin-top:96px}

/* ---------- section anchors ---------- */
.eqs-anchor{scroll-margin-top:96px}
.eqs-jump{display:flex;flex-wrap:wrap;gap:8px 10px;margin:4px 0 26px;max-width:980px}
.eqs-jump a{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-dim);border:1px solid var(--line);padding:7px 12px;transition:.18s}
.eqs-jump a:hover{color:var(--signal);border-color:var(--signal-dim)}
.prose .eqs-jump a{border-bottom:1px solid var(--line)}
.prose .eqs-jump a:hover{border-bottom-color:var(--signal-dim)}

/* ---------- "train it" callout (Mix Chops) ---------- */
.eqs-train{max-width:68ch;margin:6px 0 30px;padding:16px 20px;border:1px solid var(--line);border-left:2px solid var(--signal);background:var(--module)}
.eqs-train__ey{display:block;font-family:'Space Mono',monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--signal);margin-bottom:6px}
.eqs-train p{margin:0;color:var(--ink-dim);font-size:15.5px;line-height:1.6;max-width:none}
.eqs-train p strong{color:var(--ink);font-weight:600}
.eqs-train a{color:var(--signal);border-bottom:1px solid var(--signal-dim);font-weight:500;white-space:nowrap}
/* one-line version, used at the end of each problem */
.eqs-train--line{padding:11px 16px;margin:2px 0 26px}
.eqs-train--line p{font-size:15px}

/* ---------- download card ---------- */
.eqs-dl{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:clamp(20px,3vw,36px);align-items:center;max-width:860px;margin:10px 0 34px;padding:clamp(20px,3vw,30px);border:1px solid var(--line);background:var(--module)}
.eqs-dl__img{display:block;border:1px solid var(--line);line-height:0}
.eqs-dl__img img{width:100%;height:auto;display:block}
.eqs-dl h3{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;font-size:clamp(19px,2.2vw,25px);text-transform:uppercase;letter-spacing:-.01em;margin:0 0 10px;color:var(--ink)}
.eqs-dl p{color:var(--ink-dim);font-size:15px;line-height:1.6;margin:0 0 16px;max-width:52ch}
.eqs-dl .btn{margin-top:0}
.prose .btn{color:#04130f;border-bottom:none}   /* .prose a would otherwise recolour the button text */
.eqs-dl .fine{font-size:13.5px;color:var(--ink-faint);margin:14px 0 0}
.eqs-dl .fine a{color:var(--ink-dim);border-bottom:1px solid var(--line)}

@media (max-width:700px){
  .eqs-tbl thead{display:none}
  .eqs-tbl caption{display:block;padding:14px 16px 2px;border-bottom:none}
  .eqs-tbl,.eqs-tbl tbody,.eqs-tbl tr,.eqs-tbl td{display:block;width:100%}
  .eqs-tbl tr{padding:12px 16px;border-bottom:1px solid var(--line)}
  .eqs-tbl tbody tr:last-child{border-bottom:none}
  .eqs-tbl td{padding:3px 0;border:none}
  .eqs-tbl td[data-l]::before{content:attr(data-l);display:block;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);font-weight:400;margin-top:8px}
  .eqs-tbl td:first-child{font-size:16.5px}
  .eqs-dl{grid-template-columns:1fr}
  .eqs-dl__img{max-width:240px}
}

/* Print: rows the scroll-reveal hasn't shown yet are still at opacity 0 (.rv),
   which would print as blank pages. */
@media print{
  .rv{opacity:1!important;transform:none!important;transition:none!important}
}