/* /teoria/imagem/onda/: rótulos sobre as figuras, gráficos SVG, tabela curta e o instrumento da frente. */

/* rótulos sobre figura em grade 2 x 2 (.quad) ou em duas colunas (.par) */
.rotulada .frame{position:relative}
.rotulada .rot{position:absolute;font:600 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink);background:rgba(12,18,20,.82);padding:6px 8px;border-radius:3px;pointer-events:none}
.quad .rot.a{left:10px;top:10px}.quad .rot.b{left:calc(50% + 10px);top:10px}
.quad .rot.c{left:10px;top:calc(50% + 10px)}.quad .rot.d{left:calc(50% + 10px);top:calc(50% + 10px)}
.par .rot.a{left:10px;top:10px}.par .rot.b{left:calc(50% + 10px);top:10px}
@media (max-width:560px){.rotulada .rot{font-size:9.5px;padding:4px 6px}}

/* gráficos */
.grafico .ref{stroke:var(--ink-3);fill:none;stroke-width:1.5;stroke-dasharray:5 5}
.grafico .tinta-l{stroke:var(--ink-2);fill:none;stroke-width:2;stroke-dasharray:7 3}
.grafico .tinta-l-f{fill:var(--ink-2)}
.grafico .r-acc{fill:var(--accent);font-weight:600}
.grafico .r-seed{fill:var(--seed-ink);font-weight:600}
.grafico .r-tinta{fill:var(--ink-2);font-weight:600}
.fig-lado{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:18px;align-items:center}
@media (max-width:640px){.fig-lado{grid-template-columns:minmax(0,1fr)}}
.lgd-svg{display:flex;flex-wrap:wrap;gap:6px 18px;font:500 12.5px var(--mono);color:var(--ink-3)}
.lgd-svg i{display:inline-block;width:18px;height:0;border-top:2px solid;vertical-align:middle;margin-right:6px}
.lgd-svg .acc{border-color:var(--accent)}.lgd-svg .seed{border-color:var(--seed)}
.lgd-svg .tinta{border-color:var(--ink-2);border-top-style:dashed}.lgd-svg .ref{border-color:var(--ink-3);border-top-style:dotted}

/* tabela curta */
.tab{width:100%;border-collapse:collapse;font:500 14px/1.4 var(--mono);color:var(--ink-2);font-variant-numeric:tabular-nums}
.tab th{font:600 11px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);text-align:right;padding:8px 10px;border-bottom:1px solid var(--line)}
.tab td{text-align:right;padding:8px 10px;border-bottom:1px solid var(--line-soft)}
.tab th:first-child,.tab td:first-child{text-align:left}
.tab-wrap{overflow-x:auto;border:1px solid var(--line-soft);border-radius:var(--r-panel);background:var(--surface)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* instrumento */
.onda-grade{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}
@media (max-width:700px){.onda-grade{grid-template-columns:minmax(0,1fr)}}
.lab #onda-img{cursor:crosshair;image-rendering:auto}
.lab .botoes{display:flex;gap:8px;flex-wrap:wrap}
.lab .btn[aria-pressed="true"]{border-color:var(--accent);color:var(--accent)}
.lab .lado{display:grid;gap:12px;align-content:start}
.lab [hidden]{display:none!important}