/* Treino: Ritmos (teclado arranjador), Metrônomo e Repertório */

/* ===== Ritmos ===== */
.rt-stage{display:grid;gap:16px}
.rt-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 28px;align-items:center}
.rt-chords{display:flex;gap:28px;align-items:flex-end;min-width:0}
.rt-now,.rt-next{display:grid;gap:2px;min-width:0}
.rt-now b{font-family:var(--f-display);font-weight:800;font-size:clamp(64px,10vw,104px);line-height:.9;letter-spacing:-.01em;color:var(--accent-strong);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-next b{font-family:var(--f-display);font-weight:700;font-size:clamp(34px,5vw,52px);line-height:.95;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-next{padding-bottom:22px}
.rt-notes{font-size:14px;color:var(--ink-2);font-weight:600;min-height:21px}
.rt-trans{display:grid;gap:10px;justify-items:center;min-width:260px}
.rt-trans input[type=range]{max-width:280px}
.rt-lights{justify-content:center}
.rt-bpm{display:grid;justify-items:center;min-width:76px;line-height:1}
.rt-bpm b{font-family:var(--f-display);font-weight:800;font-size:46px;font-variant-numeric:tabular-nums}
.rt-bpm small{font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.1em}
.rt-bars{display:flex;flex-wrap:wrap;gap:6px}
.rt-bars button{border:1px solid var(--line);background:var(--surface);color:var(--ink-2);border-radius:var(--r-sm);padding:6px 10px;min-width:44px;font-weight:700;font-size:14px;font-family:var(--f-body)}
.rt-bars button.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.rt-kb{--kbh:132px}
.kb .k.rt-sc.w{background:#F3EFFC}
.kb .k.rt-sc.b{background:#3B3550}
.kb .k.rt-sc em::before{content:"";display:block;width:7px;height:7px;border-radius:50%;background:#9C86D8;margin:0 auto 2px}
.kb .k.rt-sc.b em::before{background:#C4B2FD}
.kb .k.rt-ton em::before{width:11px;height:11px;background:#6A3FD0}
.kb .k.rt-ton.b em::before{background:#E4DAFB}
.legend .sw.rt-sw-root{background:#B9A2F2}
.legend .sw.rt-sw-on{background:#E4DAFB}
.legend .sw.rt-sw-sc{background:#F3EFFC;position:relative}
.legend .sw.rt-sw-sc::after{content:"";position:absolute;inset:3px;border-radius:50%;background:#9C86D8}
.rt-styles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.rt-style{display:grid;gap:2px;align-content:start;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:var(--r);padding:9px 12px;color:var(--ink)}
.rt-style b{font-size:14px}
.rt-style span{font-size:12px;color:var(--muted)}
.rt-style:hover{border-color:var(--ink-2)}
.rt-style[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent) inset}
.rt-style[aria-pressed="true"] span{color:var(--accent-strong)}
.rt-tonics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.rt-tonics button{border:1px solid var(--line);background:var(--surface);color:var(--ink-2);border-radius:var(--r-sm);padding:8px 2px;font-weight:600;font-size:14px;white-space:nowrap}
.rt-tonics button:hover{border-color:var(--ink-2)}
.rt-tonics button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.rt-custom{display:flex;gap:8px;align-items:center}
.rt-custom input{flex:1;font-family:var(--f-mono)}
.rt-mix{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.rt-part{display:grid;gap:10px;border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;background:var(--surface-2)}
.rt-part .vol{min-width:0}
.rt-swing{max-width:300px}
@media (max-width:760px){
  .rt-top{grid-template-columns:minmax(0,1fr)}
  .rt-trans{min-width:0}
  .rt-mix{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:520px){
  .rt-chords{gap:18px}
  .rt-next{padding-bottom:14px}
  .rt-kb{--kbh:116px}
  .rt-styles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rt-style{padding:8px 10px}
}

/* ===== Metrônomo ===== */
.mt-big{display:grid;gap:16px;justify-items:center;text-align:center;padding:28px 20px}
.mt-big .bpmctl{flex-wrap:wrap;justify-content:center}
@media (min-width:901px){.mt-big{position:sticky;top:84px}}
.mt-lights{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 12px;min-height:66px;padding:4px 0}
.mt-bt{display:grid;justify-items:center;gap:6px}
.mt-bt i{width:30px;height:30px;border-radius:50%;background:var(--surface-3);transition:background .05s,transform .05s}
.mt-bt.g i{width:36px;height:36px}
.mt-bt.a i{box-shadow:0 0 0 2px var(--accent-dim)}
.mt-bt.on i{background:var(--accent);transform:scale(1.08)}
.mt-bt.a.on i{background:var(--accent-strong)}
.mt-bt.mute i{background:transparent;box-shadow:inset 0 0 0 2px var(--line)}
.mt-bt b{font-size:11px;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums}
.mt-subs{display:flex;gap:3px;min-height:7px}
.mt-subs u{width:7px;height:7px;border-radius:50%;background:var(--surface-3);text-decoration:none}
.mt-subs u.on{background:var(--accent)}
.mt-lights[data-n="7"] .mt-bt i,.mt-lights[data-n="12"] .mt-bt i{width:24px;height:24px}
.mt-lights[data-n="12"] .mt-bt.g i{width:30px;height:30px}
.mt-lights[data-n="12"]{gap:8px}
.mt-status{font-size:14px;color:var(--ink-2);min-height:21px}
@media (max-width:520px){
  .mt-big{padding:22px 14px}
  .mt-big .bpm{font-size:84px}
  .mt-lights{gap:8px}
}

/* ===== Repertório ===== */
.rp-top{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.rp-stats{display:flex;gap:20px;flex-wrap:wrap}
.rp-stats div{display:grid;gap:0}
.rp-stats b{font-size:24px;font-weight:700;line-height:1.1;font-variant-numeric:tabular-nums}
.rp-stats span{font-size:12px;color:var(--muted)}
.rp-tools{display:flex;gap:10px 14px;flex-wrap:wrap;align-items:center}
.rp-tools input{max-width:340px;flex:1 1 220px}
.rp-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.rp-item{display:grid;grid-template-columns:28px minmax(0,1fr) auto auto;gap:6px 12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:8px 10px 8px 12px}
.rp-n{font-family:var(--f-mono);font-size:13px;color:var(--muted);text-align:right}
.rp-main{display:grid;gap:1px;text-align:left;border:0;background:none;padding:4px 2px;min-width:0;color:var(--ink);border-radius:var(--r-sm)}
.rp-main b{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-main span{font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-main:hover b{color:var(--accent-strong)}
.rp-move{display:flex;gap:4px}
.rp-move .iconbtn[disabled]{opacity:.35;cursor:default}
.pill.rp-st.aprendendo{background:color-mix(in srgb,var(--warn) 16%,transparent);color:var(--warn)}
.pill.rp-st.pronta{background:color-mix(in srgb,var(--good) 16%,transparent);color:var(--good)}
.pill.rp-st.palco{background:var(--accent-soft);color:var(--accent-strong)}
.rp-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.rp-facts>div{background:var(--surface);padding:10px 14px;display:grid;gap:2px;align-content:start}
.rp-facts span{font-size:12px;color:var(--muted)}
.rp-facts b{font-size:16px}
.rp-facts small{font-size:11px;color:var(--muted)}
.rp-stsel select{width:auto;min-width:170px}
.rp-notes{white-space:pre-wrap;background:var(--surface-2);border-radius:var(--r);padding:10px 14px;color:var(--ink-2);font-size:14px}
.rp-train{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center}
.rp-chead{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center}
.rp-chead h3{margin-right:auto}
.rp-trans{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.rp-tokey select{width:auto;min-width:104px}
.rp-font{display:flex;gap:2px}
.rp-chart{margin:0;font-family:var(--f-mono);line-height:1.5;white-space:pre;overflow-x:auto;background:var(--surface-2);border-radius:var(--r);padding:14px 16px;color:var(--ink);tab-size:4}
.rp-ch{color:var(--accent-strong);font-weight:700}
.rp-ch.rp-in{display:inline-block;font-size:.82em;line-height:1.25;padding:0 4px;margin:0 2px;border-radius:4px;background:var(--accent-soft);vertical-align:.4em}
.rp-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.rp-form .wide{grid-column:1/-1}
.rp-form #rpFChart{font-family:var(--f-mono);font-size:13px;line-height:1.45;min-height:220px;white-space:pre;overflow-x:auto}
@media (max-width:600px){
  .rp-item{grid-template-columns:22px minmax(0,1fr) auto;padding:8px 8px 8px 10px}
  .rp-item .rp-st{grid-column:2;grid-row:2;justify-self:start}
  .rp-item .rp-move{grid-column:3;grid-row:1/span 2;flex-direction:column}
  .rp-form{grid-template-columns:minmax(0,1fr)}
  .rp-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rp-facts>div:last-child{grid-column:1/-1}
  .rp-stats{gap:14px}
  .rp-chart{padding:12px}
  .rp-chead h3{order:1}
  .rp-font{order:2}
  .rp-trans{order:3;flex-basis:100%}
}