.cbg-tuner{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;border:1px solid #e6e6e6;border-radius:12px;padding:16px;max-width:980px;background:#fff}
.cbg-tuner__header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.cbg-tuner__title{font-size:18px;font-weight:900}
.cbg-tuner__subtitle{font-size:13px;opacity:.82}
.cbg-tuner__controls{display:flex;gap:8px}
.cbg-btn{border:1px solid #ddd;background:#f7f7f7;padding:8px 12px;border-radius:10px;cursor:pointer;font-weight:800}
.cbg-btn--primary{background:#111;color:#fff;border-color:#111}
.cbg-btn:disabled{opacity:.55;cursor:not-allowed}
.cbg-panel{border-radius:12px;border:1px solid #eee;padding:14px}
.cbg-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media (max-width:860px){.cbg-grid{grid-template-columns:1fr}}
.cbg-direction{font-size:34px;font-weight:1000;letter-spacing:.4px;margin:6px 0 12px}
.cbg-direction--ok{color:#16a34a}
.cbg-meter{position:relative;height:14px;border-radius:999px;margin:10px 0 8px}
.cbg-meter__bar{position:absolute;inset:0;background:linear-gradient(90deg,#ffd6d6,#eaf8ee,#ffd6d6);border-radius:999px;border:1px solid #eee}
.cbg-meter__center{position:absolute;left:50%;top:-7px;width:2px;height:28px;background:rgba(0,0,0,.28);transform:translateX(-50%);border-radius:2px}
.cbg-meter__needle{position:absolute;top:-6px;width:3px;height:26px;background:#111;border-radius:2px;transform:translateX(-50%);left:50%}
.cbg-meter__needle--ok{background:#16a34a}
.cbg-meter__labels{display:flex;justify-content:space-between;font-size:12px;opacity:.72;margin-top:8px}
.cbg-status{font-weight:900;padding:10px 12px;border-radius:10px;background:#f4f4f4;display:inline-block;margin-top:10px}
.cbg-status--ok{background:#eaf8ee}

.cbg-diagram{border:1px solid #f0f0f0;border-radius:12px;padding:12px;background:#fbfbfb}
.cbg-diagram__title{font-weight:900;font-size:13px;margin-bottom:10px;opacity:.9}

.cbg-headstock-wrap{position:relative;max-width:300px;margin:0 auto}
.cbg-headstock-img{width:100%;height:auto;display:block}

.cbg-string-overlay{
  position:absolute;
  top:53.4937%;
  bottom:0.2%;
  width:6px;
  border-radius:999px;
  background:rgba(255,255,255,.22);
  opacity:.6;
  transition:all .15s ease;
  pointer-events:none;
}

.cbg-string--1{left:39.6361%;}
.cbg-string--2{left:46.9146%;}
.cbg-string--3{left:54.193%;}

.cbg-string-overlay.cbg-active{
  background:rgba(255,255,255,.95);
  opacity:1;
  box-shadow:0 0 12px rgba(90,140,255,.55);
  animation:cbgWiggle .22s ease-in-out infinite alternate;
}
.cbg-string-overlay.cbg-active.cbg-in-tune{
  background:rgba(40,200,120,.98);
  box-shadow:0 0 14px rgba(40,200,120,.65);
  animation:cbgPulse .55s ease-in-out infinite;
}

@keyframes cbgWiggle{from{transform:translateX(-.6px)}to{transform:translateX(.6px)}}
@keyframes cbgPulse{0%{transform:scaleX(1)}50%{transform:scaleX(1.15)}100%{transform:scaleX(1)}}