/* MR Theory Board - Template 3: Ρυθμική αγωγή
   Standalone clean CSS για assets/css/mrtb-rhythm.css
*/

/* Στο rhythm template χρησιμοποιούμε τη δική του σκηνή, όχι το κανονικό πεντάγραμμο από το board. */
.mrtb-app[data-scene="rhythm"] .mrtb-mini-piano,
.mrtb-app[data-scene="rhythm"] .mrtb-staff,
.mrtb-app[data-scene="rhythm"] .mrtb-values-scene,
.mrtb-app[data-scene="rhythm"] .mrtb-value-game-stage,
.mrtb-app[data-scene="rhythm"] .mrtb-game-hud,
.mrtb-app[data-scene="rhythm"] .mrtb-game-result,
.mrtb-app[data-scene="rhythm"] .mrtb-game-fx,
.mrtb-app[data-scene="rhythm"] .mrtb-board-note:not(.mrtb-rhythm-note),
.mrtb-app[data-scene="rhythm"] .mrtb-note-beam,
.mrtb-app[data-scene="rhythm"] .mrtb-chord-stem-link{
  display:none !important;
}

.mrtb-app[data-scene="rhythm"]{
  min-height:620px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-board-wrap{
  background:
    radial-gradient(circle at 12% 12%, rgba(255,255,255,.92) 0 34px, transparent 36px),
    radial-gradient(circle at 82% 12%, rgba(255,255,255,.78) 0 48px, transparent 50px),
    linear-gradient(90deg,rgba(255,255,255,.28) 1px,transparent 1px) 0 0/42px 42px,
    linear-gradient(0deg,rgba(255,255,255,.28) 1px,transparent 1px) 0 0/42px 42px,
    linear-gradient(180deg,#84defb 0%,#bcefff 42%,#d7ffc0 43%,#9ee979 100%) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-board{
  overflow:hidden !important;
}

.mrtb-rhythm-scene{
  position:absolute !important;
  left:14px !important;
  right:14px !important;
  top:10px !important;
  bottom:10px !important;
  z-index:80 !important;
  min-height:0 !important;
  padding:10px !important;
  border-radius:24px !important;
  background:rgba(255,255,255,.72) !important;
  border:2px solid rgba(255,255,255,.94) !important;
  box-shadow:0 14px 30px rgba(35,72,92,.13), inset 0 0 0 3px rgba(255,255,255,.3) !important;
  overflow:hidden !important;
  pointer-events:auto !important;
  display:grid !important;
  grid-template-rows:auto auto minmax(0,1fr) auto !important;
  gap:8px !important;
}

.mrtb-rhythm-hero{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,246,208,.94));
  box-shadow:0 10px 18px rgba(35,72,92,.1), inset 0 -4px 0 rgba(0,0,0,.07);
}

.mrtb-rhythm-hero strong{
  display:block;
  font-size:20px;
  line-height:1;
  font-weight:1000;
  color:#243044;
}

.mrtb-rhythm-hero span{
  display:block;
  margin-top:2px;
  font-size:11.5px;
  line-height:1.15;
  font-weight:900;
  color:#526079;
}

.mrtb-rhythm-controls{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:end;
  gap:5px;
}

.mrtb-rhythm-controls label{
  display:grid;
  gap:3px;
  font-size:9.5px;
  font-weight:1000;
  color:#526079;
  text-transform:uppercase;
  letter-spacing:.5px;
}

.mrtb-rhythm-controls select,
.mrtb-rhythm-controls button,
.mrtb-rhythm-dotbar button{
  min-height:28px;
  border:0;
  border-radius:10px;
  padding:4px 8px;
  font:inherit;
  font-size:11px;
  font-weight:950;
  color:#263044;
  background:rgba(255,255,255,.95);
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.1), 0 5px 12px rgba(47,72,94,.12);
  cursor:pointer;
  pointer-events:auto;
}

.mrtb-rhythm-controls button[data-rhythm-action="check"]{
  background:linear-gradient(180deg,#a9ff97,#43d574);
}

.mrtb-rhythm-dotbar{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:6px;
  padding:6px;
  border-radius:16px;
  background:rgba(255,255,255,.78);
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.07);
}

.mrtb-rhythm-dotbar button.selected{
  background:linear-gradient(180deg,#fff48b,#ffc44d);
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.16), 0 0 0 3px rgba(255,196,77,.28);
}

.mrtb-rhythm-theory{
  display:grid;
  grid-template-columns:1fr 1fr minmax(210px,.8fr);
  gap:7px;
  margin:0;
}

.mrtb-rhythm-theory > div{
  min-height:52px;
  padding:7px 9px;
  border-radius:15px;
  background:rgba(255,255,255,.9);
  box-shadow:0 8px 15px rgba(35,72,92,.08), inset 0 -3px 0 rgba(0,0,0,.05);
}

