/* =========================================================
   MR Theory Board · Θεωρία 2 · Κεφάλαιο 7
   Special chords · add · sus2/sus4 · 6ης · v0.8.5
   Αρχείο παραγωγής: assets/css/theory2-special-chords.css
   ========================================================= */

.mrtb-app[data-scene="t2-special-chords"]{
  --t2sc-panel-width:360px;
  --t2sc-right-space:384px;
  --t2sc-left-edge:12px;
  --t2sc-staff-top:12px;
  --t2sc-staff-height:322px;
  --t2sc-lines-top:104px;
  --t2sc-lines-height:88px;
  --t2sc-line-gap:22px;
  --t2sc-piano-top:400px;
  --t2sc-piano-height:112px;
  --t2sc-stage-height:650px;
}

/* ---------- Κοινή εργαλειοθήκη ---------- */

.mrtb-app[data-scene="t2-special-chords"] .mrtb-values-section,
.mrtb-app[data-scene="t2-special-chords"] [data-action="add-staff"],
.mrtb-app[data-scene="t2-special-chords"] [data-action="toggle-value-labels"]{
  display:none !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-sidebar{
  grid-template-columns:1fr !important;
  height:auto !important;
  min-height:48px !important;
  max-height:none !important;
  overflow:visible !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-tools-section,
.mrtb-app[data-scene="t2-special-chords"] .mrtb-tools-one-line{
  overflow:visible !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-tools-one-line{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:4px !important;
}

.mrtb-app[data-scene="t2-special-chords"] [data-action="select-multi"].mrtb-t2sc-chord-locked{
  color:#153c28 !important;
  border-color:#73d59a !important;
  background:linear-gradient(180deg,#d8ffd2,#8be4a7) !important;
  cursor:default !important;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.08),0 6px 15px rgba(55,142,91,.16) !important;
}

/* ---------- Board ---------- */

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board{
  position:relative !important;
  overflow:auto !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-scroll-spacer{
  width:100% !important;
  height:var(--t2sc-stage-height) !important;
  min-height:var(--t2sc-stage-height) !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-wrap{
  background:
    radial-gradient(circle at 10% 8%,rgba(255,255,255,.84) 0 42px,transparent 44px),
    radial-gradient(circle at 86% 10%,rgba(255,255,255,.58) 0 52px,transparent 54px),
    linear-gradient(90deg,rgba(255,255,255,.20) 1px,transparent 1px) 0 0/42px 42px,
    linear-gradient(0deg,rgba(255,255,255,.20) 1px,transparent 1px) 0 0/42px 42px,
    linear-gradient(180deg,#9ee6ff 0%,#d8f5ff 56%,#dff3b5 100%) !important;
}

/* ---------- Native πεντάγραμμο ---------- */

.mrtb-app[data-scene="t2-special-chords"] .mrtb-staff{
  left:var(--t2sc-left-edge) !important;
  right:var(--t2sc-right-space) !important;
  top:var(--t2sc-staff-top) !important;
  height:var(--t2sc-staff-height) !important;
  min-height:var(--t2sc-staff-height) !important;
  overflow:visible !important;
  border:3px solid rgba(91,143,221,.24) !important;
  border-radius:28px !important;
  background:rgba(255,255,255,.82) !important;
  box-shadow:0 18px 45px rgba(46,98,128,.13) !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-staff-lines{
  left:112px !important;
  right:28px !important;
  top:var(--t2sc-lines-top) !important;
  height:var(--t2sc-lines-height) !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-line:nth-child(1){top:0 !important;}
.mrtb-app[data-scene="t2-special-chords"] .mrtb-line:nth-child(2){top:var(--t2sc-line-gap) !important;}
.mrtb-app[data-scene="t2-special-chords"] .mrtb-line:nth-child(3){top:calc(var(--t2sc-line-gap) * 2) !important;}
.mrtb-app[data-scene="t2-special-chords"] .mrtb-line:nth-child(4){top:calc(var(--t2sc-line-gap) * 3) !important;}
.mrtb-app[data-scene="t2-special-chords"] .mrtb-line:nth-child(5){top:calc(var(--t2sc-line-gap) * 4) !important;}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-clef{
  left:12px !important;
  top:55px !important;
  width:92px !important;
  font-size:120px !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-time-sig,
.mrtb-app[data-scene="t2-special-chords"] .mrtb-barline,
.mrtb-app[data-scene="t2-special-chords"] .mrtb-staff-label,
.mrtb-app[data-scene="t2-special-chords"] .mrtb-staff-hint{
  display:none !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note{
  display:block !important;
  z-index:34 !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note .mrtb-note-glyph{
  transform:scale(1.34) !important;
  transform-origin:50% 50% !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note .mrtb-note-caption{
  left:86px !important;
  min-width:66px !important;
  box-sizing:border-box !important;
  padding:5px 10px !important;
  border:2px solid rgba(38,48,68,.13) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.96) !important;
  box-shadow:0 7px 18px rgba(35,72,92,.12) !important;
  font-size:11px !important;
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note .mrtb-note-caption b{
  font-size:13px !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note .mrtb-note-value{
  display:none !important;
}

/* ---------- Ρόλοι νοτών ---------- */

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-role-root .mrtb-note-caption{
  border-color:#ef5a62 !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-role-third .mrtb-note-caption{
  border-color:#5275df !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-role-fifth .mrtb-note-caption{
  border-color:#34b97e !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-role-special .mrtb-note-caption{
  border-color:#d665a4 !important;
  box-shadow:0 0 0 4px rgba(214,101,164,.10),0 7px 18px rgba(35,72,92,.12) !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-role-seventh .mrtb-note-caption{
  border-color:#f09a3e !important;
  box-shadow:0 0 0 4px rgba(240,154,62,.11),0 7px 18px rgba(35,72,92,.12) !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-role-warning .mrtb-note-caption{
  border-color:#ef664f !important;
  background:#fff1ed !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-inactive-chord{
  opacity:1 !important;
  filter:none !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-inactive-chord .mrtb-note-caption{
  border-color:rgba(86,103,128,.25) !important;
  box-shadow:none !important;
}

/* ---------- Πιάνο ---------- */

.mrtb-app[data-scene="t2-special-chords"] .mrtb-mini-piano{
  display:block !important;
  left:var(--t2sc-left-edge) !important;
  right:var(--t2sc-right-space) !important;
  top:var(--t2sc-piano-top) !important;
  bottom:auto !important;
  height:var(--t2sc-piano-height) !important;
  min-height:var(--t2sc-piano-height) !important;
  z-index:24 !important;
  border:3px solid rgba(91,143,221,.22) !important;
  border-radius:25px !important;
  background:rgba(255,255,255,.88) !important;
  box-shadow:0 16px 38px rgba(46,98,128,.13) !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  padding:7px 10px 6px !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-piano-label{
  margin:0 0 4px !important;
  font-size:8px !important;
  line-height:1 !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-piano-inner{
  height:82px !important;
  min-height:82px !important;
  max-height:82px !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-key.white{
  height:80px !important;
  min-height:80px !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-key.black{
  height:54px !important;
  min-height:54px !important;
}

/* ---------- Πάνω χειριστήρια ---------- */

.mrtb-t2sc-staff-actions{
  position:absolute;
  z-index:48;
  top:24px;
  left:145px;
  right:calc(var(--t2sc-right-space) + 24px);
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:9px;
  pointer-events:auto;
}

.mrtb-t2sc-staff-heading{
  min-width:0;
  margin-right:auto;
  padding:8px 14px;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(135deg,#283f84,#536fc4);
  box-shadow:0 10px 23px rgba(39,60,128,.22);
}

.mrtb-t2sc-staff-heading span,
.mrtb-t2sc-staff-heading b{
  display:block;
}

.mrtb-t2sc-staff-heading span{
  font-size:8px;
  font-weight:1000;
  letter-spacing:1px;
  text-transform:uppercase;
  opacity:.75;
}

.mrtb-t2sc-staff-heading b{
  overflow:hidden;
  max-width:220px;
  font-size:15px;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.mrtb-t2sc-staff-actions button{
  min-height:40px;
  padding:8px 13px;
  border:0;
  border-radius:14px;
  font-family:inherit;
  font-size:11px;
  font-weight:1000;
  cursor:pointer;
  box-shadow:0 8px 17px rgba(42,72,94,.15),inset 0 -3px 0 rgba(0,0,0,.09);
}

.mrtb-t2sc-staff-actions .play{
  color:#153c28;
  background:linear-gradient(180deg,#d0ffc5,#72df91);
}

.mrtb-t2sc-staff-actions .clear{
  color:#33415a;
  background:linear-gradient(180deg,#fff,#e8edf5);
}

/* ---------- Μεγάλο όνομα κάτω από το πεντάγραμμο ---------- */

.mrtb-t2sc-staff-result{
  position:absolute;
  z-index:46;
  left:38px;
  right:calc(var(--t2sc-right-space) + 26px);
  top:328px;
  min-height:60px;
  box-sizing:border-box;
  padding:7px 17px 8px;
  border:3px solid rgba(73,101,160,.14);
  border-radius:20px;
  color:#263044;
  background:rgba(255,255,255,.96);
  box-shadow:0 12px 28px rgba(40,76,105,.13);
  text-align:center;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.mrtb-t2sc-staff-result small,
.mrtb-t2sc-staff-result strong,
.mrtb-t2sc-staff-result span{
  display:block;
}

.mrtb-t2sc-staff-result small{
  margin-bottom:2px;
  color:#728099;
  font-size:8px;
  font-weight:1000;
  letter-spacing:1.1px;
  text-transform:uppercase;
}

.mrtb-t2sc-staff-result strong{
  margin-bottom:3px;
  color:#293b73;
  font-size:27px;
  line-height:1;
  letter-spacing:-.5px;
}

.mrtb-t2sc-staff-result span{
  overflow:hidden;
  color:#647188;
  font-size:10px;
  font-weight:850;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.mrtb-t2sc-staff-result.correct{
  border-color:rgba(48,169,119,.42);
  background:linear-gradient(180deg,#f3fff9,#e5faef);
}

.mrtb-t2sc-staff-result.correct strong{color:#197852;}

.mrtb-t2sc-staff-result.warning{
  border-color:rgba(236,106,79,.43);
  background:linear-gradient(180deg,#fff8f4,#ffebe4);
}

.mrtb-t2sc-staff-result.warning strong{color:#bc4f39;}

/* ---------- Δεξί panel ---------- */

.mrtb-t2-special-chords-scene{
  position:absolute;
  z-index:42;
  top:12px;
  right:12px;
  width:var(--t2sc-panel-width);
  height:620px;
  box-sizing:border-box;
  overflow:auto;
  padding:16px;
  border:3px solid rgba(91,143,221,.22);
  border-radius:28px;
  color:#263044;
  background:rgba(255,255,255,.96);
  box-shadow:0 20px 48px rgba(38,68,112,.16);
  backdrop-filter:blur(13px);
  -webkit-backdrop-filter:blur(13px);
}

.mrtb-t2sc-tabs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  margin-bottom:13px;
}

.mrtb-t2sc-tabs button{
  position:relative;
  min-width:0;
  min-height:62px;
  padding:8px 6px 7px 28px;
  border:2px solid #e2e9f4;
  border-radius:17px;
  color:#536178;
  background:linear-gradient(180deg,#fff,#f0f5ff);
  font-family:inherit;
  text-align:left;
  cursor:pointer;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}

.mrtb-t2sc-tabs button:hover{
  transform:translateY(-1px);
  border-color:#9eb4e7;
}

.mrtb-t2sc-tabs button > span{
  position:absolute;
  top:10px;
  left:8px;
  display:grid;
  width:18px;
  height:18px;
  place-items:center;
  border-radius:50%;
  color:#fff;
  background:#8b99b3;
  font-size:8px;
  font-weight:1000;
}

.mrtb-t2sc-tabs button b,
.mrtb-t2sc-tabs button small{
  display:block;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.mrtb-t2sc-tabs button b{
  margin-bottom:3px;
  color:#31405c;
  font-size:13px;
}

.mrtb-t2sc-tabs button small{
  font-size:8px;
  font-weight:850;
}

.mrtb-t2sc-tabs button.active{
  border-color:#5775c8;
  background:linear-gradient(145deg,#304a91,#627ed0);
  box-shadow:0 10px 22px rgba(56,78,151,.22);
}

.mrtb-t2sc-tabs button.active > span{
  color:#304a91;
  background:#fff;
}

.mrtb-t2sc-tabs button.active b,
.mrtb-t2sc-tabs button.active small{
  color:#fff;
}

.mrtb-t2sc-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) 132px;
  gap:10px;
  align-items:start;
}

.mrtb-t2sc-head > div:first-child > span{
  display:block;
  margin-bottom:5px;
  color:#6b7890;
  font-size:8px;
  font-weight:1000;
  letter-spacing:1.1px;
  text-transform:uppercase;
}

.mrtb-t2sc-head h2{
  margin:0 0 5px;
  font-size:23px;
  line-height:1.02;
  letter-spacing:-.65px;
}

.mrtb-t2sc-head p{
  margin:0;
  color:#627087;
  font-size:10px;
  line-height:1.35;
  font-weight:800;
}

.mrtb-t2sc-live{
  min-height:100px;
  box-sizing:border-box;
  padding:12px;
  border-radius:20px;
  color:#fff;
  background:linear-gradient(145deg,#324b8c,#657fd0);
  box-shadow:0 13px 28px rgba(42,64,122,.24);
}

.mrtb-t2sc-live small,
.mrtb-t2sc-live strong,
.mrtb-t2sc-live span{
  display:block;
}

.mrtb-t2sc-live small{
  margin-bottom:8px;
  font-size:7px;
  font-weight:1000;
  letter-spacing:1.1px;
  text-transform:uppercase;
  opacity:.76;
}

.mrtb-t2sc-live strong{
  overflow:hidden;
  margin-bottom:7px;
  font-size:23px;
  line-height:1;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.mrtb-t2sc-live span{
  font-size:8px;
  line-height:1.25;
  font-weight:850;
}

.mrtb-t2sc-live.correct{
  background:linear-gradient(145deg,#22675b,#37af83);
}

.mrtb-t2sc-live.warning{
  background:linear-gradient(145deg,#9f4939,#e16b50);
}

.mrtb-t2sc-live.building{
  background:linear-gradient(145deg,#805b24,#d49b3c);
}

.mrtb-t2sc-formula-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:12px;
  padding:10px 12px;
  border:2px solid #e0e8f4;
  border-radius:17px;
  background:linear-gradient(180deg,#f9fbff,#eef4ff);
}

.mrtb-t2sc-formula-card span{
  color:#6e7b93;
  font-size:8px;
  font-weight:1000;
  text-transform:uppercase;
}

.mrtb-t2sc-formula-card strong{
  color:#304477;
  font-size:14px;
  text-align:right;
}

.mrtb-t2sc-degree-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:5px;
  margin-top:9px;
}

.mrtb-t2sc-degree-grid article{
  min-width:0;
  min-height:54px;
  box-sizing:border-box;
  padding:8px 5px;
  border:2px solid #e4eaf3;
  border-radius:14px;
  background:#f8faff;
  text-align:center;
}

.mrtb-t2sc-degree-grid article span,
.mrtb-t2sc-degree-grid article strong{
  display:block;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.mrtb-t2sc-degree-grid article span{
  margin-bottom:4px;
  color:#7b879b;
  font-size:7px;
  font-weight:950;
}

.mrtb-t2sc-degree-grid article strong{
  color:#8e9aae;
  font-size:10px;
}

.mrtb-t2sc-degree-grid article.ok{
  border-color:#9ed9bf;
  background:#ecfbf4;
}

.mrtb-t2sc-degree-grid article.ok strong{color:#237b58;}

.mrtb-t2sc-degree-grid article.warning{
  border-color:#f2b5a8;
  background:#fff0eb;
}

.mrtb-t2sc-degree-grid article.warning strong{color:#bd4f39;}

.mrtb-t2sc-explanation{
  min-height:62px;
  box-sizing:border-box;
  margin-top:9px;
  padding:11px 12px;
  border-left:5px solid #5674c8;
  border-radius:15px;
  color:#4b5970;
  background:#f4f7fc;
  font-size:9px;
  line-height:1.42;
  font-weight:800;
}

.mrtb-t2sc-rule{
  display:grid;
  grid-template-columns:58px minmax(0,1fr);
  gap:8px;
  align-items:start;
  margin-top:8px;
  padding:9px 10px;
  border:2px dashed #cbd7e9;
  border-radius:15px;
  background:#fffdf7;
}

.mrtb-t2sc-rule b{
  color:#b26e1e;
  font-size:9px;
}

.mrtb-t2sc-rule span{
  color:#6b6255;
  font-size:8px;
  line-height:1.35;
  font-weight:800;
}

.mrtb-t2sc-examples-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:8px;
  margin-top:11px;
}

.mrtb-t2sc-examples-head b{
  color:#34435e;
  font-size:10px;
}

.mrtb-t2sc-examples-head span{
  color:#8b96a8;
  font-size:7px;
  font-weight:800;
  text-align:right;
}

.mrtb-t2sc-presets{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
  margin-top:7px;
}

.mrtb-t2sc-presets button{
  min-width:0;
  min-height:73px;
  box-sizing:border-box;
  padding:9px;
  border:2px solid #e0e7f2;
  border-radius:16px;
  color:#33415b;
  background:linear-gradient(180deg,#fff,#f3f7fd);
  font-family:inherit;
  text-align:left;
  cursor:pointer;
  transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease;
}

.mrtb-t2sc-presets button:hover{
  transform:translateY(-1px);
  border-color:#8fa7df;
  box-shadow:0 9px 18px rgba(44,74,110,.10);
}

.mrtb-t2sc-presets strong,
.mrtb-t2sc-presets span,
.mrtb-t2sc-presets small{
  display:block;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.mrtb-t2sc-presets strong{
  margin-bottom:3px;
  color:#29427f;
  font-size:13px;
}

.mrtb-t2sc-presets span{
  margin-bottom:4px;
  color:#9f4e80;
  font-size:9px;
  font-weight:1000;
}

.mrtb-t2sc-presets small{
  color:#7c8799;
  font-size:7px;
  font-weight:800;
}

/* ---------- Responsive ---------- */

@media (max-width:1080px){
  .mrtb-app[data-scene="t2-special-chords"]{
    --t2sc-right-space:18px;
    --t2sc-stage-height:1240px;
  }

  .mrtb-app[data-scene="t2-special-chords"] .mrtb-staff,
  .mrtb-app[data-scene="t2-special-chords"] .mrtb-mini-piano{
    right:18px !important;
  }

  .mrtb-t2sc-staff-actions,
  .mrtb-t2sc-staff-result{
    right:32px !important;
  }

  .mrtb-t2-special-chords-scene{
    top:610px;
    left:12px;
    right:12px;
    width:auto;
    height:520px;
  }
}

@media (max-width:700px){
  .mrtb-app[data-scene="t2-special-chords"]{
    --t2sc-staff-height:322px;
    --t2sc-piano-top:400px;
    --t2sc-stage-height:1320px;
  }

  .mrtb-t2sc-staff-actions{
    left:102px;
    flex-wrap:wrap;
  }

  .mrtb-t2sc-staff-heading{
    width:100%;
  }

  .mrtb-t2sc-staff-result{
    top:328px;
    left:20px;
  }

  .mrtb-t2-special-chords-scene{
    top:600px;
    height:640px;
  }

  .mrtb-t2sc-head{
    grid-template-columns:1fr;
  }

  .mrtb-t2sc-degree-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}


/* =========================================================
   v0.8.6 · Αναλογία πενταγράμμου / νοτών + κεντραρισμένο πιάνο
   ========================================================= */

.mrtb-app[data-scene="t2-special-chords"]{
  --t2sc-staff-height:390px;
  --t2sc-lines-top:118px;
  --t2sc-lines-height:128px;
  --t2sc-line-gap:32px;
  --t2sc-piano-top:474px;
  --t2sc-piano-height:126px;
  --t2sc-stage-height:680px;
}

/* Μεγαλύτερο και πιο ευανάγνωστο πεντάγραμμο. */
.mrtb-app[data-scene="t2-special-chords"] .mrtb-staff{
  height:var(--t2sc-staff-height) !important;
  min-height:var(--t2sc-staff-height) !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-staff-lines{
  left:126px !important;
  right:42px !important;
  top:var(--t2sc-lines-top) !important;
  height:var(--t2sc-lines-height) !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-clef{
  left:18px !important;
  top:62px !important;
  width:104px !important;
  font-size:148px !important;
}

/* Οι νότες δεν υπερκαλύπτουν πλέον τις γραμμές. */
.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note .mrtb-note-glyph{
  transform:scale(1.16) !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note .mrtb-note-caption{
  left:80px !important;
  min-width:62px !important;
  padding:4px 9px !important;
}

/* Το αποτέλεσμα ακολουθεί το νέο ύψος του πενταγράμμου. */
.mrtb-app[data-scene="t2-special-chords"] .mrtb-t2sc-staff-result{
  top:398px !important;
}

/* Πιάνο ακριβώς στο κέντρο του διαθέσιμου αριστερού χώρου. */
.mrtb-app[data-scene="t2-special-chords"] .mrtb-mini-piano{
  left:calc((100% - var(--t2sc-right-space) + var(--t2sc-left-edge)) / 2) !important;
  right:auto !important;
  width:min(760px, calc(100% - var(--t2sc-right-space) - 58px)) !important;
  max-width:760px !important;
  transform:translateX(-50%) !important;
  top:var(--t2sc-piano-top) !important;
  height:var(--t2sc-piano-height) !important;
  min-height:var(--t2sc-piano-height) !important;
  padding:8px 12px 7px !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-piano-label{
  margin:0 0 6px !important;
  text-align:center !important;
  font-size:10px !important;
  line-height:1.1 !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-piano-inner{
  width:100% !important;
  max-width:720px !important;
  height:92px !important;
  min-height:92px !important;
  max-height:92px !important;
  margin:0 auto !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-key.white{
  height:90px !important;
  min-height:90px !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-key.black{
  height:61px !important;
  min-height:61px !important;
}

@media (max-width:1080px){
  .mrtb-app[data-scene="t2-special-chords"]{
    --t2sc-stage-height:1320px;
  }

  .mrtb-app[data-scene="t2-special-chords"] .mrtb-mini-piano{
    left:50% !important;
    right:auto !important;
    width:calc(100% - 40px) !important;
    max-width:760px !important;
  }

  .mrtb-t2-special-chords-scene{
    top:640px !important;
  }
}

@media (max-width:700px){
  .mrtb-app[data-scene="t2-special-chords"]{
    --t2sc-staff-height:370px;
    --t2sc-lines-top:120px;
    --t2sc-lines-height:112px;
    --t2sc-line-gap:28px;
    --t2sc-piano-top:458px;
    --t2sc-stage-height:1380px;
  }

  .mrtb-app[data-scene="t2-special-chords"] .mrtb-staff-lines{
    left:92px !important;
    right:20px !important;
  }

  .mrtb-app[data-scene="t2-special-chords"] .mrtb-clef{
    left:5px !important;
    top:75px !important;
    width:82px !important;
    font-size:120px !important;
  }

  .mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note .mrtb-note-glyph{
    transform:scale(1.06) !important;
  }

  .mrtb-app[data-scene="t2-special-chords"] .mrtb-t2sc-staff-result{
    top:380px !important;
  }

  .mrtb-app[data-scene="t2-special-chords"] .mrtb-mini-piano{
    width:calc(100% - 24px) !important;
  }

  .mrtb-t2-special-chords-scene{
    top:620px !important;
  }
}

/* =========================================================
   v0.8.7 · Αλλοιώσεις εργαλειοθήκης + χρώμα add/tensions
   ========================================================= */

.mrtb-app[data-scene="t2-special-chords"] .mrtb-t2sc-accidental-tools{
  display:inline-flex !important;
  align-items:center !important;
  gap:4px !important;
  min-height:36px;
  padding:3px 5px 3px 8px;
  border:1px solid rgba(76,107,153,.16);
  border-radius:12px;
  background:rgba(255,255,255,.72);
  box-shadow:0 5px 13px rgba(35,72,92,.10);
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-t2sc-accidental-tools > span{
  margin-right:2px;
  color:#52617b;
  font-size:9px;
  font-weight:1000;
  letter-spacing:.35px;
  text-transform:uppercase;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-t2sc-accidental-tools button{
  display:grid;
  place-items:center;
  width:32px;
  min-width:32px;
  height:30px;
  min-height:30px;
  padding:0 !important;
  border:1px solid rgba(66,90,131,.16) !important;
  border-radius:9px !important;
  color:#23314d !important;
  background:linear-gradient(180deg,#fff,#edf3fb) !important;
  font-family:"Arial Unicode MS","Noto Music",serif !important;
  font-size:19px !important;
  font-weight:900 !important;
  line-height:1 !important;
  cursor:pointer !important;
  box-shadow:inset 0 -2px 0 rgba(25,46,78,.08),0 3px 8px rgba(35,72,92,.08) !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-t2sc-accidental-tools button:hover{
  transform:translateY(-1px);
  border-color:#6484db !important;
  background:linear-gradient(180deg,#fff,#dde8ff) !important;
}

/* Οι νότες add/tension ξεχωρίζουν και πάνω στη νότα, όχι μόνο στην ετικέτα. */
.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-role-special .mrtb-note-head{
  background:linear-gradient(135deg,#c83b91,#ff76bf) !important;
  border-color:#8f1d67 !important;
  box-shadow:0 0 0 4px rgba(214,72,157,.15),0 5px 12px rgba(151,30,103,.24) !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-role-special .mrtb-stem,
.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-role-special .mrtb-flag{
  background:#9a286f !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-role-special .mrtb-note-caption{
  color:#7a1957 !important;
  border-color:#d43f98 !important;
  background:#fff0fa !important;
  box-shadow:0 0 0 4px rgba(214,63,152,.12),0 7px 18px rgba(105,27,79,.13) !important;
}

.mrtb-app[data-scene="t2-special-chords"] .mrtb-board-note.mrtb-t2sc-role-special .mrtb-note-caption b{
  color:#8c1e65 !important;
}

@media (max-width:1100px){
  .mrtb-app[data-scene="t2-special-chords"] .mrtb-t2sc-accidental-tools > span{
    display:none;
  }

  .mrtb-app[data-scene="t2-special-chords"] .mrtb-t2sc-accidental-tools{
    padding-left:4px;
  }
}

/* =========================================================
   Multiplayer game · Special chords · add · sus · 6ης · v0.9.0
   ========================================================= */

.mrtb-app[data-scene="t2-special-chords"].mrtb-t2sc-game-active .mrtb-staff,
.mrtb-app[data-scene="t2-special-chords"].mrtb-t2sc-game-active .mrtb-board-note,
.mrtb-app[data-scene="t2-special-chords"].mrtb-t2sc-game-active .mrtb-mini-piano,
.mrtb-app[data-scene="t2-special-chords"].mrtb-t2sc-game-active .mrtb-t2-special-chords-scene,
.mrtb-app[data-scene="t2-special-chords"].mrtb-t2sc-game-active .mrtb-t2sc-staff-actions,
.mrtb-app[data-scene="t2-special-chords"].mrtb-t2sc-game-active .mrtb-t2sc-staff-result,
.mrtb-app[data-scene="t2-special-chords"].mrtb-t2sc-game-active .mrtb-draw-canvas{
  display:none !important;
}

.mrtb-app[data-scene="t2-special-chords"].mrtb-t2sc-game-active .mrtb-board{
  overflow:hidden !important;
}

.mrtb-t2sc-game-shell{
  position:absolute;
  inset:0;
  z-index:120;
  box-sizing:border-box;
  min-width:0;
  min-height:0;
  overflow:auto;
  color:#263044;
  background:
    radial-gradient(circle at 9% 8%,rgba(255,255,255,.90) 0 54px,transparent 56px),
    radial-gradient(circle at 91% 10%,rgba(255,255,255,.62) 0 68px,transparent 70px),
    linear-gradient(90deg,rgba(255,255,255,.20) 1px,transparent 1px) 0 0/40px 40px,
    linear-gradient(0deg,rgba(255,255,255,.20) 1px,transparent 1px) 0 0/40px 40px,
    linear-gradient(180deg,#a8e8ff 0%,#dff7ff 58%,#e5f6c5 100%);
}

.mrtb-scg-setup{
  width:min(1120px,calc(100% - 30px));
  min-height:calc(100% - 28px);
  margin:14px auto;
  padding:22px;
  box-sizing:border-box;
  border:3px solid rgba(84,129,203,.24);
  border-radius:28px;
  background:rgba(255,255,255,.88);
  box-shadow:0 22px 55px rgba(43,85,116,.18);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.mrtb-scg-setup-head,
.mrtb-scg-hud{
  display:flex;
  align-items:center;
  gap:12px;
}

.mrtb-scg-setup-head{
  justify-content:space-between;
  margin-bottom:18px;
}

.mrtb-scg-setup-head span{
  color:#5570ac;
  font-size:11px;
  font-weight:1000;
  letter-spacing:1.5px;
  text-transform:uppercase;
}

.mrtb-scg-setup-head h2{
  margin:3px 0 4px;
  color:#25355b;
  font-size:clamp(24px,3vw,38px);
  line-height:1;
}

.mrtb-scg-setup-head p{
  margin:0;
  color:#68758c;
  font-weight:800;
}

.mrtb-scg-setup-head > button,
.mrtb-scg-hud > button:last-child{
  width:42px;
  height:42px;
  border:0;
  border-radius:14px;
  color:#fff;
  background:linear-gradient(180deg,#ff7b76,#dc3e4a);
  font-size:25px;
  font-weight:1000;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(194,52,63,.24);
}

.mrtb-scg-setup-block{
  margin-top:15px;
  padding:15px;
  border:2px solid rgba(90,126,180,.15);
  border-radius:20px;
  background:rgba(244,249,255,.82);
}

.mrtb-scg-setup-block > b{
  display:block;
  margin-bottom:10px;
  color:#52617b;
  font-size:12px;
  font-weight:1000;
  letter-spacing:.7px;
  text-transform:uppercase;
}

.mrtb-scg-counts,
.mrtb-scg-rounds{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.mrtb-scg-counts button,
.mrtb-scg-rounds button{
  width:45px;
  height:40px;
  border:2px solid #d8e3f2;
  border-radius:12px;
  color:#31415f;
  background:#fff;
  font-weight:1000;
  cursor:pointer;
}

.mrtb-scg-counts button.active,
.mrtb-scg-rounds button.active{
  color:#fff;
  border-color:#5275df;
  background:linear-gradient(180deg,#6284ea,#4565c5);
  box-shadow:0 7px 15px rgba(71,99,190,.22);
}

.mrtb-scg-name-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}

.mrtb-scg-name-grid label{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
  padding:6px 8px;
  border:1px solid #dce6f2;
  border-radius:13px;
  background:#fff;
}

.mrtb-scg-name-grid label span{
  display:grid;
  place-items:center;
  flex:0 0 28px;
  height:28px;
  border-radius:9px;
  color:#fff;
  background:#6b7fbb;
  font-weight:1000;
}

.mrtb-scg-name-grid input{
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  color:#263044;
  background:transparent;
  font:900 14px/1.2 inherit;
}

.mrtb-scg-setup-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 170px;
  gap:12px;
}

.mrtb-scg-levels{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}

.mrtb-scg-levels button{
  min-height:72px;
  padding:9px;
  border:2px solid #dbe5f2;
  border-radius:15px;
  color:#31415f;
  background:#fff;
  text-align:left;
  cursor:pointer;
}

.mrtb-scg-levels button strong,
.mrtb-scg-levels button small{
  display:block;
}

.mrtb-scg-levels button strong{
  margin-bottom:4px;
  font-size:14px;
  font-weight:1000;
}

.mrtb-scg-levels button small{
  color:#738098;
  font-size:10px;
  font-weight:800;
}

.mrtb-scg-levels button.active{
  color:#fff;
  border-color:#4d6bd0;
  background:linear-gradient(145deg,#5679dc,#405ab2);
  box-shadow:0 10px 20px rgba(65,87,171,.22);
}

.mrtb-scg-levels button.active small{
  color:#eaf0ff;
}

.mrtb-scg-start{
  display:block;
  width:min(420px,100%);
  min-height:52px;
  margin:18px auto 0;
  border:0;
  border-radius:17px;
  color:#143c28;
  background:linear-gradient(180deg,#c6ffb8,#69dc8d);
  font-size:17px;
  font-weight:1000;
  cursor:pointer;
  box-shadow:inset 0 -4px 0 rgba(24,111,61,.13),0 12px 25px rgba(49,151,87,.22);
}

.mrtb-scg-play{
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  box-sizing:border-box;
  width:100%;
  height:100%;
  min-height:620px;
  padding:10px;
  gap:9px;
}

.mrtb-scg-hud{
  min-height:50px;
  padding:7px 10px;
  border:2px solid rgba(79,122,190,.19);
  border-radius:17px;
  background:rgba(255,255,255,.90);
  box-shadow:0 10px 22px rgba(48,87,119,.13);
}

.mrtb-scg-hud > div{
  min-width:0;
  margin-right:auto;
}

.mrtb-scg-hud strong,
.mrtb-scg-hud span{
  display:block;
}

.mrtb-scg-hud strong{
  color:#2d3f69;
  font-size:16px;
  font-weight:1000;
}

.mrtb-scg-hud span{
  overflow:hidden;
  color:#718097;
  font-size:10px;
  font-weight:800;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mrtb-scg-hud > b{
  color:#40588c;
  white-space:nowrap;
}

.mrtb-scg-hud > button:not(:last-child){
  min-height:35px;
  padding:6px 12px;
  border:0;
  border-radius:11px;
  color:#173d28;
  background:linear-gradient(180deg,#caffbc,#7be29a);
  font-weight:1000;
  cursor:pointer;
}

.mrtb-scg-grid{
  display:grid;
  min-height:0;
  gap:8px;
}

.mrtb-scg-grid.players-1{grid-template-columns:1fr;}
.mrtb-scg-grid.players-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.mrtb-scg-grid.players-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.mrtb-scg-grid.players-4{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));}
.mrtb-scg-grid.players-5,
.mrtb-scg-grid.players-6{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));}
.mrtb-scg-grid.players-7,
.mrtb-scg-grid.players-8,
.mrtb-scg-grid.players-9{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));}

.mrtb-scg-player{
  position:relative;
  display:grid;
  grid-template-rows:auto minmax(72px,1fr) auto auto auto auto;
  min-width:0;
  min-height:0;
  overflow:hidden;
  padding:8px;
  box-sizing:border-box;
  border:2px solid rgba(76,111,170,.20);
  border-radius:18px;
  background:rgba(255,255,255,.93);
  box-shadow:0 12px 25px rgba(45,81,111,.13);
}

.mrtb-scg-player.locked{
  border-color:#81b7da;
  background:rgba(240,249,255,.96);
}

.mrtb-scg-player > header{
  display:grid;
  grid-template-columns:minmax(0,1fr) 34px 34px;
  align-items:center;
  gap:5px;
}

.mrtb-scg-player > header small,
.mrtb-scg-player > header strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mrtb-scg-player > header small{
  color:#7b879a;
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
}

.mrtb-scg-player > header strong{
  color:#2c3d62;
  font-size:14px;
  font-weight:1000;
}

.mrtb-scg-player > header button,
.mrtb-scg-player > header > b{
  display:grid;
  place-items:center;
  width:34px;
  height:31px;
  border:0;
  border-radius:10px;
  font-weight:1000;
}

.mrtb-scg-player > header button{
  background:#d8f8df;
  cursor:pointer;
}

.mrtb-scg-player > header > b{
  color:#fff;
  background:#516dbe;
}

.mrtb-scg-staff-wrap{
  display:grid;
  place-items:center;
  min-height:0;
  overflow:visible;
}

.mrtb-scg-staff{
  display:block;
  width:100%;
  height:100%;
  max-height:160px;
  overflow:visible;
}

.mrtb-scg-lines line,
.mrtb-scg-ledger{
  stroke:#263044;
  stroke-width:2.3;
}

.mrtb-scg-clef{
  fill:#263044;
  font-family:"Noto Music","Arial Unicode MS",serif;
  font-size:78px;
}

.mrtb-scg-accidental{
  fill:#263044;
  font-family:"Noto Music","Arial Unicode MS",serif;
  font-size:25px;
  font-weight:900;
}

.mrtb-scg-live-answer{
  min-height:28px;
  margin:2px 0 5px;
  padding:4px 8px;
  box-sizing:border-box;
  border:2px solid #dce5f2;
  border-radius:11px;
  color:#7b8797;
  background:#f4f7fb;
  text-align:center;
  font-size:16px;
  font-weight:1000;
}

.mrtb-scg-live-answer.complete{
  color:#304f9b;
  border-color:#8eb0ef;
  background:#edf3ff;
}

.mrtb-scg-answer-block{
  display:grid;
  grid-template-columns:40px minmax(0,1fr);
  align-items:center;
  gap:4px;
  margin-top:3px;
}

.mrtb-scg-answer-block > span{
  color:#7b8799;
  font-size:8px;
  font-weight:1000;
  text-transform:uppercase;
}

.mrtb-scg-answer-block > div{
  display:flex;
  flex-wrap:wrap;
  gap:3px;
}

.mrtb-scg-answer-block button{
  min-height:25px;
  padding:3px 7px;
  border:1px solid #d5dfed;
  border-radius:8px;
  color:#33425e;
  background:#fff;
  font-size:10px;
  font-weight:1000;
  cursor:pointer;
}

.mrtb-scg-answer-block button.active{
  color:#fff;
  border-color:#4f6cca;
  background:#5876d4;
}

.mrtb-scg-answer-block button:disabled{
  cursor:default;
  opacity:.72;
}

.mrtb-scg-status{
  min-height:20px;
  margin-top:4px;
  color:#718099;
  font-size:9px;
  font-weight:800;
  text-align:center;
}

.mrtb-scg-results{
  display:grid;
  place-items:center;
  width:100%;
  min-height:100%;
  padding:20px;
  box-sizing:border-box;
}

.mrtb-scg-results > article{
  width:min(680px,100%);
  padding:28px;
  box-sizing:border-box;
  border:3px solid rgba(79,119,189,.22);
  border-radius:28px;
  background:rgba(255,255,255,.94);
  box-shadow:0 24px 60px rgba(42,78,109,.20);
  text-align:center;
}

.mrtb-scg-trophy{
  font-size:66px;
}

.mrtb-scg-results h2{
  margin:4px 0;
  color:#2b3e6a;
  font-size:30px;
}

.mrtb-scg-results p{
  margin:0 0 15px;
  color:#728097;
  font-weight:800;
}

.mrtb-scg-ranking{
  display:grid;
  gap:6px;
}

.mrtb-scg-ranking > div{
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 70px;
  align-items:center;
  gap:7px;
  padding:8px 10px;
  border:1px solid #dce5f0;
  border-radius:12px;
  background:#f7faff;
  text-align:left;
}

.mrtb-scg-ranking > div.winner{
  border-color:#e5c65c;
  background:#fff9d8;
}

.mrtb-scg-ranking b{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:9px;
  color:#fff;
  background:#6279b8;
}

.mrtb-scg-ranking span{
  overflow:hidden;
  font-weight:1000;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mrtb-scg-ranking strong{
  color:#38539a;
  text-align:right;
}

.mrtb-scg-result-actions{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:17px;
}

.mrtb-scg-result-actions button{
  min-height:40px;
  padding:7px 15px;
  border:0;
  border-radius:12px;
  color:#263044;
  background:#e7eef8;
  font-weight:1000;
  cursor:pointer;
}

.mrtb-scg-result-actions button:first-child{
  color:#173c28;
  background:#9becad;
}

/* 1–3 παίκτες: μεγαλύτερο πεντάγραμμο και επιλογές. */
.mrtb-scg-grid.players-1 .mrtb-scg-player,
.mrtb-scg-grid.players-2 .mrtb-scg-player,
.mrtb-scg-grid.players-3 .mrtb-scg-player{
  padding:12px;
}

.mrtb-scg-grid.players-1 .mrtb-scg-staff,
.mrtb-scg-grid.players-2 .mrtb-scg-staff{
  max-height:245px;
}

.mrtb-scg-grid.players-1 .mrtb-scg-answer-block button,
.mrtb-scg-grid.players-2 .mrtb-scg-answer-block button{
  min-height:34px;
  padding:5px 11px;
  font-size:13px;
}

.mrtb-scg-grid.players-1 .mrtb-scg-live-answer,
.mrtb-scg-grid.players-2 .mrtb-scg-live-answer{
  min-height:36px;
  font-size:21px;
}

/* 7–9 παίκτες: όλα συμπαγή ώστε να φαίνονται ταυτόχρονα. */
.mrtb-scg-grid.players-7 .mrtb-scg-player,
.mrtb-scg-grid.players-8 .mrtb-scg-player,
.mrtb-scg-grid.players-9 .mrtb-scg-player{
  grid-template-rows:auto minmax(48px,1fr) auto auto auto auto;
  padding:5px;
  border-radius:13px;
}

.mrtb-scg-grid.players-7 .mrtb-scg-staff,
.mrtb-scg-grid.players-8 .mrtb-scg-staff,
.mrtb-scg-grid.players-9 .mrtb-scg-staff{
  max-height:88px;
}

.mrtb-scg-grid.players-7 .mrtb-scg-player > header strong,
.mrtb-scg-grid.players-8 .mrtb-scg-player > header strong,
.mrtb-scg-grid.players-9 .mrtb-scg-player > header strong{
  font-size:10px;
}

.mrtb-scg-grid.players-7 .mrtb-scg-player > header button,
.mrtb-scg-grid.players-7 .mrtb-scg-player > header > b,
.mrtb-scg-grid.players-8 .mrtb-scg-player > header button,
.mrtb-scg-grid.players-8 .mrtb-scg-player > header > b,
.mrtb-scg-grid.players-9 .mrtb-scg-player > header button,
.mrtb-scg-grid.players-9 .mrtb-scg-player > header > b{
  width:26px;
  height:24px;
  font-size:10px;
}

.mrtb-scg-grid.players-7 .mrtb-scg-live-answer,
.mrtb-scg-grid.players-8 .mrtb-scg-live-answer,
.mrtb-scg-grid.players-9 .mrtb-scg-live-answer{
  min-height:21px;
  margin:0 0 2px;
  padding:2px 4px;
  font-size:11px;
}

.mrtb-scg-grid.players-7 .mrtb-scg-answer-block,
.mrtb-scg-grid.players-8 .mrtb-scg-answer-block,
.mrtb-scg-grid.players-9 .mrtb-scg-answer-block{
  grid-template-columns:28px minmax(0,1fr);
  gap:2px;
  margin-top:1px;
}

.mrtb-scg-grid.players-7 .mrtb-scg-answer-block button,
.mrtb-scg-grid.players-8 .mrtb-scg-answer-block button,
.mrtb-scg-grid.players-9 .mrtb-scg-answer-block button{
  min-height:19px;
  padding:1px 4px;
  border-radius:6px;
  font-size:7px;
}

.mrtb-scg-grid.players-7 .mrtb-scg-status,
.mrtb-scg-grid.players-8 .mrtb-scg-status,
.mrtb-scg-grid.players-9 .mrtb-scg-status{
  min-height:12px;
  margin-top:1px;
  font-size:6.5px;
}

@media (max-width:980px){
  .mrtb-scg-name-grid,
  .mrtb-scg-levels{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .mrtb-scg-setup-row{
    grid-template-columns:1fr;
  }

  .mrtb-scg-grid.players-3,
  .mrtb-scg-grid.players-5,
  .mrtb-scg-grid.players-6,
  .mrtb-scg-grid.players-7,
  .mrtb-scg-grid.players-8,
  .mrtb-scg-grid.players-9{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:none;
  }

  .mrtb-scg-play{
    height:auto;
    min-height:100%;
  }
}

@media (max-width:620px){
  .mrtb-scg-setup{
    width:calc(100% - 16px);
    margin:8px;
    padding:13px;
    border-radius:20px;
  }

  .mrtb-scg-name-grid,
  .mrtb-scg-levels,
  .mrtb-scg-grid,
  .mrtb-scg-grid.players-2,
  .mrtb-scg-grid.players-3,
  .mrtb-scg-grid.players-4,
  .mrtb-scg-grid.players-5,
  .mrtb-scg-grid.players-6,
  .mrtb-scg-grid.players-7,
  .mrtb-scg-grid.players-8,
  .mrtb-scg-grid.players-9{
    grid-template-columns:1fr;
    grid-template-rows:none;
  }

  .mrtb-scg-hud span,
  .mrtb-scg-hud > button:not(:last-child){
    display:none;
  }

  .mrtb-scg-player{
    min-height:330px;
  }
}


/* =========================================================
   Special Chords Game v0.9.1 · Χτίσιμο συμβολισμού
   Ρίζα → οικογένεια → ποιότητα → βάση → add/sus/6
   ========================================================= */

.mrtb-scg-play{
  grid-template-rows:auto auto minmax(0,1fr);
}

.mrtb-scg-builder-order{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:6px;
  min-height:36px;
  padding:5px 10px;
  box-sizing:border-box;
  border:2px solid rgba(82,117,181,.16);
  border-radius:14px;
  color:#52617c;
  background:rgba(255,255,255,.84);
  font-size:10px;
  font-weight:900;
}

.mrtb-scg-builder-order b{
  color:#2f477a;
  font-size:11px;
}

.mrtb-scg-builder-order span{
  padding:3px 7px;
  border-radius:8px;
  color:#34476e;
  background:#edf3ff;
}

.mrtb-scg-builder-order i{
  color:#7790c5;
  font-style:normal;
}

.mrtb-scg-player.builder{
  grid-template-rows:
    auto
    minmax(58px,1fr)
    auto
    auto
    auto
    auto
    auto
    auto
    auto;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block{
  grid-template-columns:42px minmax(0,1fr);
}

.mrtb-scg-player.builder .mrtb-scg-answer-block > div{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(0,1fr);
  gap:3px;
  min-width:0;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.roots > div{
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-auto-flow:row;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.family > div{
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-auto-flow:row;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.quality > div{
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-auto-flow:row;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.base > div{
  grid-template-columns:repeat(6,minmax(0,1fr));
  grid-auto-flow:row;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.special > div{
  grid-template-columns:repeat(6,minmax(0,1fr));
  grid-auto-flow:row;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block button{
  display:grid;
  place-items:center;
  min-width:0;
  padding:3px 4px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block button b{
  overflow:hidden;
  max-width:100%;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block button.active{
  color:#fff;
  border-color:#4764c2;
  background:linear-gradient(180deg,#6685e4,#4d68c5);
  box-shadow:0 4px 9px rgba(66,91,171,.20);
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.family button.active{
  border-color:#7a5bc4;
  background:linear-gradient(180deg,#9a7be1,#7252b9);
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.quality button.active{
  border-color:#3578b5;
  background:linear-gradient(180deg,#59a9e2,#377fc0);
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.base button.active{
  border-color:#b07730;
  background:linear-gradient(180deg,#edb85f,#c78a34);
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.special button.active{
  border-color:#bb477e;
  background:linear-gradient(180deg,#e779ae,#c04d86);
}

.mrtb-scg-player.builder .mrtb-scg-answer-block button:disabled.active{
  opacity:1;
  filter:none;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block button:disabled:not(.active){
  opacity:.35;
}

.mrtb-scg-player.builder .mrtb-scg-live-answer{
  letter-spacing:.1px;
}

/* 1–2 παίκτες: controls όπως στο extended game, μεγάλα και καθαρά. */
.mrtb-scg-grid.players-1 .mrtb-scg-player.builder .mrtb-scg-answer-block,
.mrtb-scg-grid.players-2 .mrtb-scg-player.builder .mrtb-scg-answer-block{
  grid-template-columns:60px minmax(0,1fr);
  margin-top:5px;
}

.mrtb-scg-grid.players-1 .mrtb-scg-player.builder .mrtb-scg-answer-block > span,
.mrtb-scg-grid.players-2 .mrtb-scg-player.builder .mrtb-scg-answer-block > span{
  font-size:10px;
}

.mrtb-scg-grid.players-1 .mrtb-scg-player.builder .mrtb-scg-answer-block button,
.mrtb-scg-grid.players-2 .mrtb-scg-player.builder .mrtb-scg-answer-block button{
  min-height:33px;
  font-size:12px;
}

/* 4–6 παίκτες: συμπαγής διάταξη χωρίς να κρύβονται τα βήματα. */
.mrtb-scg-grid.players-4 .mrtb-scg-player.builder,
.mrtb-scg-grid.players-5 .mrtb-scg-player.builder,
.mrtb-scg-grid.players-6 .mrtb-scg-player.builder{
  padding:6px;
}

.mrtb-scg-grid.players-4 .mrtb-scg-player.builder .mrtb-scg-answer-block,
.mrtb-scg-grid.players-5 .mrtb-scg-player.builder .mrtb-scg-answer-block,
.mrtb-scg-grid.players-6 .mrtb-scg-player.builder .mrtb-scg-answer-block{
  grid-template-columns:34px minmax(0,1fr);
  margin-top:2px;
}

.mrtb-scg-grid.players-4 .mrtb-scg-player.builder .mrtb-scg-answer-block button,
.mrtb-scg-grid.players-5 .mrtb-scg-player.builder .mrtb-scg-answer-block button,
.mrtb-scg-grid.players-6 .mrtb-scg-player.builder .mrtb-scg-answer-block button{
  min-height:22px;
  padding:2px 3px;
  font-size:8px;
}

/* 7–9 παίκτες: όλα τα βήματα παραμένουν ταυτόχρονα στην οθόνη. */
.mrtb-scg-grid.players-7 .mrtb-scg-player.builder,
.mrtb-scg-grid.players-8 .mrtb-scg-player.builder,
.mrtb-scg-grid.players-9 .mrtb-scg-player.builder{
  grid-template-rows:
    auto
    minmax(42px,1fr)
    auto
    auto
    auto
    auto
    auto
    auto
    auto;
}

.mrtb-scg-grid.players-7 .mrtb-scg-player.builder .mrtb-scg-answer-block,
.mrtb-scg-grid.players-8 .mrtb-scg-player.builder .mrtb-scg-answer-block,
.mrtb-scg-grid.players-9 .mrtb-scg-player.builder .mrtb-scg-answer-block{
  grid-template-columns:24px minmax(0,1fr);
}

.mrtb-scg-grid.players-7 .mrtb-scg-player.builder .mrtb-scg-answer-block > span,
.mrtb-scg-grid.players-8 .mrtb-scg-player.builder .mrtb-scg-answer-block > span,
.mrtb-scg-grid.players-9 .mrtb-scg-player.builder .mrtb-scg-answer-block > span{
  font-size:5.8px;
}

.mrtb-scg-grid.players-7 .mrtb-scg-player.builder .mrtb-scg-answer-block button,
.mrtb-scg-grid.players-8 .mrtb-scg-player.builder .mrtb-scg-answer-block button,
.mrtb-scg-grid.players-9 .mrtb-scg-player.builder .mrtb-scg-answer-block button{
  min-height:17px;
  padding:1px 2px;
  font-size:6.3px;
}

.mrtb-scg-grid.players-7 .mrtb-scg-player.builder .mrtb-scg-answer-block.base > div,
.mrtb-scg-grid.players-8 .mrtb-scg-player.builder .mrtb-scg-answer-block.base > div,
.mrtb-scg-grid.players-9 .mrtb-scg-player.builder .mrtb-scg-answer-block.base > div,
.mrtb-scg-grid.players-7 .mrtb-scg-player.builder .mrtb-scg-answer-block.special > div,
.mrtb-scg-grid.players-8 .mrtb-scg-player.builder .mrtb-scg-answer-block.special > div,
.mrtb-scg-grid.players-9 .mrtb-scg-player.builder .mrtb-scg-answer-block.special > div{
  gap:1px;
}

@media (max-width:980px){
  .mrtb-scg-builder-order{
    display:none;
  }

  .mrtb-scg-play{
    grid-template-rows:auto minmax(0,1fr);
  }
}

@media (max-width:620px){
  .mrtb-scg-player.builder{
    min-height:470px;
  }

  .mrtb-scg-player.builder .mrtb-scg-answer-block{
    grid-template-columns:52px minmax(0,1fr);
  }

  .mrtb-scg-player.builder .mrtb-scg-answer-block button{
    min-height:29px;
    font-size:10px;
  }
}
/* =========================================================
   v0.9.3 · Game layout
   Μεγάλο πεντάγραμμο αριστερά · compact controls δεξιά
   ========================================================= */

.mrtb-scg-player.builder{
  grid-template-rows:auto minmax(0,1fr) auto !important;
  padding:8px !important;
}

.mrtb-scg-player-body{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(190px,.9fr);
  align-items:stretch;
  gap:8px;
  min-width:0;
  min-height:0;
  margin-top:4px;
}

.mrtb-scg-visual-column{
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  min-width:0;
  min-height:0;
  padding:3px 5px 4px;
  box-sizing:border-box;
  border:1px solid rgba(80,112,165,.13);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(245,250,255,.91));
}

.mrtb-scg-controls-column{
  display:grid;
  grid-template-rows:repeat(5,minmax(0,auto));
  align-content:center;
  gap:3px;
  min-width:0;
  min-height:0;
  padding:4px;
  box-sizing:border-box;
  border:1px solid rgba(80,112,165,.13);
  border-radius:14px;
  background:rgba(247,250,255,.92);
}

.mrtb-scg-player.builder .mrtb-scg-staff-wrap{
  min-height:145px !important;
  height:100% !important;
  overflow:visible !important;
}

.mrtb-scg-player.builder .mrtb-scg-staff{
  width:100% !important;
  height:100% !important;
  min-height:145px !important;
  max-height:none !important;
  overflow:visible !important;
}

.mrtb-scg-player.builder .mrtb-scg-lines line,
.mrtb-scg-player.builder .mrtb-scg-ledger{
  stroke-width:3 !important;
}

.mrtb-scg-player.builder .mrtb-scg-clef{
  font-size:96px !important;
}

.mrtb-scg-player.builder .mrtb-scg-accidental{
  font-size:31px !important;
}

.mrtb-scg-player.builder .mrtb-scg-live-answer{
  min-height:27px !important;
  margin:2px 3px 0 !important;
  padding:3px 6px !important;
  font-size:15px !important;
  line-height:1.1 !important;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block{
  grid-template-columns:34px minmax(0,1fr) !important;
  gap:3px !important;
  margin:0 !important;
  min-width:0;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block > span{
  font-size:6.8px !important;
  line-height:1 !important;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block > div{
  gap:2px !important;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block button{
  min-height:20px !important;
  padding:1px 3px !important;
  border-radius:6px !important;
  font-size:7.5px !important;
  line-height:1 !important;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block button b{
  font-size:inherit !important;
  line-height:1 !important;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.roots > div{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.family > div{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.quality > div{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}

.mrtb-scg-player.builder .mrtb-scg-answer-block.base > div,
.mrtb-scg-player.builder .mrtb-scg-answer-block.special > div{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  grid-auto-flow:row !important;
}

.mrtb-scg-player.builder .mrtb-scg-status{
  min-height:15px !important;
  margin-top:3px !important;
  font-size:7.5px !important;
  line-height:1.1 !important;
}

/* 1–2 παίκτες: πολύ μεγάλο πεντάγραμμο, controls σταθερά δεξιά. */
.mrtb-scg-grid.players-1 .mrtb-scg-player-body,
.mrtb-scg-grid.players-2 .mrtb-scg-player-body{
  grid-template-columns:minmax(0,1.55fr) minmax(235px,.75fr);
  gap:12px;
}

.mrtb-scg-grid.players-1 .mrtb-scg-player.builder .mrtb-scg-staff-wrap,
.mrtb-scg-grid.players-2 .mrtb-scg-player.builder .mrtb-scg-staff-wrap,
.mrtb-scg-grid.players-1 .mrtb-scg-player.builder .mrtb-scg-staff,
.mrtb-scg-grid.players-2 .mrtb-scg-player.builder .mrtb-scg-staff{
  min-height:245px !important;
}

.mrtb-scg-grid.players-1 .mrtb-scg-player.builder .mrtb-scg-answer-block button,
.mrtb-scg-grid.players-2 .mrtb-scg-player.builder .mrtb-scg-answer-block button{
  min-height:27px !important;
  font-size:9.5px !important;
}

.mrtb-scg-grid.players-1 .mrtb-scg-player.builder .mrtb-scg-answer-block > span,
.mrtb-scg-grid.players-2 .mrtb-scg-player.builder .mrtb-scg-answer-block > span{
  font-size:8px !important;
}

.mrtb-scg-grid.players-1 .mrtb-scg-player.builder .mrtb-scg-live-answer,
.mrtb-scg-grid.players-2 .mrtb-scg-player.builder .mrtb-scg-live-answer{
  min-height:35px !important;
  font-size:20px !important;
}

/* 3–6 παίκτες: η ζητούμενη διάταξη για τις κάρτες 2x2 / 3x2. */
.mrtb-scg-grid.players-3 .mrtb-scg-player-body,
.mrtb-scg-grid.players-4 .mrtb-scg-player-body,
.mrtb-scg-grid.players-5 .mrtb-scg-player-body,
.mrtb-scg-grid.players-6 .mrtb-scg-player-body{
  grid-template-columns:minmax(0,1.42fr) minmax(170px,.88fr);
}

.mrtb-scg-grid.players-3 .mrtb-scg-player.builder .mrtb-scg-staff-wrap,
.mrtb-scg-grid.players-4 .mrtb-scg-player.builder .mrtb-scg-staff-wrap,
.mrtb-scg-grid.players-5 .mrtb-scg-player.builder .mrtb-scg-staff-wrap,
.mrtb-scg-grid.players-6 .mrtb-scg-player.builder .mrtb-scg-staff-wrap,
.mrtb-scg-grid.players-3 .mrtb-scg-player.builder .mrtb-scg-staff,
.mrtb-scg-grid.players-4 .mrtb-scg-player.builder .mrtb-scg-staff,
.mrtb-scg-grid.players-5 .mrtb-scg-player.builder .mrtb-scg-staff,
.mrtb-scg-grid.players-6 .mrtb-scg-player.builder .mrtb-scg-staff{
  min-height:155px !important;
}

/* 7–9 παίκτες: ίδια διάταξη, πιο compact controls, όχι μικροσκοπικό staff. */
.mrtb-scg-grid.players-7 .mrtb-scg-player-body,
.mrtb-scg-grid.players-8 .mrtb-scg-player-body,
.mrtb-scg-grid.players-9 .mrtb-scg-player-body{
  grid-template-columns:minmax(0,1.3fr) minmax(132px,.95fr);
  gap:4px;
  margin-top:2px;
}

.mrtb-scg-grid.players-7 .mrtb-scg-player.builder .mrtb-scg-staff-wrap,
.mrtb-scg-grid.players-8 .mrtb-scg-player.builder .mrtb-scg-staff-wrap,
.mrtb-scg-grid.players-9 .mrtb-scg-player.builder .mrtb-scg-staff-wrap,
.mrtb-scg-grid.players-7 .mrtb-scg-player.builder .mrtb-scg-staff,
.mrtb-scg-grid.players-8 .mrtb-scg-player.builder .mrtb-scg-staff,
.mrtb-scg-grid.players-9 .mrtb-scg-player.builder .mrtb-scg-staff{
  min-height:102px !important;
}

.mrtb-scg-grid.players-7 .mrtb-scg-controls-column,
.mrtb-scg-grid.players-8 .mrtb-scg-controls-column,
.mrtb-scg-grid.players-9 .mrtb-scg-controls-column{
  padding:2px;
  gap:1px;
}

.mrtb-scg-grid.players-7 .mrtb-scg-player.builder .mrtb-scg-answer-block,
.mrtb-scg-grid.players-8 .mrtb-scg-player.builder .mrtb-scg-answer-block,
.mrtb-scg-grid.players-9 .mrtb-scg-player.builder .mrtb-scg-answer-block{
  grid-template-columns:21px minmax(0,1fr) !important;
  gap:1px !important;
}

.mrtb-scg-grid.players-7 .mrtb-scg-player.builder .mrtb-scg-answer-block > span,
.mrtb-scg-grid.players-8 .mrtb-scg-player.builder .mrtb-scg-answer-block > span,
.mrtb-scg-grid.players-9 .mrtb-scg-player.builder .mrtb-scg-answer-block > span{
  font-size:5px !important;
}

.mrtb-scg-grid.players-7 .mrtb-scg-player.builder .mrtb-scg-answer-block button,
.mrtb-scg-grid.players-8 .mrtb-scg-player.builder .mrtb-scg-answer-block button,
.mrtb-scg-grid.players-9 .mrtb-scg-player.builder .mrtb-scg-answer-block button{
  min-height:15px !important;
  padding:0 1px !important;
  border-radius:4px !important;
  font-size:5.8px !important;
}

.mrtb-scg-grid.players-7 .mrtb-scg-player.builder .mrtb-scg-live-answer,
.mrtb-scg-grid.players-8 .mrtb-scg-player.builder .mrtb-scg-live-answer,
.mrtb-scg-grid.players-9 .mrtb-scg-player.builder .mrtb-scg-live-answer{
  min-height:19px !important;
  font-size:10px !important;
}

@media (max-width:900px){
  .mrtb-scg-player-body{
    grid-template-columns:minmax(0,1.2fr) minmax(140px,.9fr);
  }
}

@media (max-width:620px){
  .mrtb-scg-player-body,
  .mrtb-scg-grid.players-1 .mrtb-scg-player-body,
  .mrtb-scg-grid.players-2 .mrtb-scg-player-body,
  .mrtb-scg-grid.players-3 .mrtb-scg-player-body,
  .mrtb-scg-grid.players-4 .mrtb-scg-player-body,
  .mrtb-scg-grid.players-5 .mrtb-scg-player-body,
  .mrtb-scg-grid.players-6 .mrtb-scg-player-body,
  .mrtb-scg-grid.players-7 .mrtb-scg-player-body,
  .mrtb-scg-grid.players-8 .mrtb-scg-player-body,
  .mrtb-scg-grid.players-9 .mrtb-scg-player-body{
    grid-template-columns:1fr;
  }

  .mrtb-scg-player.builder .mrtb-scg-staff-wrap,
  .mrtb-scg-player.builder .mrtb-scg-staff{
    min-height:190px !important;
  }
}