.mrtb-rhythm-theory .num{ background:linear-gradient(180deg,#e9f6ff,#bfe4ff); }
.mrtb-rhythm-theory .den{ background:linear-gradient(180deg,#fff4cf,#ffd979); }
.mrtb-rhythm-theory .sel{ background:linear-gradient(180deg,#f4fff4,#d3ffd6); }

.mrtb-rhythm-theory b{
  display:block;
  margin-bottom:2px;
  font-size:11.5px;
  font-weight:1000;
  color:#243044;
}

.mrtb-rhythm-theory span{
  display:block;
  font-size:10.5px;
  line-height:1.15;
  font-weight:850;
  color:#526079;
}

.mrtb-rhythm-theory .sel span{
  display:flex;
  align-items:center;
  gap:7px;
  color:#243044;
}

.mrtb-rhythm-theory .sel small{
  display:block;
  margin-top:3px;
  font-size:10px;
  font-weight:900;
  color:#526079;
}

.mrtb-rhythm-theory .mrtb-value-icon{
  transform:scale(.9) !important;
  pointer-events:none !important;
}

.mrtb-rhythm-paper{
  position:relative;
  min-height:0;
  height:100%;
  margin:0;
  padding:12px 12px 12px 88px;
  border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(248,252,255,.91));
  border:2px solid rgba(38,48,68,.08);
  box-shadow:0 14px 26px rgba(35,72,92,.11), inset 0 -5px 0 rgba(0,0,0,.05);
  overflow:hidden;
  pointer-events:auto;
}

.mrtb-rhythm-clef{
  position:absolute;
  left:12px;
  top:112px;
  width:46px;
  text-align:center;
  font-family:"Times New Roman",serif;
  font-size:76px;
  line-height:1;
  color:#20263a;
  pointer-events:none;
  z-index:6;
}

.mrtb-rhythm-time{
  position:absolute;
  left:58px;
  top:132px;
  display:grid;
  place-items:center;
  font-size:34px;
  line-height:.82;
  font-weight:1000;
  color:#20263a;
  pointer-events:none;
  z-index:6;
}

.mrtb-rhythm-measures{
  position:relative;
  z-index:20;
  display:flex;
  height:100%;
  min-height:300px;
  gap:14px;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  scroll-snap-type:x mandatory;
  padding:8px 10px 10px 0;
  pointer-events:auto;
}

.mrtb-rhythm-measure{
  position:relative;
  flex:0 0 calc(100% - 4px);
  min-width:calc(100% - 4px);
  height:100%;
  min-height:292px;
  padding:8px 10px 34px;
  border-left:3px solid rgba(20,25,40,.58);
  border-right:5px double rgba(20,25,40,.7);
  border-radius:22px;
  background:rgba(255,255,255,.12);
  cursor:pointer;
  transition:.15s ease;
  scroll-snap-align:start;
  overflow:hidden;
  pointer-events:auto;
}

.mrtb-rhythm-measure:hover{ background:rgba(255,255,255,.38); }
.mrtb-rhythm-measure.under{ background:rgba(255,210,64,.18); }
.mrtb-rhythm-measure.over{ background:rgba(255,90,90,.2); }
.mrtb-rhythm-measure.ok{
  outline:4px solid rgba(67,213,116,.46);
  background:linear-gradient(180deg, rgba(223,255,218,.65), rgba(255,255,255,.22));
}

.mrtb-rhythm-measure-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  border-radius:16px;
  background:rgba(255,255,255,.92);
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.06);
}

.mrtb-rhythm-measure-top strong{ font-size:13px; font-weight:1000; }
.mrtb-rhythm-measure-top span{ font-size:11px; font-weight:950; color:#526079; }

.mrtb-rhythm-fill{
  height:9px;
  margin:7px 2px 8px;
  border-radius:999px;
  background:rgba(38,48,68,.12);
  overflow:hidden;
  box-shadow:inset 0 2px 4px rgba(0,0,0,.08);
}

.mrtb-rhythm-fill i{
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#74bdff,#43d574);
  transition:width .18s ease;
}

.mrtb-rhythm-measure.over .mrtb-rhythm-fill i{
  background:linear-gradient(90deg,#ffbf5a,#ff6464);
}

.mrtb-rhythm-note-row{
  position:relative;
  height:150px;
  min-height:150px;
  padding:0;
  margin:0;
  pointer-events:auto;
}

.mrtb-rhythm-mini-staff{
  position:relative;
  width:100%;
  height:150px;
  min-height:150px;
  overflow:hidden;
  pointer-events:auto;
}

.mrtb-rhythm-mini-lines{
  position:absolute;
  left:0;
  right:0;
  top:30px;
  height:108px;
  pointer-events:none;
  z-index:1;
}

.mrtb-rhythm-mini-lines i{
  position:absolute;
  left:0;
  right:0;
  height:2px;
  border-radius:3px;
  background:rgba(20,25,40,.54);
}

.mrtb-rhythm-mini-lines i:nth-child(1){ top:0; }
.mrtb-rhythm-mini-lines i:nth-child(2){ top:27px; }
.mrtb-rhythm-mini-lines i:nth-child(3){ top:54px; }
.mrtb-rhythm-mini-lines i:nth-child(4){ top:81px; }
.mrtb-rhythm-mini-lines i:nth-child(5){ top:108px; }

.mrtb-rhythm-empty{
  position:absolute;
  left:0;
  right:0;
  top:32px;
  height:108px;
  display:grid;
  place-items:center;
  border:2px dashed rgba(38,48,68,.16);
  border-radius:18px;
  color:#7b8798;
  font-size:16px;
  font-weight:1000;
  background:rgba(255,255,255,.22);
  pointer-events:none;
  z-index:2;
}

.mrtb-rhythm-note{
  position:absolute;
  z-index:5;
  width:58px;
  height:78px;
  border:0;
  background:transparent !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding:0 !important;
  cursor:pointer;
  pointer-events:auto;
}

.mrtb-rhythm-note:hover{ transform:translateY(-1px); }

.mrtb-rhythm-note .head{
  position:absolute;
  left:8px;
  top:22px;
  width:22px;
  height:15px;
  border:3px solid #1f2535;
  border-radius:50%;
  transform:rotate(-18deg);
  background:#1f2535;
}

.mrtb-rhythm-note.open .head{ background:#fff; }
.mrtb-rhythm-note.v-whole .head{
  left:7px;
  top:22px;
  width:26px;
  height:16px;
  border-width:4px;
  background:#fff;
}

.mrtb-rhythm-note .stem{
  position:absolute;
  left:30px;
  top:-8px;
  width:4px;
  height:52px;
  border-radius:4px;
  background:#1f2535;
}

.mrtb-rhythm-note.v-whole .stem{ display:none; }

.mrtb-rhythm-note .flag{
  position:absolute;
  left:30px;
  width:18px;
  height:12px;
  border:0;
  border-top:4px solid #1f2535;
  border-radius:0 14px 12px 0;
  background:transparent;
  transform-origin:left top;
  transform:rotate(24deg);
}

.mrtb-rhythm-note .flag.f1{ top:-8px; }
.mrtb-rhythm-note .flag.f2{ top:0; }
.mrtb-rhythm-note .flag.f3{ top:8px; }
.mrtb-rhythm-note .flag.f4{ top:16px; }

.mrtb-rhythm-note.v-whole .flag,
.mrtb-rhythm-note.v-half .flag,
.mrtb-rhythm-note.v-quarter .flag{ display:none; }

.mrtb-rhythm-note.v-eighth .flag.f2,
.mrtb-rhythm-note.v-eighth .flag.f3,
.mrtb-rhythm-note.v-eighth .flag.f4{ display:none; }

.mrtb-rhythm-note.v-sixteenth .flag.f3,
.mrtb-rhythm-note.v-sixteenth .flag.f4{ display:none; }

.mrtb-rhythm-note.v-thirtysecond .flag.f4{ display:none; }

.mrtb-rhythm-note.beamed .flag{ display:none !important; }
.mrtb-rhythm-note.beamed .stem{ height:60px; top:-16px; }

.mrtb-rhythm-note-dots,
.mrtb-rhythm-value-dots{
  position:absolute;
  display:flex;
  gap:3px;
  pointer-events:none;
}

.mrtb-rhythm-note-dots{
  left:36px;
  top:29px;
}

.mrtb-rhythm-value-dots{
  left:33px;
  top:18px;
}

.mrtb-rhythm-note-dots i,
.mrtb-rhythm-value-dots i{
  width:5px;
  height:5px;
  border-radius:999px;
  background:#1f2535;
}

.mrtb-rhythm-beam{
  position:absolute;
  z-index:6;
  height:5px;
  background:#1f2535;
  border-radius:3px;
  pointer-events:none;
}

.mrtb-rhythm-beam.level-1{ top:46px; }
.mrtb-rhythm-beam.level-2{ top:54px; }
.mrtb-rhythm-beam.level-3{ top:62px; }
.mrtb-rhythm-beam.level-4{ top:70px; }

.mrtb-rhythm-expression{
  min-height:24px;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:4px;
  padding:4px;
  border-radius:12px;
  background:rgba(255,255,255,.86);
  font-size:11px;
  font-weight:950;
  text-align:center;
  position:relative;
  z-index:8;
}

.mrtb-rhythm-expression b{
  padding:2px 6px;
  border-radius:999px;
  background:rgba(70,151,255,.13);
}

.mrtb-rhythm-expression em{
  font-style:normal;
  color:#ff8c2b;
  font-weight:1000;
}

.mrtb-rhythm-expression small{
  width:100%;
  color:#526079;
  font-weight:1000;
}

.mrtb-rhythm-status{
  margin-top:4px;
  padding:4px 7px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#526079;
  text-align:center;
  font-size:10.5px;
  font-weight:1000;
  position:relative;
  z-index:8;
}

.mrtb-rhythm-measure.ok .mrtb-rhythm-status{ color:#138345; background:rgba(220,255,225,.96); }
.mrtb-rhythm-measure.over .mrtb-rhythm-status{ color:#bc2d2d; background:rgba(255,225,225,.96); }

.mrtb-rhythm-clear-measure{
  position:absolute;
  left:10px;
  right:10px;
  bottom:6px;
  min-height:23px;
  border:0;
  border-radius:10px;
  background:rgba(255,255,255,.9);
  color:#526079;
  font:inherit;
  font-size:10px;
  font-weight:950;
  cursor:pointer;
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.08);
  pointer-events:auto;
  z-index:9;
}

.mrtb-rhythm-clear-measure:hover{
  background:linear-gradient(180deg,#ffc1c1,#ff8888);
  color:#571313;
}

.mrtb-rhythm-warning{
  display:none;
  margin:0;
  padding:7px 10px;
  border-radius:14px;
  background:linear-gradient(180deg,#ffe0e0,#ff9b9b);
  color:#5b1515;
  font-size:12px;
  font-weight:1000;
  box-shadow:0 8px 16px rgba(120,30,30,.12), inset 0 -3px 0 rgba(0,0,0,.08);
}

.mrtb-rhythm-warning.show{ display:block; }
.mrtb-rhythm-help{ display:none !important; }

.mrtb-rhythm-measure.celebrate{
  animation:mrtb-measure-jump .48s cubic-bezier(.2,1.6,.35,1) both;
}

.mrtb-rhythm-measure.celebrate::after{
  content:"✓ ★";
  position:absolute;
  right:16px;
  top:56px;
  z-index:16;
  color:#ffc133;
  font-size:34px;
  font-weight:1000;
  text-shadow:0 2px 0 #fff, 0 7px 12px rgba(35,72,92,.15);
  animation:mrtb-stars-rise .95s ease-out both;
  pointer-events:none;
}

@keyframes mrtb-measure-jump{
  0%{ transform:translateY(0) scale(1); }
  35%{ transform:translateY(-8px) scale(1.015); }
  100%{ transform:translateY(0) scale(1); }
}

@keyframes mrtb-stars-rise{
  0%{ transform:translateY(30px) scale(.6); opacity:0; }
  30%{ opacity:1; }
  100%{ transform:translateY(-35px) scale(1.15); opacity:0; }
}

@media (max-width:1100px){
  .mrtb-rhythm-hero{ display:grid; }
  .mrtb-rhythm-controls{ justify-content:flex-start; }
  .mrtb-rhythm-theory{ grid-template-columns:1fr; }
  .mrtb-rhythm-paper{ padding-left:78px; }
  .mrtb-rhythm-clef{ left:6px; top:112px; font-size:66px; width:44px; }
  .mrtb-rhythm-time{ left:48px; top:132px; font-size:28px; }
}

@media (max-width:900px){
  .mrtb-app[data-scene="rhythm"]{ min-height:700px !important; }
  .mrtb-rhythm-scene{ left:8px; right:8px; top:8px; bottom:8px; padding:8px; gap:6px; }
  .mrtb-rhythm-theory > div{ min-height:40px; }
  .mrtb-rhythm-paper{ padding-left:72px; }
  .mrtb-rhythm-clef{ left:2px; top:108px; font-size:60px; width:40px; }
  .mrtb-rhythm-time{ left:42px; top:126px; font-size:26px; }
  .mrtb-rhythm-measures{ min-height:280px; }
  .mrtb-rhythm-note-row,
  .mrtb-rhythm-mini-staff{ min-height:140px; height:140px; }
  .mrtb-rhythm-mini-lines{ top:28px; }
}

.mrtb-rhythm-dotbar{
  display:none !important;
}

.mrtb-rhythm-note .stem{
  top:var(--stem-top, -8px) !important;
  height:var(--stem-h, 52px) !important;
}

.mrtb-rhythm-note.beamed .stem{
  top:var(--stem-top, -16px) !important;
  height:var(--stem-h, 60px) !important;
}



.mrtb-rhythm-beam{
  top:var(--beam-y, 46px);
}

/* ===== rhythm notes ίδιο σχέδιο με note template ===== */

.mrtb-rhythm-note.mrtb-board-note{
  width:96px !important;
  height:96px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  filter:none !important;
  padding:0 !important;
  z-index:30 !important;
  pointer-events:auto !important;
  transform:scale(.82);
  transform-origin:32px 34px;
}

.mrtb-rhythm-note .mrtb-note-hitbox{
  left:25px !important;
  top:24px !important;
  width:50px !important;
  height:42px !important;
  pointer-events:auto !important;
}

.mrtb-rhythm-note .mrtb-note-glyph{
  position:absolute !important;
  left:21px !important;
  top:14px !important;
  width:56px !important;
  height:58px !important;
  pointer-events:none !important;
}

.mrtb-rhythm-note .mrtb-note-head{
  position:absolute !important;
  left:8px !important;
  top:20px !important;
  width:34px !important;
  height:23px !important;
  border:3px solid #1f2535 !important;
  border-radius:50% !important;
  transform:rotate(-18deg) !important;
  background:#1f2535 !important;
}

.mrtb-rhythm-note .mrtb-note-glyph.open .mrtb-note-head{
  background:#fff !important;
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.6) !important;
}

.mrtb-rhythm-note .mrtb-note-glyph.whole .mrtb-note-head{
  left:7px !important;
  top:20px !important;
  width:38px !important;
  height:24px !important;
  border-width:4px !important;
  background:#fff !important;
}

.mrtb-rhythm-note .mrtb-stem{
  position:absolute !important;
  width:4px !important;
  height:64px !important;
  background:#1f2535 !important;
  border-radius:5px !important;
}

.mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-stem{
  left:40px !important;
  top:var(--stem-top, -21px) !important;
  height:var(--stem-h, 64px) !important;
}

.mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-stem{
  left:8px !important;
  top:33px !important;
  height:64px !important;
}

.mrtb-rhythm-note .mrtb-note-glyph.whole .mrtb-stem{
  display:none !important;
}

.mrtb-rhythm-note .mrtb-flag{
  position:absolute !important;
  width:30px !important;
  height:18px !important;
  border:0 !important;
  border-top:5px solid #1f2535 !important;
  background:transparent !important;
  pointer-events:none !important;
}

.mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag{
  left:41px !important;
  border-radius:0 18px 16px 0 !important;
  transform-origin:left top !important;
  transform:rotate(24deg) !important;
}

.mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f1{ top:-21px !important; }
.mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f2{ top:-8px !important; }
.mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f3{ top:5px !important; }
.mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f4{ top:18px !important; }

.mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag{
  left:-20px !important;
  border-radius:18px 0 0 16px !important;
  transform-origin:right top !important;
  transform:rotate(204deg) !important;
}

.mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f1{ top:91px !important; }
.mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f2{ top:78px !important; }
.mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f3{ top:65px !important; }
.mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f4{ top:52px !important; }

.mrtb-rhythm-note .mrtb-note-glyph.whole .mrtb-flag,
.mrtb-rhythm-note .mrtb-note-glyph.half .mrtb-flag,
.mrtb-rhythm-note .mrtb-note-glyph.quarter .mrtb-flag{
  display:none !important;
}

.mrtb-rhythm-note .mrtb-note-glyph.eighth .mrtb-flag.f2,
.mrtb-rhythm-note .mrtb-note-glyph.eighth .mrtb-flag.f3,
.mrtb-rhythm-note .mrtb-note-glyph.eighth .mrtb-flag.f4{
  display:none !important;
}

.mrtb-rhythm-note .mrtb-note-glyph.sixteenth .mrtb-flag.f3,
.mrtb-rhythm-note .mrtb-note-glyph.sixteenth .mrtb-flag.f4{
  display:none !important;
}

.mrtb-rhythm-note .mrtb-note-glyph.thirtysecond .mrtb-flag.f4{
  display:none !important;
}

.mrtb-rhythm-note.mrtb-beamed-note .mrtb-flag{
  display:none !important;
}

.mrtb-rhythm-ledgers{
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  width:96px !important;
  height:150px !important;
  pointer-events:none !important;
  z-index:1 !important;
}

.mrtb-rhythm-ledgers span{
  position:absolute !important;
  left:17px !important;
  width:64px !important;
  height:3px !important;
  border-radius:4px !important;
  background:rgba(20,25,40,.86) !important;
}

.mrtb-rhythm-note-dots{
  position:absolute !important;
  left:50px !important;
  top:27px !important;
  display:flex !important;
  gap:4px !important;
  pointer-events:none !important;
}

.mrtb-rhythm-note-dots i{
  width:5px !important;
  height:5px !important;
  border-radius:999px !important;
  background:#1f2535 !important;
}


.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-board-note{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}

/* ===== Rhythm labels ίδιο σύστημα με Template 1 ===== */

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-name{
  display:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-caption,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-value{
  display:none !important;
  position:absolute !important;
  z-index:90 !important;
  pointer-events:none !important;
  white-space:nowrap !important;
}

/* Όνομα νότας: ίδιο στυλ με πρώτο template */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-caption{
  left:68px !important;
  top:16px !important;
  min-width:86px !important;
  height:58px !important;
  padding:8px 13px !important;
  border-radius:28px !important;
  border:4px solid #ff9b53 !important;
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 12px 22px rgba(36,48,68,.10) !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  font-weight:1000 !important;
  color:#243044 !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-caption b{
  font-size:25px !important;
  line-height:1 !important;
  color:#243044 !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-caption span{
  font-size:22px !important;
  line-height:1 !important;
  color:#243044 !important;
}

/* Αξία: ίδιο bubble style */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-value{
  left:-34px !important;
  top:58px !important;
  min-width:82px !important;
  padding:8px 12px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 10px 18px rgba(36,48,68,.10) !important;
  color:#2f3a52 !important;
  font-size:18px !important;
  line-height:1 !important;
  font-weight:1000 !important;
  text-align:center !important;
}

/* Το κουμπί "Νότες" δουλεύει και στο rhythm */
.mrtb-app[data-scene="rhythm"].mrtb-show-note-names .mrtb-rhythm-note-caption{
  display:flex !important;
}

/* Το κουμπί "Αξίες" δουλεύει και στο rhythm */
.mrtb-app[data-scene="rhythm"].mrtb-show-values .mrtb-rhythm-note-value{
  display:block !important;
}

/* Όταν είναι ανοιχτά και τα δύο, να μη μπουκώνουν πάνω στη νότα */
.mrtb-app[data-scene="rhythm"].mrtb-show-note-names.mrtb-show-values .mrtb-rhythm-note-value{
  top:76px !important;
}

/* ===== FIX rhythm labels: ίδιο μέγεθος με template 1 ===== */

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note{
  width:96px !important;
  height:96px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  filter:none !important;
  padding:0 !important;
  z-index:30 !important;
  pointer-events:auto !important;
  transform:scale(.82) !important;
  transform-origin:32px 34px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-caption,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-value{
  display:none !important;
  position:absolute !important;
  z-index:90 !important;
  pointer-events:none !important;
  white-space:nowrap !important;
}

/* label νότας ίδιο μικρό bubble όπως template 1 */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-caption{
  left:82px !important;
  top:30px !important;
  transform:none !important;

  min-width:70px !important;
  height:auto !important;
  padding:3px 7px !important;

  border-radius:999px !important;
  border:2px solid var(--note-bg,#ff9b53) !important;
  background:rgba(255,255,255,.9) !important;
  box-shadow:none !important;

  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;

  color:#1d2638 !important;
  font-size:11px !important;
  line-height:1 !important;
  font-weight:950 !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-caption b{
  font-size:16px !important;
  line-height:1 !important;
  color:#1d2638 !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-caption span{
  font-size:13px !important;
  line-height:1 !important;
  opacity:.88 !important;
  color:#1d2638 !important;
}

/* label αξίας ίδιο μικρό bubble όπως template 1 */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-value{
  left:-48px !important;
  top:auto !important;
  bottom:8px !important;
  transform:none !important;

  min-width:54px !important;
  max-width:68px !important;
  padding:2px 6px !important;

  border-radius:999px !important;
  background:rgba(255,255,255,.86) !important;
  box-shadow:none !important;

  color:#2f3a52 !important;
  font-size:10px !important;
  line-height:1.05 !important;
  font-weight:900 !important;
  text-align:center !important;
}

/* κουμπιά show/hide δουλεύουν και στη ρυθμική */
.mrtb-app[data-scene="rhythm"].mrtb-show-note-names .mrtb-rhythm-note-caption{
  display:flex !important;
}

.mrtb-app[data-scene="rhythm"].mrtb-show-values .mrtb-rhythm-note-value{
  display:block !important;
}


/* =========================================================
   MR Theory Board - Rhythm Game CSS
   Βάλ' το στο ΤΕΛΟΣ του assets/css/mrtb-board.css
   ========================================================= */

.mrtb-app.mrtb-rhythm-game-mode .mrtb-mini-piano,
.mrtb-app.mrtb-rhythm-game-mode .mrtb-staff{
  display:none !important;
}

.mrtb-app.mrtb-rhythm-game-mode .mrtb-board-wrap{
  background:
    radial-gradient(circle at 12% 16%, rgba(255,255,255,.92) 0 28px, transparent 30px),
    radial-gradient(circle at 80% 14%, rgba(255,255,255,.82) 0 42px, transparent 44px),
    linear-gradient(90deg,rgba(255,255,255,.22) 1px,transparent 1px) 0 0/42px 42px,
    linear-gradient(0deg,rgba(255,255,255,.22) 1px,transparent 1px) 0 0/42px 42px,
    linear-gradient(180deg,#84dcff 0%,#b7efff 43%,#97ef74 44%,#48ce56 100%) !important;
}

.mrtb-rhythm-game-stage{
  position:absolute;
  left:22px;
  right:22px;
  top:18px;
  z-index:72;
  min-height:620px;
  padding:14px;
  border-radius:28px;
  background:rgba(255,255,255,.76);
  border:3px solid rgba(255,255,255,.9);
  box-shadow:0 16px 34px rgba(35,72,92,.16), inset 0 0 0 4px rgba(255,255,255,.3);
}

.mrtb-rhythm-game-score{
  position:relative !important;
  margin:0 0 12px !important;
  padding:10px 12px;
  border-radius:22px;
  background:rgba(255,255,255,.92);
  box-shadow:0 10px 18px rgba(35,72,92,.1), inset 0 -4px 0 rgba(0,0,0,.06);
}

.mrtb-rhythm-game-title{
  display:grid;
  gap:4px;
  padding:13px 14px;
  border-radius:24px;
  background:linear-gradient(180deg,#fff8d7,#ffe389);
  box-shadow:inset 0 -4px 0 rgba(0,0,0,.08), 0 10px 18px rgba(35,72,92,.1);
}

.mrtb-rhythm-game-title strong{
  font-size:24px;
  font-weight:1000;
}

.mrtb-rhythm-game-title span{
  font-size:13px;
  font-weight:900;
  color:#536178;
}

.mrtb-rhythm-game-level-menu{
  margin-top:14px !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
}

.mrtb-rhythm-game-progress{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:8px 0 12px;
}

.mrtb-rhythm-game-progress b{
  padding:7px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.9);
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.08);
  font-size:12px;
  font-weight:1000;
  cursor:pointer;
}

.mrtb-rhythm-game-progress b.active{
  background:linear-gradient(180deg,#ffe078,#ffb433);
}

.mrtb-rhythm-game-teams{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  align-items:start;
}

.mrtb-rhythm-game-card{
  min-height:520px;
  border-width:3px !important;
  overflow:visible !important;
}

.mrtb-rhythm-game-card.team-a{
  background:linear-gradient(180deg,rgba(240,249,255,.96),rgba(224,243,255,.96)) !important;
  border-color:rgba(70,151,255,.35) !important;
}

.mrtb-rhythm-game-card.team-b{
  background:linear-gradient(180deg,rgba(255,246,250,.96),rgba(255,232,241,.96)) !important;
  border-color:rgba(255,107,154,.35) !important;
}

.mrtb-rhythm-game-card.correct{
  outline:5px solid rgba(50,201,114,.32);
}

.mrtb-rhythm-game-card.wrong{
  outline:5px solid rgba(255,95,95,.28);
}

.mrtb-rhythm-game-measure{
  display:grid;
  grid-template-columns:52px 38px minmax(0,1fr);
  align-items:center;
  gap:8px;
  min-height:132px;
  margin:10px 0;
  padding:10px;
  border-radius:22px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.94),rgba(247,251,255,.9));
  box-shadow:inset 0 -4px 0 rgba(0,0,0,.05), 0 8px 16px rgba(35,72,92,.09);
  overflow:auto;
}

.mrtb-rhythm-game-clef{
  font-family:"Times New Roman",serif;
  font-size:62px;
  line-height:1;
  text-align:center;
  color:#20263a;
}

.mrtb-rhythm-game-time{
  display:grid;
  justify-items:center;
  font-size:32px;
  line-height:.82;
  font-weight:1000;
  color:#20263a;
}

.mrtb-rhythm-game-staffline{
  position:relative;
  min-height:94px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-left:3px solid rgba(38,48,68,.65);
  border-right:3px solid rgba(38,48,68,.38);
  background:
    linear-gradient(rgba(38,48,68,.42),rgba(38,48,68,.42)) 0 16px/100% 2px no-repeat,
    linear-gradient(rgba(38,48,68,.42),rgba(38,48,68,.42)) 0 32px/100% 2px no-repeat,
    linear-gradient(rgba(38,48,68,.42),rgba(38,48,68,.42)) 0 48px/100% 2px no-repeat,
    linear-gradient(rgba(38,48,68,.42),rgba(38,48,68,.42)) 0 64px/100% 2px no-repeat,
    linear-gradient(rgba(38,48,68,.42),rgba(38,48,68,.42)) 0 80px/100% 2px no-repeat;
  overflow:auto;
}

.mrtb-rhythm-game-token{
  position:relative;
  min-width:58px;
  min-height:78px;
  display:grid;
  place-items:center;
  text-align:center;
  border-radius:18px;
  background:rgba(255,255,255,.78);
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.07), 0 5px 10px rgba(35,72,92,.08);
  flex:0 0 auto;
  padding:5px;
}

.mrtb-rhythm-game-token .mrtb-value-icon{
  transform:scale(1.25) !important;
}

.mrtb-rhythm-game-token small{
  align-self:end;
  font-size:10px;
  line-height:1;
  font-weight:1000;
  color:#44526b;
}

.mrtb-rhythm-game-token.rest b{
  font-family:"Times New Roman",serif;
  font-size:36px;
  line-height:1;
  color:#1f2535;
}

.mrtb-rhythm-game-dots,
.mrtb-rhythm-game-token .mrtb-rhythm-value-dots{
  position:absolute;
  right:8px;
  top:30px;
  display:flex;
  gap:3px;
}

.mrtb-rhythm-game-dots i,
.mrtb-rhythm-game-token .mrtb-rhythm-value-dots i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#1f2535;
}

.mrtb-rhythm-game-blank{
  min-width:70px;
  min-height:78px;
  display:grid;
  place-items:center;
  border-radius:18px;
  border:3px dashed rgba(255,139,43,.7);
  background:rgba(255,244,212,.82);
  color:#ff8c2b;
  font-size:34px;
  font-weight:1000;
  flex:0 0 auto;
}

.mrtb-rhythm-meter-choices{
  margin-top:10px;
}

.mrtb-rhythm-answer-box{
  margin:10px 0;
  padding:10px;
  border-radius:20px;
  background:rgba(255,255,255,.88);
  border:2px dashed rgba(38,48,68,.15);
}

.mrtb-rhythm-answer-box.over{
  border-color:rgba(255,83,83,.55);
  background:rgba(255,238,238,.9);
}

.mrtb-rhythm-answer-box strong{
  display:block;
  margin-bottom:7px;
  font-size:12px;
  font-weight:1000;
  color:#536178;
}

.mrtb-rhythm-answer-items{
  min-height:86px;
  display:flex;
  gap:8px;
  align-items:center;
  overflow:auto;
}

.mrtb-rhythm-answer-items em{
  color:#7b879a;
  font-size:13px;
  font-weight:900;
  font-style:normal;
}

.mrtb-rhythm-answer-box small{
  display:block;
  margin-top:6px;
  font-size:12px;
  font-weight:1000;
  color:#44526b;
}

.mrtb-rhythm-chip-row{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin-top:8px;
}

.mrtb-rhythm-chip-row button{
  border:0;
  padding:4px;
  border-radius:18px;
  background:linear-gradient(180deg,#fff,#eef6ff);
  box-shadow:inset 0 -4px 0 rgba(0,0,0,.08), 0 5px 10px rgba(35,72,92,.08);
  cursor:pointer;
}

.mrtb-rhythm-chip-row button:hover{
  transform:translateY(-1px);
}

.mrtb-rhythm-chip-row button:disabled{
  opacity:.55;
  cursor:default;
}

.mrtb-rhythm-chip-row .mrtb-rhythm-game-token{
  min-width:0;
  width:100%;
  min-height:66px;
  box-shadow:none;
  background:transparent;
}

.mrtb-rhythm-chip-row .mrtb-rhythm-game-token small{
  font-size:9px;
}

.mrtb-rhythm-answer-actions{
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:9px;
}

@media (max-width:1100px){
  .mrtb-rhythm-game-level-menu{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .mrtb-rhythm-game-teams{
    grid-template-columns:1fr;
  }

  .mrtb-rhythm-game-card{
    min-height:0;
  }
}

@media (max-width:900px){
  .mrtb-rhythm-game-stage{
    left:10px;
    right:10px;
    top:10px;
    padding:9px;
    border-radius:20px;
  }

  .mrtb-rhythm-game-score{
    display:grid !important;
    gap:6px !important;
  }

  .mrtb-rhythm-game-level-menu{
    grid-template-columns:1fr !important;
  }

  .mrtb-rhythm-game-measure{
    grid-template-columns:38px 30px minmax(0,1fr);
    min-height:112px;
    padding:7px;
    gap:5px;
  }

  .mrtb-rhythm-game-clef{
    font-size:48px;
  }

  .mrtb-rhythm-game-time{
    font-size:25px;
  }

  .mrtb-rhythm-game-staffline{
    min-height:82px;
    gap:6px;
    padding:8px;
  }

  .mrtb-rhythm-game-token{
    min-width:50px;
    min-height:68px;
    border-radius:15px;
  }

  .mrtb-rhythm-game-token .mrtb-value-icon{
    transform:scale(1.05) !important;
  }

  .mrtb-rhythm-chip-row{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}


/* =========================================================
   FIX 2026-07-09 · Rhythm Game πραγματικές διορθώσεις
   1) Lv1/Lv3 κρύβουν τη ρυθμική αγωγή (?/?)
   2) Παύσεις ζωγραφισμένες με CSS, όχι Unicode glyphs
   3) Παρεστιγμένα/δυσπαρεστιγμένα δείχνουν τελίτσες πάνω στο token
   4) Result popup μπροστά με κανονική κάρτα νικητή
   ========================================================= */

.mrtb-rhythm-game-measure.hide-signature .mrtb-rhythm-game-time{
  min-height:78px !important;
  border-radius:14px !important;
  background:linear-gradient(180deg,#fff7c2,#ffd76f) !important;
  box-shadow:inset 0 -4px 0 rgba(0,0,0,.10), 0 5px 12px rgba(35,72,92,.10) !important;
}

.mrtb-rhythm-game-measure.hide-signature .mrtb-rhythm-game-time span{
  color:#ff8c2b !important;
  text-shadow:0 2px 0 rgba(255,255,255,.85) !important;
}

/* Οι τελίτσες του rhythm game είναι εξωτερικές για να μη χάνονται μέσα στο μικρό value icon. */
.mrtb-rhythm-game-token{
  overflow:visible !important;
}

.mrtb-rhythm-game-token .mrtb-rhythm-game-dots{
  position:absolute !important;
  right:7px !important;
  top:29px !important;
  display:flex !important;
  gap:3px !important;
  z-index:20 !important;
  pointer-events:none !important;
}

.mrtb-rhythm-chip-row .mrtb-rhythm-game-token .mrtb-rhythm-game-dots{
  right:4px !important;
  top:25px !important;
}

.mrtb-rhythm-game-token .mrtb-rhythm-game-dots i{
  display:block !important;
  width:6px !important;
  height:6px !important;
  border-radius:999px !important;
  background:#1f2535 !important;
  box-shadow:0 1px 0 rgba(255,255,255,.6) !important;
}

/* Παύσεις ζωγραφισμένες με CSS */
.mrtb-rhythm-rest-icon{
  position:relative !important;
  display:block !important;
  width:46px !important;
  height:48px !important;
  margin:0 auto !important;
  color:#1f2535 !important;
  pointer-events:none !important;
}

.mrtb-rhythm-rest-icon i{
  position:absolute !important;
  display:block !important;
  background:#1f2535 !important;
  border-radius:4px !important;
}

/* Ολόκληρη παύση: κρεμασμένη κάτω από γραμμή */
.mrtb-rhythm-rest-icon.rest-whole .r1{
  left:9px !important;
  top:18px !important;
  width:28px !important;
  height:6px !important;
  background:rgba(31,37,53,.72) !important;
}
.mrtb-rhythm-rest-icon.rest-whole .r2{
  left:13px !important;
  top:22px !important;
  width:20px !important;
  height:10px !important;
}

/* Μισή παύση: κάθεται πάνω στη γραμμή */
.mrtb-rhythm-rest-icon.rest-half .r1{
  left:9px !important;
  top:30px !important;
  width:28px !important;
  height:6px !important;
  background:rgba(31,37,53,.72) !important;
}
.mrtb-rhythm-rest-icon.rest-half .r2{
  left:13px !important;
  top:20px !important;
  width:20px !important;
  height:10px !important;
}

/* Τέταρτο: ζικ-ζακ παύση */
.mrtb-rhythm-rest-icon.rest-quarter .r1{
  left:22px !important;
  top:5px !important;
  width:6px !important;
  height:18px !important;
  transform:rotate(-28deg) !important;
}
.mrtb-rhythm-rest-icon.rest-quarter .r2{
  left:17px !important;
  top:18px !important;
  width:6px !important;
  height:18px !important;
  transform:rotate(34deg) !important;
}
.mrtb-rhythm-rest-icon.rest-quarter .r3{
  left:23px !important;
  top:31px !important;
  width:6px !important;
  height:14px !important;
  transform:rotate(-28deg) !important;
}
.mrtb-rhythm-rest-icon.rest-quarter .r4{
  left:17px !important;
  top:38px !important;
  width:13px !important;
  height:7px !important;
  border-radius:999px !important;
}

/* Όγδοο/16ο/32ο/64ο: κορμός με σημαίες */
.mrtb-rhythm-rest-icon.rest-eighth .r1,
.mrtb-rhythm-rest-icon.rest-sixteenth .r1,
.mrtb-rhythm-rest-icon.rest-thirtysecond .r1,
.mrtb-rhythm-rest-icon.rest-sixtyfourth .r1{
  left:24px !important;
  top:6px !important;
  width:5px !important;
  height:39px !important;
  transform:rotate(13deg) !important;
}

.mrtb-rhythm-rest-icon.rest-eighth .r2,
.mrtb-rhythm-rest-icon.rest-sixteenth .r2,
.mrtb-rhythm-rest-icon.rest-thirtysecond .r2,
.mrtb-rhythm-rest-icon.rest-sixtyfourth .r2,
.mrtb-rhythm-rest-icon.rest-sixteenth .r3,
.mrtb-rhythm-rest-icon.rest-thirtysecond .r3,
.mrtb-rhythm-rest-icon.rest-sixtyfourth .r3,
.mrtb-rhythm-rest-icon.rest-thirtysecond .r4,
.mrtb-rhythm-rest-icon.rest-sixtyfourth .r4{
  left:11px !important;
  width:20px !important;
  height:7px !important;
  border-radius:999px 2px 999px 999px !important;
  transform:rotate(-22deg) !important;
}

.mrtb-rhythm-rest-icon.rest-eighth .r2,
.mrtb-rhythm-rest-icon.rest-sixteenth .r2,
.mrtb-rhythm-rest-icon.rest-thirtysecond .r2,
.mrtb-rhythm-rest-icon.rest-sixtyfourth .r2{
  top:10px !important;
}

.mrtb-rhythm-rest-icon.rest-sixteenth .r3,
.mrtb-rhythm-rest-icon.rest-thirtysecond .r3,
.mrtb-rhythm-rest-icon.rest-sixtyfourth .r3{
  top:20px !important;
}

.mrtb-rhythm-rest-icon.rest-thirtysecond .r4,
.mrtb-rhythm-rest-icon.rest-sixtyfourth .r4{
  top:30px !important;
}

/* Η 64η θέλει έξτρα μικρή σημαία, τη δίνουμε με after. */
.mrtb-rhythm-rest-icon.rest-sixtyfourth::after{
  content:"" !important;
  position:absolute !important;
  left:11px !important;
  top:39px !important;
  width:20px !important;
  height:7px !important;
  border-radius:999px 2px 999px 999px !important;
  background:#1f2535 !important;
  transform:rotate(-22deg) !important;
}

/* Μέσα στα μικρά επιλογής τα σύμβολα είναι λίγο πιο μαζεμένα */
.mrtb-rhythm-chip-row .mrtb-rhythm-rest-icon{
  transform:scale(.82) !important;
  transform-origin:center center !important;
}

/* Result popup για rhythm: ακυρώνει το παλιό display:none του rhythm template. */
.mrtb-app[data-scene="rhythm"].mrtb-rhythm-game-mode .mrtb-game-result,
.mrtb-app[data-scene="rhythm"].mrtb-rhythm-game-mode .mrtb-rhythm-game-result{
  position:absolute !important;
  inset:0 !important;
  z-index:99999 !important;
  display:grid !important;
  place-items:center !important;
  padding:24px !important;
  background:rgba(45,120,180,.24) !important;
  backdrop-filter:blur(7px) !important;
  pointer-events:auto !important;
}

.mrtb-app[data-scene="rhythm"].mrtb-rhythm-game-mode .mrtb-game-fx{
  display:block !important;
  z-index:100000 !important;
}

.mrtb-rhythm-result-card,
.mrtb-app[data-scene="rhythm"].mrtb-rhythm-game-mode .mrtb-game-result-card{
  position:relative !important;
  z-index:100001 !important;
  width:min(560px, calc(100% - 36px)) !important;
  max-height:calc(100% - 48px) !important;
  overflow:auto !important;
  padding:28px 26px 24px !important;
  border-radius:30px !important;
  text-align:center !important;
  background:linear-gradient(180deg,#fff,#eef7ff) !important;
  border:4px solid rgba(255,255,255,.96) !important;
  box-shadow:0 22px 55px rgba(28,57,93,.30), inset 0 -7px 0 rgba(0,0,0,.08) !important;
  color:#263044 !important;
  animation:mrtb-result-pop .28s cubic-bezier(.2,1.35,.35,1) both !important;
}

.mrtb-rhythm-result-card.team-a{
  outline:6px solid rgba(70,151,255,.28) !important;
}

.mrtb-rhythm-result-card.team-b{
  outline:6px solid rgba(255,107,154,.28) !important;
}

.mrtb-rhythm-result-card.draw{
  outline:6px solid rgba(255,184,46,.30) !important;
}

.mrtb-rhythm-result-card h2,
.mrtb-app[data-scene="rhythm"].mrtb-rhythm-game-mode .mrtb-game-result-card h2{
  margin:8px 0 14px !important;
  font-size:34px !important;
  line-height:1.05 !important;
  font-weight:1000 !important;
  color:#263044 !important;
}

.mrtb-rhythm-result-card p{
  margin:8px 0 !important;
  font-size:17px !important;
  font-weight:950 !important;
}

.mrtb-rhythm-result-actions{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:center !important;
  gap:10px !important;
  margin-top:16px !important;
}

.mrtb-rhythm-result-actions .mrtb-btn{
  min-height:38px !important;
  padding:8px 13px !important;
  font-size:14px !important;
}

@media (max-width:900px){
  .mrtb-rhythm-result-card,
  .mrtb-app[data-scene="rhythm"].mrtb-rhythm-game-mode .mrtb-game-result-card{
    padding:20px 16px !important;
    border-radius:24px !important;
  }

  .mrtb-rhythm-result-card h2,
  .mrtb-app[data-scene="rhythm"].mrtb-rhythm-game-mode .mrtb-game-result-card h2{
    font-size:24px !important;
  }
}


/* ===== FINAL FIX καθαρές μουσικές παύσεις rhythm game ===== */

.mrtb-rhythm-game-token.rest{
  position:relative !important;
  min-width:58px !important;
  min-height:82px !important;
  padding:4px 5px 5px !important;
  overflow:visible !important;
}

.mrtb-rhythm-game-token.rest b,
.mrtb-rhythm-rest-icon{
  display:none !important;
}

.mrtb-rhythm-rest-glyph{
  position:absolute !important;
  left:50% !important;
  top:4px !important;
  width:44px !important;
  height:64px !important;
  transform:translateX(-50%) !important;
  display:block !important;
  pointer-events:none !important;
  z-index:6 !important;
}

.mrtb-rhythm-rest-glyph svg{
  width:100% !important;
  height:100% !important;
  display:block !important;
  overflow:visible !important;
}

.mrtb-rest-fill{
  fill:#1f2535 !important;
}

.mrtb-rest-stroke,
.mrtb-rest-stem-line,
.mrtb-rest-hook-stroke{
  fill:none !important;
  stroke:#1f2535 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

.mrtb-rest-stem-line{
  stroke-width:4.6 !important;
}

.mrtb-rest-hook-stroke{
  stroke-width:4.4 !important;
}

.mrtb-rest-stroke.quarter-rest{
  stroke-width:6.4 !important;
}

/* ολόκληρη / μισή */
.mrtb-rhythm-game-token.rest.r-whole .mrtb-rhythm-rest-glyph,
.mrtb-rhythm-game-token.rest.r-half .mrtb-rhythm-rest-glyph{
  top:8px !important;
  width:42px !important;
  height:56px !important;
}

/* τέταρτο */
.mrtb-rhythm-game-token.rest.r-quarter .mrtb-rhythm-rest-glyph{
  top:3px !important;
  width:42px !important;
  height:66px !important;
}

/* 8ο / 16ο / 32ο / 64ο */
.mrtb-rhythm-game-token.rest.r-eighth .mrtb-rhythm-rest-glyph,
.mrtb-rhythm-game-token.rest.r-sixteenth .mrtb-rhythm-rest-glyph,
.mrtb-rhythm-game-token.rest.r-thirtysecond .mrtb-rhythm-rest-glyph,
.mrtb-rhythm-game-token.rest.r-sixtyfourth .mrtb-rhythm-rest-glyph{
  top:2px !important;
  width:42px !important;
  height:66px !important;
}

/* τελίτσες παρεστιγμένης παύσης δεξιά */
.mrtb-rhythm-game-token.rest .mrtb-rhythm-game-dots{
  position:absolute !important;
  right:2px !important;
  top:34px !important;
  display:flex !important;
  gap:4px !important;
  z-index:20 !important;
}

.mrtb-rhythm-game-token.rest .mrtb-rhythm-game-dots i{
  width:6px !important;
  height:6px !important;
  border-radius:50% !important;
  background:#1f2535 !important;
}

/* στα κουμπιά επιλογής μικρότερες */
.mrtb-rhythm-chip-row .mrtb-rhythm-game-token.rest{
  min-height:68px !important;
}

.mrtb-rhythm-chip-row .mrtb-rhythm-rest-glyph{
  width:36px !important;
  height:54px !important;
  top:3px !important;
}

.mrtb-rhythm-chip-row .mrtb-rest-stem-line{
  stroke-width:4.5 !important;
}

.mrtb-rhythm-chip-row .mrtb-rest-hook-stroke{
  stroke-width:4.3 !important;
}

.mrtb-rhythm-chip-row .mrtb-rest-stroke.quarter-rest{
  stroke-width:6.2 !important;
}

/* =========================================================
   FIX · Rhythm lesson notation ίδιο geometry με Template 1
   Βάλ' το στο ΤΕΛΟΣ του mrtb-rhythm.css
   ========================================================= */

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-row,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-mini-staff{
  height:240px !important;
  min-height:240px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-mini-lines{
  top:30px !important;
  height:168px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-mini-lines i{
  height:2px !important;
  background:rgba(20,25,40,.86) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-mini-lines i:nth-child(1){ top:0 !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-mini-lines i:nth-child(2){ top:42px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-mini-lines i:nth-child(3){ top:84px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-mini-lines i:nth-child(4){ top:126px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-mini-lines i:nth-child(5){ top:168px !important; }

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-empty{
  top:30px !important;
  height:168px !important;
}

/* Η rhythm νότα παίρνει ακριβώς το ίδιο 96x96 σύστημα του note input. */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-board-note{
  width:96px !important;
  height:96px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  filter:none !important;
  padding:0 !important;
  z-index:30 !important;
  pointer-events:auto !important;
  transform:none !important;
  transform-origin:48px 48px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-hitbox{
  position:absolute !important;
  left:23px !important;
  top:24px !important;
  width:52px !important;
  height:44px !important;
  border-radius:999px !important;
  pointer-events:auto !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph{
  position:absolute !important;
  left:27px !important;
  top:16px !important;
  width:56px !important;
  height:58px !important;
  pointer-events:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-head{
  position:absolute !important;
  left:8px !important;
  top:20px !important;
  width:34px !important;
  height:23px !important;
  border:3px solid #1f2535 !important;
  border-radius:50% !important;
  transform:rotate(-18deg) !important;
  background:#1f2535 !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.open .mrtb-note-head{
  background:#fff !important;
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.6) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.whole .mrtb-note-head{
  left:7px !important;
  top:20px !important;
  width:38px !important;
  height:24px !important;
  border-width:4px !important;
  background:#fff !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-stem{
  position:absolute !important;
  width:4px !important;
  height:64px !important;
  background:#1f2535 !important;
  border-radius:5px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-stem{
  left:40px !important;
  top:-21px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-stem{
  left:8px !important;
  top:33px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-beamed-note .mrtb-note-glyph.stem-up .mrtb-stem,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-beamed-note .mrtb-note-glyph.stem-down .mrtb-stem{
  top:var(--stem-top, -21px) !important;
  height:var(--stem-h, 64px) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.whole .mrtb-stem{
  display:none !important;
}

/* Ουρίτσες ίδιες με Template 1: όχι έξτρα περίεργη γραμμή. */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-flag{
  position:absolute !important;
  width:27px !important;
  height:20px !important;
  background:transparent !important;
  border-top:0 !important;
  border-left:0 !important;
  border-right:4px solid #1f2535 !important;
  border-bottom:4px solid #1f2535 !important;
  border-radius:0 15px 15px 0 !important;
  transform:skewY(24deg) !important;
  pointer-events:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f1{ left:41px !important; top:-21px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f2{ left:41px !important; top:-7px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f3{ left:41px !important; top:7px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f4{ left:41px !important; top:21px !important; }

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag{
  left:-15px !important;
  border-right:0 !important;
  border-left:4px solid #1f2535 !important;
  border-bottom:4px solid #1f2535 !important;
  border-radius:15px 0 0 15px !important;
  transform:skewY(-24deg) rotate(180deg) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f1{ top:78px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f2{ top:64px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f3{ top:50px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f4{ top:36px !important; }

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.whole .mrtb-flag,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.half .mrtb-flag,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.quarter .mrtb-flag{ display:none !important; }

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.eighth .mrtb-flag.f2,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.eighth .mrtb-flag.f3,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.eighth .mrtb-flag.f4{ display:none !important; }

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.sixteenth .mrtb-flag.f3,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.sixteenth .mrtb-flag.f4{ display:none !important; }

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.thirtysecond .mrtb-flag.f4{ display:none !important; }

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-beamed-note .mrtb-flag{ display:none !important; }

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-beam{
  position:absolute !important;
  z-index:31 !important;
  height:6px !important;
  background:#1f2535 !important;
  border-radius:2px !important;
  pointer-events:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-ledgers{
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  width:96px !important;
  height:240px !important;
  pointer-events:none !important;
  z-index:1 !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-ledgers span{
  left:16px !important;
  width:64px !important;
  height:3px !important;
  background:rgba(20,25,40,.86) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note-dots{
  left:50px !important;
  top:29px !important;
  gap:4px !important;
  z-index:8 !important;
}

/* ===== FINAL CLEAN FIX: rhythm game notes με SVG, όχι παλιά CSS flags ===== */

.mrtb-rhythm-game-token.note{
  position:relative !important;
  min-width:62px !important;
  min-height:84px !important;
  padding:4px 5px 5px !important;
  overflow:visible !important;
}

/* κρύβει το παλιό σύστημα αν έχει μείνει από cache/παλιά markup */
.mrtb-rhythm-game-token.note > .mrtb-value-icon,
.mrtb-rhythm-game-token.note .mrtb-rhythm-game-note-glyph{
  display:none !important;
}

.mrtb-rhythm-game-note-svg-wrap{
  position:absolute !important;
  left:50% !important;
  top:0 !important;
  width:62px !important;
  height:72px !important;
  transform:translateX(-50%) !important;
  pointer-events:none !important;
  z-index:10 !important;
}

.mrtb-rhythm-note-svg{
  display:block !important;
  width:100% !important;
  height:100% !important;
  overflow:visible !important;
}

.mrtb-rhythm-note-svg-head{
  stroke:#1f2535 !important;
  stroke-width:4px !important;
}

.mrtb-rhythm-note-svg-head.filled{
  fill:#1f2535 !important;
}

.mrtb-rhythm-note-svg-head.open{
  fill:#ffffff !important;
}

.mrtb-rhythm-note-svg-stem{
  stroke:#1f2535 !important;
  stroke-width:5px !important;
  stroke-linecap:round !important;
}

.mrtb-rhythm-note-svg-flag{
  fill:none !important;
  stroke:#1f2535 !important;
  stroke-width:5.4px !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

/* τελίτσες δίπλα στην κεφαλή */
.mrtb-rhythm-game-token.note .mrtb-rhythm-game-dots{
  position:absolute !important;
  right:3px !important;
  top:30px !important;
  display:flex !important;
  gap:4px !important;
  z-index:30 !important;
}

.mrtb-rhythm-game-token.note .mrtb-rhythm-game-dots i{
  width:6px !important;
  height:6px !important;
  border-radius:50% !important;
  background:#1f2535 !important;
}

/* στα μικρά κουμπιά επιλογής */
.mrtb-rhythm-chip-row .mrtb-rhythm-game-token.note{
  min-height:70px !important;
}

.mrtb-rhythm-chip-row .mrtb-rhythm-game-note-svg-wrap{
  width:52px !important;
  height:60px !important;
  top:0 !important;
}

.mrtb-rhythm-chip-row .mrtb-rhythm-note-svg-stem{
  stroke-width:4.6px !important;
}

.mrtb-rhythm-chip-row .mrtb-rhythm-note-svg-flag{
  stroke-width:4.8px !important;
}

/* =========================================================
   FINAL CLEAN FIX · rhythm flags / beams / rhythm game notes
   Βάλ' το στο ΤΕΛΟΣ του assets/css/mrtb-rhythm.css.
   Κλειδώνει το rhythm template στο ίδιο notation geometry με το template Νότες.
   ========================================================= */

/* Το παιχνίδι ρυθμικής δεν πρέπει να σπάει από τα free-template overrides. */
.mrtb-rhythm-game-token.note{
  overflow:visible !important;
}

.mrtb-rhythm-game-note-svg-wrap{
  overflow:visible !important;
}

.mrtb-rhythm-note-svg{
  display:block !important;
  width:100% !important;
  height:100% !important;
  overflow:visible !important;
}

.mrtb-rhythm-note-svg-head{
  stroke:#1f2535 !important;
  stroke-width:4px !important;
}

.mrtb-rhythm-note-svg-head.filled{ fill:#1f2535 !important; }
.mrtb-rhythm-note-svg-head.open{ fill:#fff !important; }

.mrtb-rhythm-note-svg-stem{
  stroke:#1f2535 !important;
  stroke-width:5px !important;
  stroke-linecap:round !important;
}

.mrtb-rhythm-note-svg-flag{
  fill:none !important;
  stroke:#1f2535 !important;
  stroke-width:5.4px !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

/* Free rhythm template: πραγματική νότα όπως στο template Νότες. */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-board-note{
  width:96px !important;
  height:96px !important;
  overflow:visible !important;
  transform:none !important;
  background:transparent !important;
  box-shadow:none !important;
  filter:none !important;
  border:0 !important;
  padding:0 !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph{
  left:27px !important;
  top:16px !important;
  width:56px !important;
  height:58px !important;
  pointer-events:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-head{
  left:8px !important;
  top:20px !important;
  width:34px !important;
  height:23px !important;
  border:3px solid #1f2535 !important;
  border-radius:50% !important;
  transform:rotate(-18deg) !important;
  background:#1f2535 !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.open .mrtb-note-head{
  background:#fff !important;
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.6) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.whole .mrtb-note-head{
  left:7px !important;
  top:20px !important;
  width:38px !important;
  height:24px !important;
  border-width:4px !important;
  background:#fff !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-stem{
  position:absolute !important;
  width:4px !important;
  height:64px !important;
  background:#1f2535 !important;
  border-radius:5px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-stem{
  left:40px !important;
  top:var(--stem-top, -21px) !important;
  height:var(--stem-h, 64px) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-stem{
  left:8px !important;
  top:var(--stem-top, 33px) !important;
  height:var(--stem-h, 64px) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.whole .mrtb-stem{
  display:none !important;
}

/* Ουρίτσες: ίδιο πλήθος και σωστή φορά.
   stem-up = δεξιά/προς τα κάτω, stem-down = αριστερά/προς τα πάνω. */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-flag{
  position:absolute !important;
  width:27px !important;
  height:20px !important;
  background:transparent !important;
  pointer-events:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag{
  left:41px !important;
  border:0 !important;
  border-right:4px solid #1f2535 !important;
  border-bottom:4px solid #1f2535 !important;
  border-radius:0 15px 15px 0 !important;
  transform:skewY(24deg) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f1{ top:-21px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f2{ top:-7px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f3{ top:7px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f4{ top:21px !important; }

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag{
  left:-15px !important;
  border:0 !important;
  border-left:4px solid #1f2535 !important;
  border-top:4px solid #1f2535 !important;
  border-radius:15px 0 0 0 !important;
  transform:skewY(-24deg) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f1{ top:77px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f2{ top:63px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f3{ top:49px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f4{ top:35px !important; }

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.whole .mrtb-flag,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.half .mrtb-flag,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.quarter .mrtb-flag{
  display:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.eighth .mrtb-flag.f2,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.eighth .mrtb-flag.f3,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.eighth .mrtb-flag.f4{
  display:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.sixteenth .mrtb-flag.f3,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.sixteenth .mrtb-flag.f4{
  display:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.thirtysecond .mrtb-flag.f4{
  display:none !important;
}

/* Σε beams οι ουρίτσες κρύβονται και μένει μόνο το beam. */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-beamed-note .mrtb-flag{
  display:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-beam{
  position:absolute !important;
  z-index:31 !important;
  height:6px !important;
  background:#1f2535 !important;
  border-radius:2px !important;
  transform-origin:0 50% !important;
  pointer-events:none !important;
}

/* =========================================================
   MR Theory Board - Rhythm lesson final tails fix
   ΒΑΛ' ΤΟ ΣΤΟ ΤΕΛΟΣ του assets/css/mrtb-rhythm.css
   ΜΟΝΟ για το μάθημα Ρυθμική Αγωγή.
   ========================================================= */

/* stem-up: stem πάνω δεξιά από τη νότα -> ουρές δεξιά και προς τα κάτω */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag{
  left:41px !important;
  width:30px !important;
  height:18px !important;
  border:0 !important;
  border-top:5px solid #1f2535 !important;
  border-radius:0 18px 16px 0 !important;
  background:transparent !important;
  transform-origin:left top !important;
  transform:rotate(24deg) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f1{ top:-21px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f2{ top:-8px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f3{ top:5px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-up .mrtb-flag.f4{ top:18px !important; }

/* stem-down: stem κάτω αριστερά από τη νότα -> ουρές δεξιά και προς τα πάνω */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag{
  left:10px !important;
  width:30px !important;
  height:18px !important;
  border:0 !important;
  border-top:5px solid #1f2535 !important;
  border-radius:0 18px 16px 0 !important;
  background:transparent !important;
  transform-origin:left bottom !important;
  transform:rotate(-24deg) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f1{ top:78px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f2{ top:64px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f3{ top:50px !important; }
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.stem-down .mrtb-flag.f4{ top:36px !important; }

/* σωστό πλήθος ουρών ανά αξία */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.whole .mrtb-flag,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.half .mrtb-flag,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.quarter .mrtb-flag{
  display:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.eighth .mrtb-flag.f2,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.eighth .mrtb-flag.f3,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.eighth .mrtb-flag.f4{
  display:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.sixteenth .mrtb-flag.f3,
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.sixteenth .mrtb-flag.f4{
  display:none !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note .mrtb-note-glyph.thirtysecond .mrtb-flag.f4{
  display:none !important;
}

/* όταν υπάρχει beam, δεν θέλουμε ξεχωριστές ουρές */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-beamed-note .mrtb-flag{
  display:none !important;
}

/* =========================================================
   MR Theory Board - Rhythm lesson layout + free signature fix
   Βάλ' το στο ΤΕΛΟΣ του assets/css/mrtb-rhythm.css
   ========================================================= */

/* μεγαλύτερο layout για τη ρυθμική αγωγή */
.mrtb-app[data-scene="rhythm"]{
  min-height:820px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-scene{
  grid-template-rows:auto auto minmax(0,1fr) auto !important;
}

/* custom editor ρυθμικής αγωγής */
.mrtb-rhythm-sig-box{
  display:grid !important;
  gap:4px !important;
}

.mrtb-rhythm-sig-box b{
  font-size:10px !important;
  font-weight:1000 !important;
  color:#526079 !important;
  text-transform:uppercase !important;
  letter-spacing:.4px !important;
}

.mrtb-rhythm-sig-editor{
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
  min-height:32px !important;
  padding:4px 8px !important;
  border-radius:12px !important;
  background:rgba(255,255,255,.95) !important;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.1), 0 5px 12px rgba(47,72,94,.12) !important;
}

.mrtb-rhythm-sig-editor input{
  width:56px !important;
  min-width:56px !important;
  height:24px !important;
  border:0 !important;
  border-radius:8px !important;
  text-align:center !important;
  font:inherit !important;
  font-size:15px !important;
  font-weight:1000 !important;
  color:#243044 !important;
  background:rgba(235,244,255,.95) !important;
  box-shadow:inset 0 0 0 2px rgba(70,151,255,.16) !important;
}

.mrtb-rhythm-sig-editor span{
  font-size:18px !important;
  line-height:1 !important;
  font-weight:1000 !important;
  color:#243044 !important;
}

/* μεγάλο πεντάγραμμο και πιο κεντραρισμένο περιεχόμενο */
.mrtb-rhythm-paper{
  padding:14px !important;
  min-height:430px !important;
}

.mrtb-rhythm-measures{
  min-height:390px !important;
  padding:10px 0 10px 0 !important;
  justify-content:center !important;
}

.mrtb-rhythm-measure{
  flex:0 0 calc(100% - 8px) !important;
  min-width:calc(100% - 8px) !important;
  min-height:372px !important;
  padding:10px 16px 38px !important;
}

.mrtb-rhythm-measure-top{
  min-height:54px !important;
}

.mrtb-rhythm-note-row{
  min-height:230px !important;
  height:230px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
}

.mrtb-rhythm-mini-staff{
  position:relative !important;
  width:max(100%, var(--staff-w, 980px)) !important;
  min-width:max(100%, var(--staff-w, 980px)) !important;
  height:190px !important;
  min-height:190px !important;
  margin:0 auto !important;
}

/* κλειδί + ρυθμική αγωγή μέσα στο πεντάγραμμο */
.mrtb-rhythm-clef,
.mrtb-rhythm-time{
  display:none !important;
}

.mrtb-rhythm-staff-prefix{
  position:absolute !important;
  left:10px !important;
  top:0 !important;
  width:120px !important;
  height:190px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:12px !important;
  pointer-events:none !important;
  z-index:8 !important;
}

.mrtb-rhythm-staff-clef{
  font-family:"Times New Roman",serif !important;
  font-size:88px !important;
  line-height:1 !important;
  color:#20263a !important;
}

.mrtb-rhythm-staff-time{
  display:grid !important;
  place-items:center !important;
  font-size:46px !important;
  line-height:.8 !important;
  font-weight:1000 !important;
  color:#20263a !important;
}

/* οι γραμμές παραμένουν στο ίδιο μουσικό ύψος, αλλά με περισσότερο οπτικό χώρο */
.mrtb-rhythm-mini-lines{
  top:30px !important;
  height:108px !important;
}

/* πιο μεγάλες νότες και περισσότερο καθαρό κεντράρισμα */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-board-note{
  transform:scale(.92) !important;
  transform-origin:32px 34px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-empty-centered{
  left:150px !important;
  right:24px !important;
  top:32px !important;
  height:108px !important;
}

/* αν μπουν πολλές νότες, να ανοίγει το staff και να μη στριμώχνονται */
.mrtb-rhythm-note-row::-webkit-scrollbar,
.mrtb-rhythm-measures::-webkit-scrollbar{
  height:10px;
}

.mrtb-rhythm-note-row::-webkit-scrollbar-thumb,
.mrtb-rhythm-measures::-webkit-scrollbar-thumb{
  background:rgba(36,48,68,.22);
  border-radius:999px;
}

@media (max-width:1100px){
  .mrtb-app[data-scene="rhythm"]{
    min-height:860px !important;
  }

  .mrtb-rhythm-note-row{
    min-height:210px !important;
    height:210px !important;
  }

  .mrtb-rhythm-mini-staff{
    min-width:max(100%, var(--staff-w, 900px)) !important;
  }

  .mrtb-rhythm-staff-prefix{
    width:106px !important;
  }

  .mrtb-rhythm-staff-clef{
    font-size:76px !important;
  }

  .mrtb-rhythm-staff-time{
    font-size:38px !important;
  }
}

@media (max-width:900px){
  .mrtb-rhythm-hero{
    display:grid !important;
  }

  .mrtb-rhythm-controls{
    justify-content:flex-start !important;
  }

  .mrtb-rhythm-paper{
    min-height:400px !important;
  }

  .mrtb-rhythm-measure{
    min-height:340px !important;
  }

  .mrtb-rhythm-note-row{
    min-height:195px !important;
    height:195px !important;
  }

  .mrtb-rhythm-mini-staff{
    min-width:max(100%, var(--staff-w, 840px)) !important;
    height:180px !important;
    min-height:180px !important;
  }

  .mrtb-rhythm-staff-prefix{
    width:96px !important;
    height:180px !important;
  }

  .mrtb-rhythm-staff-clef{
    font-size:66px !important;
  }

  .mrtb-rhythm-staff-time{
    font-size:32px !important;
  }
}


/* ===== Rhythm lesson μεγάλο πεντάγραμμο + κλειδί/μέτρο μέσα ===== */

.mrtb-app[data-scene="rhythm"]{
  min-height:820px !important;
}

.mrtb-rhythm-sig-box{
  display:grid !important;
  gap:4px !important;
}

.mrtb-rhythm-sig-editor{
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
  min-height:32px !important;
  padding:4px 8px !important;
  border-radius:12px !important;
  background:rgba(255,255,255,.95) !important;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.1), 0 5px 12px rgba(47,72,94,.12) !important;
}

.mrtb-rhythm-sig-editor input{
  width:56px !important;
  min-width:56px !important;
  height:24px !important;
  border:0 !important;
  border-radius:8px !important;
  text-align:center !important;
  font:inherit !important;
  font-size:15px !important;
  font-weight:1000 !important;
  color:#243044 !important;
  background:rgba(235,244,255,.95) !important;
}

.mrtb-rhythm-sig-editor span{
  font-size:18px !important;
  line-height:1 !important;
  font-weight:1000 !important;
  color:#243044 !important;
}

.mrtb-rhythm-paper{
  padding:14px !important;
  min-height:430px !important;
}

.mrtb-rhythm-clef,
.mrtb-rhythm-time{
  display:none !important;
}

.mrtb-rhythm-measures{
  min-height:390px !important;
  padding:10px 0 !important;
  justify-content:center !important;
}

.mrtb-rhythm-measure{
  flex:0 0 calc(100% - 8px) !important;
  min-width:calc(100% - 8px) !important;
  min-height:372px !important;
  padding:10px 16px 38px !important;
}

.mrtb-rhythm-note-row{
  min-height:230px !important;
  height:230px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
}

.mrtb-rhythm-mini-staff{
  position:relative !important;
  width:max(100%, var(--staff-w, 980px)) !important;
  min-width:max(100%, var(--staff-w, 980px)) !important;
  height:190px !important;
  min-height:190px !important;
  margin:0 auto !important;
}

.mrtb-rhythm-staff-prefix{
  position:absolute !important;
  left:10px !important;
  top:0 !important;
  width:130px !important;
  height:190px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:12px !important;
  pointer-events:none !important;
  z-index:8 !important;
}

.mrtb-rhythm-staff-clef{
  font-family:"Times New Roman",serif !important;
  font-size:88px !important;
  line-height:1 !important;
  color:#20263a !important;
}

.mrtb-rhythm-staff-time{
  display:grid !important;
  place-items:center !important;
  font-size:46px !important;
  line-height:.8 !important;
  font-weight:1000 !important;
  color:#20263a !important;
}

.mrtb-rhythm-mini-lines{
  top:30px !important;
  height:108px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-board-note{
  transform:scale(.92) !important;
  transform-origin:32px 34px !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-empty-centered{
  left:150px !important;
  right:24px !important;
  top:32px !important;
  height:108px !important;
}
.mrtb-rhythm-beam-box{
  display:grid !important;
  gap:4px !important;
}

.mrtb-rhythm-beam-box b{
  font-size:10px !important;
  font-weight:1000 !important;
  color:#526079 !important;
  text-transform:uppercase !important;
  letter-spacing:.4px !important;
}

.mrtb-rhythm-beam-box input{
  width:104px !important;
  min-width:104px !important;
  height:32px !important;
  border:0 !important;
  border-radius:10px !important;
  padding:4px 8px !important;
  text-align:center !important;
  font:inherit !important;
  font-size:13px !important;
  font-weight:1000 !important;
  color:#243044 !important;
  background:rgba(235,244,255,.95) !important;
  box-shadow:inset 0 0 0 2px rgba(70,151,255,.16), inset 0 -3px 0 rgba(0,0,0,.08) !important;
}

/* =========================================================
   MR Theory Board · Rhythm lesson counting show/hide
   Μέτρημα κάτω από τις νότες, σύμφωνα με παρονομαστή και γκρουπάρισμα.
   ========================================================= */

.mrtb-rhythm-count-box{
  display:grid !important;
  gap:4px !important;
}

.mrtb-rhythm-count-box b{
  font-size:10px !important;
  font-weight:1000 !important;
  color:#526079 !important;
  text-transform:uppercase !important;
  letter-spacing:.4px !important;
}

.mrtb-rhythm-count-box button{
  width:78px !important;
  min-width:78px !important;
  height:32px !important;
  border:0 !important;
  border-radius:10px !important;
  padding:4px 8px !important;
  text-align:center !important;
  font:inherit !important;
  font-size:12px !important;
  font-weight:1000 !important;
  color:#243044 !important;
  background:linear-gradient(180deg,#ffffff,#eaf4ff) !important;
  box-shadow:inset 0 0 0 2px rgba(70,151,255,.16), inset 0 -3px 0 rgba(0,0,0,.08), 0 5px 12px rgba(47,72,94,.12) !important;
  cursor:pointer !important;
  pointer-events:auto !important;
}

.mrtb-rhythm-count-box button.active{
  background:linear-gradient(180deg,#fff48b,#ffc44d) !important;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.14), 0 0 0 3px rgba(255,196,77,.25), 0 5px 12px rgba(47,72,94,.12) !important;
}

.mrtb-rhythm-count-row{
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:150px !important;
  height:34px !important;
  z-index:40 !important;
  pointer-events:none !important;
}

.mrtb-rhythm-count-token{
  position:absolute !important;
  top:0 !important;
  min-width:26px !important;
  height:26px !important;
  padding:0 7px !important;
  display:grid !important;
  place-items:center !important;
  transform:translateX(-50%) !important;
  border-radius:999px !important;
  border:2px solid rgba(255,165,46,.65) !important;
  background:rgba(255,250,212,.96) !important;
  color:#263044 !important;
  font-size:15px !important;
  line-height:1 !important;
  font-weight:1000 !important;
  box-shadow:0 6px 12px rgba(36,48,68,.10), inset 0 -2px 0 rgba(0,0,0,.08) !important;
  white-space:nowrap !important;
}

.mrtb-rhythm-count-token.group-start{
  border-color:rgba(70,151,255,.62) !important;
  background:linear-gradient(180deg,#eaf6ff,#cde9ff) !important;
}

.mrtb-rhythm-count-token.and,
.mrtb-rhythm-count-token.sub{
  min-width:22px !important;
  height:22px !important;
  top:2px !important;
  font-size:13px !important;
  background:rgba(255,255,255,.94) !important;
}

.mrtb-rhythm-count-token.tiny{
  opacity:.45 !important;
  min-width:18px !important;
  height:18px !important;
  top:4px !important;
  font-size:12px !important;
}

@media (max-width:900px){
  .mrtb-rhythm-count-box button{
    width:70px !important;
    min-width:70px !important;
    font-size:11px !important;
  }

  .mrtb-rhythm-count-row{
    top:146px !important;
  }

  .mrtb-rhythm-count-token{
    min-width:23px !important;
    height:23px !important;
    font-size:13px !important;
    padding:0 5px !important;
  }
}


/* =========================================================
   FULL FIX · Rhythm game κανονική σημειογραφία, beams, grouping
   Lv1/Lv3: κρυμμένη ρυθμική αγωγή (?/?) και σωστά beams.
   Lv2/Lv4: οι απαντήσεις μπαίνουν πάνω στο πεντάγραμμο.
   ========================================================= */

.mrtb-rhythm-game-notation{
  position:relative !important;
  width:100% !important;
  min-height:218px !important;
  overflow:hidden !important;
  border-radius:30px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,250,255,.96)) !important;
  border:2px solid rgba(255,255,255,.96) !important;
  box-shadow:0 14px 28px rgba(35,72,92,.12), inset 0 -5px 0 rgba(0,0,0,.045) !important;
  margin:10px 0 14px !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff{
  transform:scale(.80) !important;
  transform-origin:left top !important;
  margin:2px 0 -20px -100px !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-note,
.mrtb-rhythm-game-notation .mrtb-board-note{
  pointer-events:none !important;
  cursor:default !important;
}

.mrtb-rhythm-game-notation .mrtb-note-hitbox{
  pointer-events:none !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-empty,
.mrtb-rhythm-game-notation .mrtb-rhythm-note-caption,
.mrtb-rhythm-game-notation .mrtb-rhythm-note-value{
  display:none !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-staff-prefix{
  left:18px !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-staff-clef{
  font-size:96px !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-staff-time{
  font-size:50px !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-staff-time.hidden-answer{
  min-width:58px !important;
  padding:3px 5px !important;
  border-radius:14px !important;
  background:linear-gradient(180deg,#fff6bd,#ffd05a) !important;
  box-shadow:inset 0 -4px 0 rgba(0,0,0,.12), 0 7px 14px rgba(35,72,92,.12) !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-staff-time.hidden-answer span{
  color:#ff8c2b !important;
  text-shadow:0 2px 0 rgba(255,255,255,.9) !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-board-note{
  transform:scale(1.04) !important;
  transform-origin:32px 34px !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-beam{
  height:7px !important;
  border-radius:3px !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-mini-lines i{
  background:rgba(20,25,40,.78) !important;
  height:2.5px !important;
}

.mrtb-rhythm-game-notation-blank{
  position:absolute !important;
  left:calc(50% + 190px) !important;
  top:68px !important;
  z-index:80 !important;
  width:72px !important;
  height:74px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:18px !important;
  border:4px dashed rgba(255,139,43,.72) !important;
  background:rgba(255,244,212,.86) !important;
  color:#ff8c2b !important;
  font-size:38px !important;
  line-height:1 !important;
  font-weight:1000 !important;
  box-shadow:0 8px 16px rgba(35,72,92,.10) !important;
  pointer-events:none !important;
}

.mrtb-rhythm-complete-wrap.over-answer .mrtb-rhythm-game-notation{
  outline:5px solid rgba(255,95,95,.32) !important;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,238,238,.96)) !important;
}

.mrtb-rhythm-meter-choices{
  margin-top:16px !important;
}

.mrtb-rhythm-meter-choices .mrtb-game-choice{
  min-height:44px !important;
  border-radius:18px !important;
  font-size:18px !important;
  box-shadow:inset 0 -5px 0 rgba(0,0,0,.10), 0 8px 16px rgba(35,72,92,.12) !important;
}

.mrtb-rhythm-chip-row{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:8px !important;
}

.mrtb-rhythm-chip-row button{
  min-height:88px !important;
}

.mrtb-rhythm-answer-box{
  display:none !important;
}

@media (max-width:1200px){
  .mrtb-rhythm-game-notation{
    min-height:190px !important;
  }

  .mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff{
    transform:scale(.70) !important;
    margin:0 0 -38px -140px !important;
  }

  .mrtb-rhythm-chip-row{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

@media (max-width:900px){
  .mrtb-rhythm-game-notation{
    min-height:158px !important;
    border-radius:22px !important;
  }

  .mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff{
    transform:scale(.56) !important;
    margin:0 0 -62px -218px !important;
  }

  .mrtb-rhythm-game-notation-blank{
    left:calc(50% + 94px) !important;
    top:52px !important;
    width:56px !important;
    height:58px !important;
    font-size:30px !important;
  }

  .mrtb-rhythm-meter-choices .mrtb-game-choice{
    min-height:38px !important;
    font-size:15px !important;
  }

  .mrtb-rhythm-chip-row{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}


/* =========================================================
   FIX · Δεν κόβει νότες/γκρουπ εκτός οθόνης στο game ρυθμικής
   Το πρόβλημα ήταν το μεγάλο negative margin στο scaled πεντάγραμμο.
   Τώρα χωράνε καθαρά 9/8 και 12/8, και η σωστή επιλογή 9/8 μένει διαθέσιμη.
   ========================================================= */

.mrtb-rhythm-game-notation{
  min-height:230px !important;
  overflow:visible !important;
  padding:4px 10px 10px !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff{
  transform:scale(.66) !important;
  transform-origin:left top !important;
  margin:10px 0 -56px 0 !important;
  left:auto !important;
  right:auto !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-staff-prefix{
  left:12px !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-staff-clef,
.mrtb-rhythm-game-notation .mrtb-rhythm-staff-time{
  opacity:1 !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-note,
.mrtb-rhythm-game-notation .mrtb-board-note,
.mrtb-rhythm-game-notation .mrtb-rhythm-beam{
  visibility:visible !important;
}

/* Λίγο πιο μαζεμένα τα cards για να μη γίνεται οριζόντιο clipping σε 9/8/12/8 */
.mrtb-rhythm-game-card{
  overflow:visible !important;
}

.mrtb-rhythm-game-teams{
  overflow:visible !important;
}

.mrtb-rhythm-game-stage{
  overflow:visible !important;
}

@media (max-width:1400px){
  .mrtb-rhythm-game-notation{
    min-height:210px !important;
  }

  .mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff{
    transform:scale(.60) !important;
    margin:8px 0 -68px 0 !important;
  }
}

@media (max-width:1100px){
  .mrtb-rhythm-game-notation{
    min-height:190px !important;
  }

  .mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff{
    transform:scale(.52) !important;
    margin:6px 0 -84px 0 !important;
  }
}

@media (max-width:900px){
  .mrtb-rhythm-game-notation{
    min-height:160px !important;
    padding:2px 6px 8px !important;
  }

  .mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff{
    transform:scale(.44) !important;
    margin:4px 0 -108px 0 !important;
  }
}

/* =========================================================
   FIX · Rhythm game notation να χωράει μέσα σε κάθε ομάδα
   ========================================================= */

.mrtb-rhythm-game-notation{
  position:relative !important;
  width:100% !important;
  min-width:0 !important;
  overflow:hidden !important;
  padding:0 12px !important;
  box-sizing:border-box !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff{
  position:relative !important;

  width:156% !important;
  min-width:156% !important;

  transform:scale(.64) !important;
  transform-origin:left top !important;

  margin:8px 0 -70px 0 !important;
  left:0 !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-staff-prefix{
  left:8px !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-board-note{
  transform:scale(.92) !important;
  transform-origin:32px 34px !important;
}

/* Λίγο μικρότερο όταν υπάρχουν πολλές νότες */
.mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff[style*="1100px"],
.mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff[style*="1200px"],
.mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff[style*="1300px"],
.mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff[style*="1400px"]{
  width:182% !important;
  min-width:182% !important;
  transform:scale(.55) !important;
  margin-bottom:-88px !important;
}

/* Rhythm game: το JS υπολογίζει αυτόματα το σωστό scale */

.mrtb-rhythm-game-notation{
  position:relative !important;
  width:100% !important;
  min-width:0 !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
  padding:0 14px !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff{
  position:relative !important;
  left:0 !important;
  margin-left:0 !important;
  transform-origin:left top !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-note,
.mrtb-rhythm-game-notation .mrtb-rhythm-beam{
  visibility:visible !important;
  opacity:1 !important;
}

/* =========================
   RHYTHM GAME FIXES
   ========================= */

.mrtb-rhythm-note-row,
.mrtb-rhythm-game-notation,
.mrtb-rhythm-complete-wrap,
.mrtb-rhythm-game-card,
.mrtb-rhythm-paper{
  overflow: visible !important;
}

.mrtb-rhythm-game-notation{
  width: 100%;
  min-width: 0;
}

.mrtb-rhythm-mini-staff{
  width: var(--staff-w);
  min-width: var(--staff-w);
  overflow: visible !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff{
  margin-left: 0 !important;
}

.mrtb-single-flag-note .mrtb-note-glyph .mrtb-flag{
  transform-origin: left top !important;
}

/* stem-down μονές flagged νότες */
.mrtb-single-flag-note .mrtb-note-glyph.eighth.stem-down .mrtb-flag.f1{
  left: 8px !important;
  top: 31px !important;
}

.mrtb-single-flag-note .mrtb-note-glyph.sixteenth.stem-down .mrtb-flag.f1{
  left: 8px !important;
  top: 31px !important;
}
.mrtb-single-flag-note .mrtb-note-glyph.sixteenth.stem-down .mrtb-flag.f2{
  left: 8px !important;
  top: 40px !important;
}

.mrtb-single-flag-note .mrtb-note-glyph.thirtysecond.stem-down .mrtb-flag.f1{
  left: 8px !important;
  top: 31px !important;
}
.mrtb-single-flag-note .mrtb-note-glyph.thirtysecond.stem-down .mrtb-flag.f2{
  left: 8px !important;
  top: 40px !important;
}
.mrtb-single-flag-note .mrtb-note-glyph.thirtysecond.stem-down .mrtb-flag.f3{
  left: 8px !important;
  top: 49px !important;
}

.mrtb-single-flag-note .mrtb-note-glyph.sixtyfourth.stem-down .mrtb-flag.f1{
  left: 8px !important;
  top: 31px !important;
}
.mrtb-single-flag-note .mrtb-note-glyph.sixtyfourth.stem-down .mrtb-flag.f2{
  left: 8px !important;
  top: 40px !important;
}
.mrtb-single-flag-note .mrtb-note-glyph.sixtyfourth.stem-down .mrtb-flag.f3{
  left: 8px !important;
  top: 49px !important;
}
.mrtb-single-flag-note .mrtb-note-glyph.sixtyfourth.stem-down .mrtb-flag.f4{
  left: 8px !important;
  top: 58px !important;
}

/* stem-up μονές flagged νότες */
.mrtb-single-flag-note .mrtb-note-glyph.eighth.stem-up .mrtb-flag.f1{
  left: 42px !important;
  top: -6px !important;
}

.mrtb-single-flag-note .mrtb-note-glyph.sixteenth.stem-up .mrtb-flag.f1{
  left: 42px !important;
  top: -6px !important;
}
.mrtb-single-flag-note .mrtb-note-glyph.sixteenth.stem-up .mrtb-flag.f2{
  left: 42px !important;
  top: 3px !important;
}

.mrtb-single-flag-note .mrtb-note-glyph.thirtysecond.stem-up .mrtb-flag.f1{
  left: 42px !important;
  top: -6px !important;
}
.mrtb-single-flag-note .mrtb-note-glyph.thirtysecond.stem-up .mrtb-flag.f2{
  left: 42px !important;
  top: 3px !important;
}
.mrtb-single-flag-note .mrtb-note-glyph.thirtysecond.stem-up .mrtb-flag.f3{
  left: 42px !important;
  top: 12px !important;
}

.mrtb-single-flag-note .mrtb-note-glyph.sixtyfourth.stem-up .mrtb-flag.f1{
  left: 42px !important;
  top: -6px !important;
}
.mrtb-single-flag-note .mrtb-note-glyph.sixtyfourth.stem-up .mrtb-flag.f2{
  left: 42px !important;
  top: 3px !important;
}
.mrtb-single-flag-note .mrtb-note-glyph.sixtyfourth.stem-up .mrtb-flag.f3{
  left: 42px !important;
  top: 12px !important;
}
.mrtb-single-flag-note .mrtb-note-glyph.sixtyfourth.stem-up .mrtb-flag.f4{
  left: 42px !important;
  top: 21px !important;
}
/* =========================================================
   FINAL FIX · compact rhythm game + staff fits white window
   ========================================================= */

.mrtb-rhythm-game-notation{
  position:relative !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  padding:8px 12px !important;
  overflow:hidden !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-mini-staff{
  position:relative !important;
  left:0 !important;
  right:auto !important;
  max-width:none !important;
  margin:0 !important;
  transform-origin:left top !important;
  overflow:visible !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-mini-lines{
  left:0 !important;
  right:0 !important;
  width:auto !important;
}

.mrtb-rhythm-game-notation .mrtb-rhythm-note,
.mrtb-rhythm-game-notation .mrtb-board-note,
.mrtb-rhythm-game-notation .mrtb-rhythm-beam{
  visibility:visible !important;
  opacity:1 !important;
}

/*
 * Το περιεχόμενο δεν επιτρέπεται να βγει έξω από
 * το λευκό παραθυράκι της κάθε ομάδας.
 */
.mrtb-rhythm-game-card,
.mrtb-rhythm-complete-wrap{
  max-width:100% !important;
  min-width:0 !important;
}

@media (max-width:900px){
  .mrtb-rhythm-game-notation{
    padding:6px 8px !important;
  }
}
/* =========================================================
   FINAL FIX · single flagged notes
   Η ουρίτσα ξεκινάει ακριβώς από την άκρη του stem
   ========================================================= */

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-flag,
.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-flag{
  position:absolute !important;
  width:30px !important;
  height:18px !important;
  background:transparent !important;
  border:0 !important;
  border-top:5px solid #1f2535 !important;
  border-radius:0 18px 16px 0 !important;
  pointer-events:none !important;
}

/* stem-up:
   η ουρίτσα ξεκινάει από την κορυφή του stem */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-up .mrtb-flag,
.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-up .mrtb-flag{
  left:41px !important;
  transform-origin:left top !important;
  transform:rotate(24deg) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-up .mrtb-flag.f1,
.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-up .mrtb-flag.f1{
  top:var(--stem-top, -21px) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-up .mrtb-flag.f2,
.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-up .mrtb-flag.f2{
  top:calc(var(--stem-top, -21px) + 14px) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-up .mrtb-flag.f3,
.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-up .mrtb-flag.f3{
  top:calc(var(--stem-top, -21px) + 28px) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-up .mrtb-flag.f4,
.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-up .mrtb-flag.f4{
  top:calc(var(--stem-top, -21px) + 42px) !important;
}

/* stem-down:
   η ουρίτσα ξεκινάει από το ΚΑΤΩ άκρο του stem */
.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-down .mrtb-flag,
.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-down .mrtb-flag{
  left:10px !important;
  transform-origin:left bottom !important;
  transform:rotate(-24deg) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-down .mrtb-flag.f1,
.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-down .mrtb-flag.f1{
  top:calc(var(--stem-top, 33px) + var(--stem-h, 64px) - 18px) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-down .mrtb-flag.f2,
.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-down .mrtb-flag.f2{
  top:calc(var(--stem-top, 33px) + var(--stem-h, 64px) - 32px) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-down .mrtb-flag.f3,
.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-down .mrtb-flag.f3{
  top:calc(var(--stem-top, 33px) + var(--stem-h, 64px) - 46px) !important;
}

.mrtb-app[data-scene="rhythm"] .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-down .mrtb-flag.f4,
.mrtb-rhythm-game-notation .mrtb-rhythm-note.mrtb-single-flag-note .mrtb-note-glyph.stem-down .mrtb-flag.f4{
  top:calc(var(--stem-top, 33px) + var(--stem-h, 64px) - 60px) !important;
}