/* =========================================================
   MR Theory Board · Θεωρία 2 · Κεφάλαιο 3
   Εύρεση στις κλίμακες
   Πραγματικό αρχείο server: assets/css/fysikes-triads.css
   ========================================================= */

.mrtb-app[data-scene="t2-triads-in-scales"]{
  --ft-ink:#263044;
  --ft-muted:#65738a;
  --ft-line:#263044;
  --ft-blue:#4b91ff;
  --ft-cyan:#37c9d8;
  --ft-major:#ffb829;
  --ft-minor:#7c83ff;
  --ft-dim:#ff6b8a;
  --ft-card:#ffffff;
  --ft-border:rgba(38,48,68,.13);
}

/* ---------- Κρατάμε μόνο τα χρήσιμα εργαλεία ---------- */

.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-values-section,
.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-mini-piano,
.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-staff,
.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-board-note,
.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-note-beam,
.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-board-tuplet,
.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-chord-stem-link,
.mrtb-app[data-scene="t2-triads-in-scales"] [data-action="tool-note"],
.mrtb-app[data-scene="t2-triads-in-scales"] [data-action="tool-delete"],
.mrtb-app[data-scene="t2-triads-in-scales"] [data-action="delete-selected"],
.mrtb-app[data-scene="t2-triads-in-scales"] [data-action="select-multi"],
.mrtb-app[data-scene="t2-triads-in-scales"] [data-action="toggle-value-labels"],
.mrtb-app[data-scene="t2-triads-in-scales"] [data-action="toggle-note-labels"],
.mrtb-app[data-scene="t2-triads-in-scales"] [data-action="staff-treble"],
.mrtb-app[data-scene="t2-triads-in-scales"] [data-action="staff-bass"],
.mrtb-app[data-scene="t2-triads-in-scales"] [data-action="add-staff"]{
  display:none !important;
}

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

.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-tools-one-line{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:5px !important;
}

.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-board-wrap{
  background:
    radial-gradient(circle at 12% 7%,rgba(255,255,255,.9) 0 42px,transparent 44px),
    radial-gradient(circle at 90% 10%,rgba(255,255,255,.68) 0 58px,transparent 60px),
    linear-gradient(90deg,rgba(255,255,255,.20) 1px,transparent 1px) 0 0/42px 42px,
    linear-gradient(0deg,rgba(255,255,255,.20) 1px,transparent 1px) 0 0/42px 42px,
    linear-gradient(180deg,#9fe6ff 0%,#d9f7ff 47%,#dff4b4 100%) !important;
}

.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-board{
  overflow:auto !important;
  padding:0 !important;
}

.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-scroll-spacer{
  min-height:980px !important;
}

/* ---------- Draw canvas πάνω από ολόκληρη τη σκηνή ---------- */

.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-draw-canvas{
  z-index:40 !important;
}

.mrtb-app[data-scene="t2-triads-in-scales"]:not(.mrtb-draw-on) .mrtb-draw-canvas{
  pointer-events:none !important;
}

.mrtb-app[data-scene="t2-triads-in-scales"].mrtb-draw-on .mrtb-draw-canvas{
  pointer-events:auto !important;
  cursor:crosshair !important;
}

/* ---------- Κεντρική σκηνή ---------- */

.mrtb-fysikes-triads-scene{
  position:absolute;
  z-index:8;
  top:12px;
  left:12px;
  width:calc(100% - 24px);
  min-width:980px;
  box-sizing:border-box;
  color:var(--ft-ink);
  font-family:inherit;
}

.mrtb-ft-navigation{
  display:grid;
  grid-template-columns:minmax(225px,.72fr) minmax(620px,2fr);
  align-items:center;
  gap:14px;
  margin-bottom:12px;
  padding:11px 13px;
  border:1px solid rgba(255,255,255,.78);
  border-radius:20px;
  background:rgba(255,255,255,.83);
  box-shadow:0 12px 34px rgba(45,89,112,.13);
  backdrop-filter:blur(10px);
}

.mrtb-ft-chapter-title{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}

.mrtb-ft-chapter-title span{
  color:#66809a;
  font-size:11px;
  line-height:1.1;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.mrtb-ft-chapter-title strong{
  overflow:hidden;
  color:var(--ft-ink);
  font-size:20px;
  line-height:1.15;
  font-weight:1000;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mrtb-ft-tabs{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px;
}

.mrtb-ft-tabs button{
  display:grid;
  grid-template-columns:34px 1fr;
  align-items:center;
  gap:8px;
  min-width:0;
  min-height:44px;
  padding:5px 9px 5px 6px;
  border:1px solid rgba(38,48,68,.10);
  border-radius:14px;
  color:#536178;
  background:linear-gradient(180deg,#fff,#edf4fb);
  box-shadow:inset 0 -2px 0 rgba(38,48,68,.07),0 4px 10px rgba(55,86,105,.08);
  cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}

.mrtb-ft-tabs button:hover{
  transform:translateY(-1px);
  border-color:rgba(75,145,255,.34);
  box-shadow:0 8px 18px rgba(55,86,105,.13);
}

.mrtb-ft-tabs button b{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:11px;
  color:#5b6c83;
  background:#e7eef7;
  font-size:15px;
  font-weight:1000;
}

.mrtb-ft-tabs button span{
  overflow:hidden;
  font-size:12px;
  line-height:1.15;
  font-weight:950;
  text-align:left;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mrtb-ft-tabs button.active{
  color:#fff;
  border-color:transparent;
  background:linear-gradient(135deg,#438cff,#46c8dc);
  box-shadow:0 10px 23px rgba(55,132,216,.27);
}

.mrtb-ft-tabs button.active b{
  color:#276aa7;
  background:#fff;
}

.mrtb-ft-page{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.mrtb-ft-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  align-items:center;
  gap:18px;
  padding:17px 19px;
  border:1px solid rgba(255,255,255,.78);
  border-radius:23px;
  background:rgba(255,255,255,.90);
  box-shadow:0 14px 38px rgba(44,86,108,.13);
}

.mrtb-ft-hero.spelling{
  grid-template-columns:minmax(0,1fr) auto;
}

.mrtb-ft-kicker{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:3px 10px;
  border-radius:999px;
  color:#236b98;
  background:#dff6ff;
  font-size:11px;
  font-weight:1000;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.mrtb-ft-hero h2{
  margin:7px 0 5px;
  color:var(--ft-ink);
  font-size:25px;
  line-height:1.08;
  font-weight:1000;
}

.mrtb-ft-hero p{
  margin:0;
  color:#5b6980;
  font-size:13px;
  line-height:1.46;
  font-weight:700;
}

.mrtb-ft-rule-band{
  display:flex;
  align-items:center;
  gap:10px;
  padding:13px 16px;
  border:1px solid rgba(75,145,255,.20);
  border-radius:18px;
  background:linear-gradient(145deg,#ecf6ff,#fffef0);
  box-shadow:0 12px 28px rgba(44,86,108,.10);
}

.mrtb-ft-rule-band span{
  display:inline-grid;
  place-items:center;
  min-width:88px;
  min-height:34px;
  padding:0 12px;
  border-radius:999px;
  color:#246aa8;
  background:#dff4ff;
  font-size:12px;
  font-weight:1000;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.mrtb-ft-rule-band strong{
  color:#2e394d;
  font-size:16px;
  line-height:1.25;
  font-weight:1000;
}

.mrtb-ft-staff-card{
  overflow:hidden;
  border:1px solid var(--ft-border);
  border-radius:23px;
  background:rgba(255,255,255,.94);
  box-shadow:0 14px 38px rgba(44,86,108,.14);
}

.mrtb-ft-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:52px;
  padding:10px 15px;
  border-bottom:1px solid rgba(38,48,68,.09);
  background:linear-gradient(180deg,#fff,#f2f8fd);
}

.mrtb-ft-card-head > div{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.mrtb-ft-card-head b{
  color:#303b50;
  font-size:14px;
  line-height:1.2;
  font-weight:1000;
}

.mrtb-ft-card-head span{
  color:#6d7a8f;
  font-size:11px;
  line-height:1.25;
  font-weight:750;
}

.mrtb-ft-listen-all,
.mrtb-ft-play-scale{
  min-height:38px;
  padding:7px 14px;
  border:0;
  border-radius:13px;
  color:#fff;
  background:linear-gradient(135deg,#4b91ff,#34c6d9);
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.10),0 8px 16px rgba(66,136,215,.22);
  font-size:12px;
  line-height:1;
  font-weight:1000;
  cursor:pointer;
}

.mrtb-ft-play-scale{
  min-height:44px;
  padding-inline:18px;
  white-space:nowrap;
}

.mrtb-ft-svg-scroll{
  overflow-x:auto;
  overflow-y:hidden;
  width:100%;
  -webkit-overflow-scrolling:touch;
}

.mrtb-ft-chords-svg,
.mrtb-ft-spelling-svg,
.mrtb-ft-finding-svg{
  display:block;
  width:100%;
  min-width:1040px;
  height:auto;
  background:
    linear-gradient(180deg,rgba(255,255,255,.82),rgba(246,251,255,.94));
}

.mrtb-ft-staff-line{
  stroke:var(--ft-line);
  stroke-width:3;
  opacity:.9;
}

.mrtb-ft-ledger{
  stroke:var(--ft-line);
  stroke-width:3;
  stroke-linecap:round;
}

.mrtb-ft-clef-wrap{
  pointer-events:none;
}

.mrtb-ft-clef{
  fill:#1f2939;
  font-family:"Apple Symbols","Noto Music","Segoe UI Symbol","Arial Unicode MS",serif;
  font-size:132px;
  font-style:normal;
  font-weight:400;
  font-variant:normal;
  letter-spacing:0;
  text-rendering:geometricPrecision;
}

@supports (-webkit-touch-callout:none){
  .mrtb-ft-clef{
    font-family:"Apple Symbols","Noto Music","Segoe UI Symbol",serif;
    font-weight:400;
  }
}

.mrtb-ft-note-head{
  fill:#39455a;
  stroke:#1f2939;
  stroke-width:3.5;
}

.mrtb-ft-note-head.major{ fill:var(--ft-major); }
.mrtb-ft-note-head.minor{ fill:var(--ft-minor); }
.mrtb-ft-note-head.diminished{ fill:var(--ft-dim); }

.mrtb-ft-note-head.root{
  fill:#ffcf3c;
  stroke:#20283a;
  stroke-width:4.5;
}

.mrtb-ft-chord-stem,
.mrtb-ft-scale-stem{
  stroke:#20283a;
  stroke-width:5;
  stroke-linecap:round;
}

.mrtb-ft-chord-hover{
  fill:transparent;
  stroke:transparent;
  stroke-width:2;
  transition:fill .16s ease,stroke .16s ease;
}

.mrtb-ft-chord-group{
  cursor:pointer;
  outline:none;
}

.mrtb-ft-chord-group:hover .mrtb-ft-chord-hover,
.mrtb-ft-chord-group:focus .mrtb-ft-chord-hover{
  fill:rgba(75,145,255,.07);
  stroke:rgba(75,145,255,.22);
}

.mrtb-ft-degree{
  font-size:23px;
  font-weight:1000;
}

.mrtb-ft-degree.major{fill:#ce8400;}
.mrtb-ft-degree.minor{fill:#5e65d8;}
.mrtb-ft-degree.diminished{fill:#d34368;}

.mrtb-ft-symbol{
  fill:#263044;
  font-size:21px;
  font-weight:1000;
}

.mrtb-ft-quality{
  fill:#637086;
  font-size:13px;
  font-weight:900;
}

.mrtb-ft-note-spelling{
  fill:#8994a5;
  font-size:12px;
  font-weight:850;
}

.mrtb-ft-summary-title{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:10px;
  padding:0 4px;
}

.mrtb-ft-summary-title span{
  color:#344056;
  font-size:15px;
  font-weight:1000;
}

.mrtb-ft-summary-title small{
  color:#6d7a8f;
  font-size:11px;
  font-weight:800;
}

.mrtb-ft-summary-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1.12fr;
  gap:10px;
}

.mrtb-ft-summary-grid article{
  display:grid;
  grid-template-columns:52px 1fr;
  align-items:center;
  gap:11px;
  min-height:118px;
  padding:13px;
  border:1px solid rgba(38,48,68,.10);
  border-radius:20px;
  background:rgba(255,255,255,.92);
  box-shadow:0 10px 28px rgba(44,86,108,.11);
}

.mrtb-ft-summary-grid article.major{ background:linear-gradient(145deg,#fff9dd,#fff); }
.mrtb-ft-summary-grid article.minor{ background:linear-gradient(145deg,#eeefff,#fff); }
.mrtb-ft-summary-grid article.diminished{ background:linear-gradient(145deg,#ffe9ef,#fff); }

.mrtb-ft-summary-icon{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border-radius:16px;
  color:#fff;
  font-size:23px;
  line-height:1;
  font-weight:1000;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.10),0 7px 15px rgba(38,48,68,.14);
}

.mrtb-ft-summary-grid article.major .mrtb-ft-summary-icon{ background:linear-gradient(135deg,#ffbe29,#ff9242); }
.mrtb-ft-summary-grid article.minor .mrtb-ft-summary-icon{ background:linear-gradient(135deg,#7f86ff,#5f66e0); }
.mrtb-ft-summary-grid article.diminished .mrtb-ft-summary-icon{ background:linear-gradient(135deg,#ff7998,#e04b74); }

.mrtb-ft-summary-grid span{
  display:block;
  margin-bottom:3px;
  color:#617086;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.mrtb-ft-summary-grid strong{
  display:block;
  margin-bottom:5px;
  color:#2c3648;
  font-size:18px;
  font-weight:1000;
}

.mrtb-ft-summary-grid p{
  margin:0 0 3px;
  color:#4d5a6d;
  font-size:14px;
  line-height:1.3;
  font-weight:850;
}

.mrtb-ft-summary-grid small{
  color:#8390a1;
  font-size:11px;
  line-height:1.35;
  font-weight:780;
}

.mrtb-ft-spelling-formulas{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.mrtb-ft-spelling-formulas article{
  padding:14px 16px;
  border:1px solid rgba(38,48,68,.10);
  border-radius:19px;
  background:rgba(255,255,255,.92);
  box-shadow:0 10px 28px rgba(44,86,108,.11);
}

.mrtb-ft-spelling-formulas span{
  display:block;
  margin-bottom:6px;
  color:#66748b;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.mrtb-ft-spelling-formulas strong{
  color:#2f3a4e;
  font-size:21px;
  line-height:1.22;
  font-weight:1000;
}

.mrtb-ft-root-anchor{ fill:#243247; }
.mrtb-ft-root-label{ fill:#4d5b70; font-size:14px; font-weight:950; }
.mrtb-ft-arrow-head{ fill:#30b6d8; }

.mrtb-ft-interval-arc{
  fill:none;
  stroke:#30b6d8;
  stroke-width:4;
  stroke-linecap:round;
}

.mrtb-ft-interval-pill{
  fill:#ffffff;
  stroke:rgba(38,48,68,.12);
  stroke-width:1.5;
}

.mrtb-ft-interval-label{ fill:#236a97; font-size:15px; font-weight:1000; }
.mrtb-ft-scale-letter{ fill:#273247; font-size:17px; font-weight:1000; }
.mrtb-ft-scale-greek{ fill:#8190a4; font-size:12px; font-weight:850; }

.mrtb-ft-scale-summary{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.mrtb-ft-scale-summary > div{
  padding:14px 16px;
  border:1px solid rgba(38,48,68,.10);
  border-radius:18px;
  background:rgba(255,255,255,.92);
  box-shadow:0 10px 28px rgba(44,86,108,.10);
}

.mrtb-ft-scale-summary span{
  display:block;
  margin-bottom:5px;
  color:#647288;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.mrtb-ft-scale-summary strong{
  color:#2d384b;
  font-size:20px;
  line-height:1.22;
  font-weight:1000;
}

.mrtb-ft-scale-summary.ionian > div:first-child{ background:linear-gradient(145deg,#eef7ff,#fff); }
.mrtb-ft-scale-summary.ionian > div:last-child{ background:linear-gradient(145deg,#fffdf1,#fff); }
.mrtb-ft-scale-summary.aeolian > div:first-child{ background:linear-gradient(145deg,#f3f0ff,#fff); }
.mrtb-ft-scale-summary.aeolian > div:last-child{ background:linear-gradient(145deg,#fff0f4,#fff); }

/* ---------- 4η σκηνή ---------- */

.mrtb-ft-find-box{
  stroke-width:2;
}

.mrtb-ft-find-node.blue .mrtb-ft-find-box{
  fill:#eef6ff;
  stroke:#a9c8ff;
}

.mrtb-ft-find-node.cyan .mrtb-ft-find-box{
  fill:#effcff;
  stroke:#9fddea;
}

.mrtb-ft-find-node.gold .mrtb-ft-find-box{
  fill:#fff9ea;
  stroke:#f2d589;
}

.mrtb-ft-find-degree-bubble{
  fill:#ffffff;
  stroke:#d7e6f3;
  stroke-width:2;
}

.mrtb-ft-find-degree-text{ fill:#2b3b51; font-size:18px; font-weight:1000; }
.mrtb-ft-find-title{ fill:#253247; font-size:24px; font-weight:1000; }
.mrtb-ft-find-subtitle{ fill:#728299; font-size:14px; font-weight:850; }
.mrtb-ft-find-notes{ fill:#2f3b4f; font-size:15px; font-weight:900; }
.mrtb-ft-find-explainer{ fill:#68778d; font-size:13px; font-weight:850; }

.mrtb-ft-find-arrow{
  fill:none;
  stroke:#6cc3df;
  stroke-width:4;
  stroke-linecap:round;
}

.mrtb-ft-find-arrow-pill{
  stroke:none;
}

.mrtb-ft-find-arrow-pill.blue{ fill:#4b91ff; }
.mrtb-ft-find-arrow-pill.cyan{ fill:#39c9da; }
.mrtb-ft-find-arrow-pill.gold{ fill:#ffbf37; }
.mrtb-ft-find-arrow-text{ fill:#ffffff; font-size:16px; font-weight:1000; }

.mrtb-ft-find-target-box{
  fill:#fffaf0;
  stroke:#ffd770;
  stroke-width:2.5;
}

.mrtb-ft-find-target-badge{
  fill:#ffc933;
  stroke:#273045;
  stroke-width:3;
}

.mrtb-ft-find-target-badge-text{ fill:#273045; font-size:24px; font-weight:1000; }
.mrtb-ft-find-target-title{ fill:#263044; font-size:32px; font-weight:1000; }
.mrtb-ft-find-target-subtitle{ fill:#536178; font-size:18px; font-weight:900; }
.mrtb-ft-find-target-caption{ fill:#76869a; font-size:14px; font-weight:850; }

.mrtb-ft-finding-points{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.mrtb-ft-finding-points article{
  display:grid;
  grid-template-columns:48px 1fr;
  gap:12px;
  align-items:flex-start;
  min-height:122px;
  padding:14px;
  border:1px solid rgba(38,48,68,.10);
  border-radius:20px;
  background:rgba(255,255,255,.93);
  box-shadow:0 10px 28px rgba(44,86,108,.10);
}

.mrtb-ft-finding-points article span{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  border-radius:15px;
  color:#fff;
  background:linear-gradient(135deg,#4b91ff,#34c6d9);
  font-size:22px;
  font-weight:1000;
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.10);
}

.mrtb-ft-finding-points strong{
  display:block;
  margin-bottom:4px;
  color:#2d384b;
  font-size:16px;
  line-height:1.25;
  font-weight:1000;
}

.mrtb-ft-finding-points p{
  margin:0;
  color:#607088;
  font-size:13px;
  line-height:1.42;
  font-weight:800;
}

/* ---------- Footer ---------- */

.mrtb-ft-footer-nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-top:12px;
  padding:11px 14px;
  border:1px solid rgba(255,255,255,.78);
  border-radius:18px;
  background:rgba(255,255,255,.86);
  box-shadow:0 10px 24px rgba(44,86,108,.10);
}

.mrtb-ft-footer-nav span{
  color:#536178;
  font-size:13px;
  font-weight:1000;
}

.mrtb-ft-footer-nav button{
  min-height:40px;
  padding:8px 16px;
  border:0;
  border-radius:13px;
  color:#fff;
  background:linear-gradient(135deg,#4b91ff,#34c6d9);
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.10),0 8px 16px rgba(66,136,215,.18);
  font-size:12px;
  line-height:1;
  font-weight:1000;
  cursor:pointer;
}

.mrtb-ft-footer-nav button[disabled]{
  opacity:.42;
  cursor:not-allowed;
  box-shadow:none;
}

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

@media (max-width:1200px){
  .mrtb-ft-navigation{
    grid-template-columns:1fr;
  }

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

@media (max-width:980px){
  .mrtb-fysikes-triads-scene{
    min-width:0;
  }

  .mrtb-ft-hero.spelling,
  .mrtb-ft-summary-grid,
  .mrtb-ft-spelling-formulas,
  .mrtb-ft-scale-summary,
  .mrtb-ft-finding-points{
    grid-template-columns:1fr;
  }

  .mrtb-ft-card-head{
    flex-direction:column;
    align-items:flex-start;
  }
}


.mrtb-ft-rule-band.reverse{
  background:linear-gradient(145deg,#fff8e8,#eefaff);
}

.mrtb-ft-reverse-svg{
  display:block;
  width:100%;
  min-width:1120px;
  height:auto;
  background:linear-gradient(180deg,rgba(255,255,255,.84),rgba(248,252,255,.95));
}

.mrtb-ft-reverse-target-box{
  fill:#fffaf0;
  stroke:#ffd770;
  stroke-width:2.5;
}

.mrtb-ft-reverse-target-badge{
  fill:#ffc933;
  stroke:#273045;
  stroke-width:3;
}

.mrtb-ft-reverse-target-badge-text{ fill:#273045; font-size:24px; font-weight:1000; }
.mrtb-ft-reverse-target-title{ fill:#263044; font-size:32px; font-weight:1000; }
.mrtb-ft-reverse-target-subtitle{ fill:#536178; font-size:18px; font-weight:900; }
.mrtb-ft-reverse-target-caption{ fill:#76869a; font-size:14px; font-weight:850; }

.mrtb-ft-reverse-arrow{
  fill:none;
  stroke:#6cc3df;
  stroke-width:4;
  stroke-linecap:round;
}

.mrtb-ft-reverse-pill.blue{ fill:#4b91ff; }
.mrtb-ft-reverse-pill.cyan{ fill:#39c9da; }
.mrtb-ft-reverse-pill.gold{ fill:#ffbf37; }
.mrtb-ft-reverse-pill-text{ fill:#fff; font-size:16px; font-weight:1000; }

.mrtb-ft-reverse-node-box{
  stroke-width:2;
}

.mrtb-ft-reverse-node.blue .mrtb-ft-reverse-node-box{ fill:#eef6ff; stroke:#a9c8ff; }
.mrtb-ft-reverse-node.cyan .mrtb-ft-reverse-node-box{ fill:#effcff; stroke:#9fddea; }
.mrtb-ft-reverse-node.gold .mrtb-ft-reverse-node-box{ fill:#fff9ea; stroke:#f2d589; }

.mrtb-ft-reverse-node-title{ fill:#263044; font-size:23px; font-weight:1000; }
.mrtb-ft-reverse-node-subtitle{ fill:#58677d; font-size:15px; font-weight:850; }
.mrtb-ft-reverse-node-count{ fill:#2381b4; font-size:19px; font-weight:1000; }
.mrtb-ft-reverse-node-answer{ fill:#57667c; font-size:15px; font-weight:900; }

.mrtb-ft-finding-points.reverse-points article span{
  width:auto;
  min-width:48px;
  padding:0 10px;
  font-size:18px;
}


.mrtb-ft-scale-lanes{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.mrtb-ft-scale-lane{
  padding:14px;
  border:1px solid rgba(38,48,68,.10);
  border-radius:22px;
  background:rgba(255,255,255,.94);
  box-shadow:0 12px 30px rgba(44,86,108,.10);
}

.mrtb-ft-scale-lane.blue{ background:linear-gradient(145deg,#eef7ff,#ffffff); }
.mrtb-ft-scale-lane.cyan{ background:linear-gradient(145deg,#effdff,#ffffff); }
.mrtb-ft-scale-lane.gold{ background:linear-gradient(145deg,#fff9ea,#ffffff); }

.mrtb-ft-scale-lane-head{
  display:grid;
  grid-template-columns:58px 1fr;
  gap:12px;
  align-items:center;
  margin-bottom:12px;
}

.mrtb-ft-scale-lane-badge{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  border-radius:18px;
  color:#fff;
  font-size:24px;
  font-weight:1000;
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.10),0 8px 16px rgba(44,86,108,.14);
}

.mrtb-ft-scale-lane.blue .mrtb-ft-scale-lane-badge{ background:linear-gradient(135deg,#4b91ff,#6ab4ff); }
.mrtb-ft-scale-lane.cyan .mrtb-ft-scale-lane-badge{ background:linear-gradient(135deg,#26bfd2,#66d9e5); }
.mrtb-ft-scale-lane.gold .mrtb-ft-scale-lane-badge{ background:linear-gradient(135deg,#ffbb2a,#ffd464); color:#534000; }

.mrtb-ft-scale-lane-head strong{
  display:block;
  color:#283347;
  font-size:24px;
  line-height:1.1;
  font-weight:1000;
}

.mrtb-ft-scale-lane-head small{
  color:#627187;
  font-size:13px;
  line-height:1.35;
  font-weight:800;
}

.mrtb-ft-scale-grid{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.mrtb-ft-degree-row,
.mrtb-ft-note-row{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:8px;
}

.mrtb-ft-degree-row span{
  display:grid;
  place-items:center;
  min-height:40px;
  border-radius:14px;
  color:#56657b;
  background:#eef3f8;
  font-size:14px;
  font-weight:1000;
  border:1px solid rgba(38,48,68,.08);
}

.mrtb-ft-degree-row span.active{
  color:#fff;
  background:linear-gradient(135deg,#4b91ff,#34c6d9);
  border-color:transparent;
  box-shadow:0 8px 16px rgba(66,136,215,.18);
}

.mrtb-ft-note-row span{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  min-height:72px;
  border-radius:16px;
  background:#fff;
  border:1px solid rgba(38,48,68,.10);
  box-shadow:inset 0 -2px 0 rgba(38,48,68,.03);
}

.mrtb-ft-note-row span b{
  color:#273247;
  font-size:24px;
  line-height:1;
  font-weight:1000;
}

.mrtb-ft-note-row span small{
  color:#7d8ca0;
  font-size:11px;
  font-weight:850;
}

.mrtb-ft-note-row span.active{
  border-color:transparent;
  background:linear-gradient(145deg,#fff5c9,#ffffff);
  box-shadow:0 10px 18px rgba(255,190,41,.22), inset 0 0 0 2px #ffcb3d;
}

.mrtb-ft-note-row span.active b{
  color:#b97600;
}

.mrtb-ft-scale-callout,
.mrtb-ft-scale-backwards{
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  font-size:13px;
  line-height:1.4;
  font-weight:850;
}

.mrtb-ft-scale-callout{
  color:#2c384c;
  background:rgba(255,255,255,.74);
  border:1px solid rgba(38,48,68,.08);
}

.mrtb-ft-scale-backwards{
  color:#5b6b81;
  background:rgba(232,246,255,.72);
  border:1px solid rgba(75,145,255,.16);
}

@media (max-width:980px){
  .mrtb-ft-degree-row,
  .mrtb-ft-note-row{
    min-width:700px;
  }

  .mrtb-ft-scale-grid{
    overflow-x:auto;
    padding-bottom:4px;
  }
}


.mrtb-ft-scale-meta{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-bottom:12px;
}

.mrtb-ft-scale-meta-box{
  padding:10px 12px;
  border-radius:16px;
  border:1px solid rgba(38,48,68,.09);
  background:rgba(255,255,255,.78);
  box-shadow:inset 0 -1px 0 rgba(38,48,68,.03);
}

.mrtb-ft-scale-meta-box span{
  display:block;
  margin-bottom:4px;
  color:#6f7d92;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.mrtb-ft-scale-meta-box strong{
  display:block;
  color:#2b3649;
  font-size:16px;
  line-height:1.2;
  font-weight:1000;
}

.mrtb-ft-scale-meta-box small{
  color:#75849a;
  font-size:12px;
  line-height:1.3;
  font-weight:850;
}

.mrtb-ft-scale-meta-box.accent-sharp{
  background:linear-gradient(145deg,#eef9ff,#ffffff);
  border-color:rgba(39,191,210,.20);
}

.mrtb-ft-scale-meta-box.accent-flat{
  background:linear-gradient(145deg,#fff8ec,#ffffff);
  border-color:rgba(255,187,42,.22);
}

.mrtb-ft-value-row{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:8px;
}

.mrtb-ft-value-row span{
  display:grid;
  place-items:center;
  min-height:38px;
  border-radius:13px;
  color:#6b7a90;
  background:#f4f8fb;
  border:1px solid rgba(38,48,68,.07);
  font-size:18px;
  font-weight:1000;
}

.mrtb-ft-value-row span.active{
  color:#fff;
  background:linear-gradient(135deg,#4b91ff,#34c6d9);
  border-color:transparent;
}

.mrtb-ft-note-row span.accidental{
  background:linear-gradient(145deg,#f8fbff,#ffffff);
  border-color:rgba(75,145,255,.16);
}

.mrtb-ft-note-row span.accidental b{
  color:#2b77a5;
}

@media (max-width:980px){
  .mrtb-ft-scale-meta{
    grid-template-columns:1fr;
  }

  .mrtb-ft-value-row{
    min-width:700px;
  }
}


/* ---------- Pretty redesign για 4η σκηνή ---------- */

.mrtb-ft-rule-band.pretty-rule{
  background:linear-gradient(145deg,#eef8ff,#fff9eb);
  border-color:rgba(75,145,255,.18);
}

.mrtb-ft-rule-band.pretty-rule strong{
  font-size:17px;
}

.mrtb-ft-pretty-scale-list{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.mrtb-ft-pretty-scale{
  padding:16px;
  border-radius:26px;
  border:1px solid rgba(38,48,68,.09);
  background:rgba(255,255,255,.94);
  box-shadow:0 16px 38px rgba(44,86,108,.11);
}

.mrtb-ft-pretty-scale.blue{
  background:linear-gradient(145deg,#eef7ff 0%,#ffffff 60%);
}

.mrtb-ft-pretty-scale.cyan{
  background:linear-gradient(145deg,#effcff 0%,#ffffff 60%);
}

.mrtb-ft-pretty-scale.gold{
  background:linear-gradient(145deg,#fff9e8 0%,#ffffff 60%);
}

.mrtb-ft-pretty-head{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);
  gap:14px;
  align-items:start;
  margin-bottom:14px;
}

.mrtb-ft-pretty-left{
  display:grid;
  grid-template-columns:62px 1fr;
  gap:12px;
  align-items:center;
}

.mrtb-ft-pretty-badge{
  display:grid;
  place-items:center;
  width:62px;
  height:62px;
  border-radius:20px;
  color:#fff;
  font-size:24px;
  font-weight:1000;
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.10),0 10px 18px rgba(44,86,108,.15);
}

.mrtb-ft-pretty-scale.blue .mrtb-ft-pretty-badge{ background:linear-gradient(135deg,#4b91ff,#6aaeff); }
.mrtb-ft-pretty-scale.cyan .mrtb-ft-pretty-badge{ background:linear-gradient(135deg,#26bfd2,#61d8e5); }
.mrtb-ft-pretty-scale.gold .mrtb-ft-pretty-badge{ background:linear-gradient(135deg,#ffbd2c,#ffd45d); color:#5d4900; }

.mrtb-ft-pretty-left h3{
  margin:0 0 5px;
  color:#253146;
  font-size:28px;
  line-height:1.05;
  font-weight:1000;
}

.mrtb-ft-pretty-left p{
  margin:0;
  color:#637187;
  font-size:13px;
  line-height:1.4;
  font-weight:800;
}

.mrtb-ft-pretty-meta{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.mrtb-ft-pretty-chip{
  padding:12px 14px;
  border-radius:18px;
  border:1px solid rgba(38,48,68,.08);
  background:rgba(255,255,255,.78);
  box-shadow:inset 0 -1px 0 rgba(38,48,68,.03);
}

.mrtb-ft-pretty-chip span{
  display:block;
  margin-bottom:4px;
  color:#708096;
  font-size:11px;
  font-weight:950;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.mrtb-ft-pretty-chip strong{
  display:block;
  color:#29364a;
  font-size:16px;
  line-height:1.25;
  font-weight:1000;
}

.mrtb-ft-pretty-chip.accent-sharp{
  background:linear-gradient(145deg,#edfaff,#ffffff);
  border-color:rgba(38,191,210,.18);
}

.mrtb-ft-pretty-chip.accent-flat{
  background:linear-gradient(145deg,#fff8ea,#ffffff);
  border-color:rgba(255,189,44,.22);
}

.mrtb-ft-pretty-scale-body{
  display:flex;
  flex-direction:column;
  gap:9px;
  padding:14px;
  border-radius:22px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(255,255,255,.74);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
}

.mrtb-ft-pretty-degree-strip,
.mrtb-ft-pretty-note-strip{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:9px;
}

.mrtb-ft-pretty-degree-strip span{
  display:grid;
  place-items:center;
  min-height:38px;
  border-radius:14px;
  color:#5f6d83;
  background:#edf3f8;
  border:1px solid rgba(38,48,68,.07);
  font-size:14px;
  font-weight:1000;
}

.mrtb-ft-pretty-degree-strip span.active{
  color:#fff;
  background:linear-gradient(135deg,#4b91ff,#34c6d9);
  border-color:transparent;
  box-shadow:0 10px 18px rgba(66,136,215,.20);
}

.mrtb-ft-pretty-note-strip span{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  min-height:92px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(38,48,68,.08);
  box-shadow:0 8px 16px rgba(44,86,108,.06), inset 0 -2px 0 rgba(38,48,68,.03);
}

.mrtb-ft-pretty-note-strip span em{
  font-style:normal;
  color:#93a0b1;
  font-size:17px;
  line-height:1;
  font-weight:900;
}

.mrtb-ft-pretty-note-strip span b{
  color:#273247;
  font-size:26px;
  line-height:1;
  font-weight:1000;
}

.mrtb-ft-pretty-note-strip span small{
  color:#7e8da1;
  font-size:11px;
  font-weight:850;
}

.mrtb-ft-pretty-note-strip span.active{
  background:linear-gradient(145deg,#fff7d2,#ffffff);
  border-color:#ffc72d;
  box-shadow:0 14px 22px rgba(255,191,43,.18), inset 0 0 0 2px rgba(255,199,45,.9);
  transform:translateY(-1px);
}

.mrtb-ft-pretty-note-strip span.active b{
  color:#bd7b00;
}

.mrtb-ft-pretty-note-strip span.active em{
  color:#d29c1a;
}

.mrtb-ft-pretty-note-strip span.accidental{
  background:linear-gradient(145deg,#f7fbff,#ffffff);
  border-color:rgba(75,145,255,.14);
}

.mrtb-ft-pretty-note-strip span.accidental b{
  color:#2677a5;
}

.mrtb-ft-pretty-footer{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:12px;
}

.mrtb-ft-pretty-callout,
.mrtb-ft-pretty-reverse{
  padding:12px 14px;
  border-radius:16px;
  font-size:13px;
  line-height:1.45;
  font-weight:850;
}

.mrtb-ft-pretty-callout{
  color:#29364a;
  background:rgba(255,255,255,.84);
  border:1px solid rgba(38,48,68,.08);
}

.mrtb-ft-pretty-reverse{
  color:#5b6c82;
  background:linear-gradient(145deg,#ecf8ff,#ffffff);
  border:1px solid rgba(75,145,255,.16);
}

.mrtb-ft-finding-points.pretty-points article{
  min-height:102px;
}

@media (max-width:1080px){
  .mrtb-ft-pretty-head{
    grid-template-columns:1fr;
  }

  .mrtb-ft-pretty-meta{
    grid-template-columns:1fr 1fr;
  }
}

@media (max-width:980px){
  .mrtb-ft-pretty-meta{
    grid-template-columns:1fr;
  }

  .mrtb-ft-pretty-degree-strip,
  .mrtb-ft-pretty-note-strip{
    min-width:720px;
  }

  .mrtb-ft-pretty-scale-body{
    overflow-x:auto;
    padding-bottom:10px;
  }
}


/* ---------- Πραγματικό πεντάγραμμο για 4η σκηνή ---------- */

.mrtb-ft-staff-scale-list{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.mrtb-ft-staff-scale-card{
  padding:16px;
  border-radius:26px;
  border:1px solid rgba(38,48,68,.09);
  background:rgba(255,255,255,.94);
  box-shadow:0 16px 38px rgba(44,86,108,.11);
}

.mrtb-ft-staff-scale-card.blue{ background:linear-gradient(145deg,#eef7ff 0%,#ffffff 62%); }
.mrtb-ft-staff-scale-card.cyan{ background:linear-gradient(145deg,#effcff 0%,#ffffff 62%); }
.mrtb-ft-staff-scale-card.gold{ background:linear-gradient(145deg,#fff9e8 0%,#ffffff 62%); }

.mrtb-ft-staff-scale-head{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);
  gap:14px;
  align-items:start;
  margin-bottom:14px;
}

.mrtb-ft-staff-scale-titlewrap{
  display:grid;
  grid-template-columns:64px 1fr;
  gap:12px;
  align-items:center;
}

.mrtb-ft-staff-scale-badge{
  display:grid;
  place-items:center;
  width:64px;
  height:64px;
  border-radius:20px;
  color:#fff;
  font-size:25px;
  font-weight:1000;
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.10),0 10px 18px rgba(44,86,108,.15);
}

.mrtb-ft-staff-scale-card.blue .mrtb-ft-staff-scale-badge{ background:linear-gradient(135deg,#4b91ff,#6aaeff); }
.mrtb-ft-staff-scale-card.cyan .mrtb-ft-staff-scale-badge{ background:linear-gradient(135deg,#26bfd2,#61d8e5); }
.mrtb-ft-staff-scale-card.gold .mrtb-ft-staff-scale-badge{ background:linear-gradient(135deg,#ffbd2c,#ffd45d); color:#5d4900; }

.mrtb-ft-staff-scale-titlewrap h3{
  margin:0 0 5px;
  color:#253146;
  font-size:28px;
  line-height:1.05;
  font-weight:1000;
}

.mrtb-ft-staff-scale-titlewrap p{
  margin:0;
  color:#637187;
  font-size:13px;
  line-height:1.4;
  font-weight:800;
}

.mrtb-ft-staff-scale-meta{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.mrtb-ft-staff-meta-box{
  padding:12px 14px;
  border-radius:18px;
  border:1px solid rgba(38,48,68,.08);
  background:rgba(255,255,255,.78);
  box-shadow:inset 0 -1px 0 rgba(38,48,68,.03);
}

.mrtb-ft-staff-meta-box span{
  display:block;
  margin-bottom:4px;
  color:#708096;
  font-size:11px;
  font-weight:950;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.mrtb-ft-staff-meta-box strong{
  display:block;
  color:#29364a;
  font-size:16px;
  line-height:1.25;
  font-weight:1000;
}

.mrtb-ft-staff-meta-box small{
  color:#7c8b9f;
  font-size:12px;
  line-height:1.3;
  font-weight:850;
}

.mrtb-ft-staff-scale-svgwrap{
  overflow-x:auto;
  padding:10px 0 0;
}

.mrtb-ft-staff-scale-svg{
  display:block;
  width:100%;
  min-width:980px;
  height:auto;
  border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(247,251,255,.95));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}

.mrtb-ft-armature-glyph{
  font-family:"Bravura","Noto Music","Times New Roman",serif;
  font-size:56px;
  font-weight:700;
}

.mrtb-ft-armature-glyph.sharp,
.mrtb-ft-armature-note.sharp,
.mrtb-ft-note-accidental{
  fill:#2a80af;
}

.mrtb-ft-armature-glyph.flat,
.mrtb-ft-armature-note.flat{
  fill:#b77a00;
}

.mrtb-ft-armature-note{
  font-size:18px;
  font-weight:1000;
}

.mrtb-ft-note-head.staff-note{
  fill:#3f4c61;
}

.mrtb-ft-note-head.staff-note.active{
  fill:#ffcb39;
  stroke:#263044;
  stroke-width:4.2;
}

.mrtb-ft-scale-stem.staff-note-stem.active{
  stroke:#be7b00;
}

.mrtb-ft-staff-degree-pill{
  fill:#edf3f8;
  stroke:rgba(38,48,68,.08);
  stroke-width:1.5;
}

.mrtb-ft-staff-degree-pill.active{
  fill:#46aef1;
  stroke:none;
}

.mrtb-ft-staff-degree-label{
  fill:#5f6d83;
  font-size:13px;
  font-weight:1000;
}

.mrtb-ft-staff-degree-label.active{
  fill:#fff;
}

.mrtb-ft-staff-note-label{
  fill:#273247;
  font-size:18px;
  font-weight:1000;
}

.mrtb-ft-staff-note-label.active{
  fill:#b97800;
}

.mrtb-ft-staff-note-greek{
  fill:#7e8da1;
  font-size:12px;
  font-weight:850;
}

.mrtb-ft-staff-note-greek.active{
  fill:#b97800;
}

.mrtb-ft-staff-value-label{
  fill:#95a2b3;
  font-size:18px;
  font-weight:900;
}

.mrtb-ft-staff-value-label.active{
  fill:#d39c1b;
}

.mrtb-ft-staff-scale-bottom{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:12px;
}

.mrtb-ft-staff-scale-callout,
.mrtb-ft-staff-scale-reverse{
  padding:12px 14px;
  border-radius:16px;
  font-size:13px;
  line-height:1.45;
  font-weight:850;
}

.mrtb-ft-staff-scale-callout{
  color:#29364a;
  background:rgba(255,255,255,.84);
  border:1px solid rgba(38,48,68,.08);
}

.mrtb-ft-staff-scale-reverse{
  color:#5b6c82;
  background:linear-gradient(145deg,#ecf8ff,#ffffff);
  border:1px solid rgba(75,145,255,.16);
}

@media (max-width:1080px){
  .mrtb-ft-staff-scale-head{
    grid-template-columns:1fr;
  }
}

@media (max-width:980px){
  .mrtb-ft-staff-scale-meta{
    grid-template-columns:1fr;
  }
}


/* ---------- v10: όλες οι Ionian στην ίδια οθόνη ---------- */

.mrtb-ft-hero.compact-hero{
  padding:14px 18px;
}

.mrtb-ft-hero.compact-hero h2{
  font-size:22px;
  margin:6px 0 4px;
}

.mrtb-ft-hero.compact-hero p{
  font-size:12px;
  line-height:1.4;
}

.mrtb-ft-rule-band.compact-rule{
  padding:10px 14px;
}

.mrtb-ft-rule-band.compact-rule strong{
  font-size:15px;
}

.mrtb-ft-quick-legend.compact-legend{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.mrtb-ft-quick-legend.compact-legend > div{
  display:flex;
  flex-direction:column;
  gap:3px;
  min-height:66px;
  padding:10px 12px;
  border:1px solid rgba(38,48,68,.09);
  border-radius:16px;
  background:rgba(255,255,255,.90);
  box-shadow:0 8px 18px rgba(44,86,108,.08);
}

.mrtb-ft-quick-legend.compact-legend b{
  color:#2a364a;
  font-size:13px;
  line-height:1.2;
  font-weight:1000;
}

.mrtb-ft-quick-legend.compact-legend span{
  color:#67778e;
  font-size:11px;
  line-height:1.35;
  font-weight:850;
}

.mrtb-ft-staff-scale-list.one-screen-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  align-items:start;
}

.mrtb-ft-staff-scale-card{
  padding:12px;
  border-radius:22px;
  box-shadow:0 12px 28px rgba(44,86,108,.11);
}

.mrtb-ft-staff-scale-head.compact-head{
  grid-template-columns:1fr;
  gap:10px;
  margin-bottom:10px;
}

.mrtb-ft-staff-scale-titlewrap.compact-titlewrap{
  grid-template-columns:54px 1fr;
  gap:10px;
}

.mrtb-ft-staff-scale-badge{
  width:54px;
  height:54px;
  border-radius:17px;
  font-size:22px;
}

.mrtb-ft-staff-scale-titlewrap h3{
  font-size:20px;
  margin:0 0 4px;
}

.mrtb-ft-staff-scale-titlewrap p{
  font-size:12px;
  line-height:1.35;
}

.mrtb-ft-staff-scale-meta.compact-meta{
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.mrtb-ft-staff-meta-box{
  padding:10px 11px;
  border-radius:15px;
}

.mrtb-ft-staff-meta-box strong{
  font-size:14px;
}

.mrtb-ft-staff-meta-box small{
  font-size:11px;
}

.mrtb-ft-staff-scale-svgwrap.compact-svgwrap{
  overflow:visible;
  padding:4px 0 0;
}

.mrtb-ft-staff-scale-svg.compact-svg{
  width:100%;
  min-width:0;
  border-radius:18px;
}

.mrtb-ft-staff-scale-svg.compact-svg .mrtb-ft-staff-line{
  stroke-width:3.2;
}

.mrtb-ft-staff-scale-svg.compact-svg .mrtb-ft-ledger{
  stroke-width:3.2;
}

.mrtb-ft-staff-scale-svg.compact-svg .mrtb-ft-clef{
  font-size:118px;
}

.mrtb-ft-staff-scale-svg.compact-svg .mrtb-ft-armature-glyph{
  font-size:44px;
}

.mrtb-ft-staff-scale-svg.compact-svg .mrtb-ft-armature-note{
  font-size:14px;
}

.mrtb-ft-staff-scale-svg.compact-svg .mrtb-ft-note-head{
  rx:17px;
  ry:11px;
}

.mrtb-ft-staff-scale-svg.compact-svg .mrtb-ft-staff-note-label{
  font-size:15px;
}

.mrtb-ft-staff-scale-svg.compact-svg .mrtb-ft-staff-note-greek{
  font-size:11px;
}

.mrtb-ft-staff-scale-svg.compact-svg .mrtb-ft-staff-value-label{
  font-size:16px;
}

.mrtb-ft-staff-scale-svg.compact-svg .mrtb-ft-staff-degree-label{
  font-size:12px;
}

.mrtb-ft-staff-scale-bottom.compact-bottom{
  gap:6px;
  margin-top:10px;
}

.mrtb-ft-staff-scale-callout,
.mrtb-ft-staff-scale-reverse{
  padding:10px 11px;
  border-radius:14px;
  font-size:12px;
  line-height:1.38;
}

.mrtb-ft-finding-points.compact-points article{
  min-height:92px;
  padding:12px;
}

.mrtb-ft-finding-points.compact-points strong{
  font-size:14px;
}

.mrtb-ft-finding-points.compact-points p{
  font-size:12px;
}

@media (max-width:1500px){
  .mrtb-ft-staff-scale-list.one-screen-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width:980px){
  .mrtb-ft-quick-legend.compact-legend,
  .mrtb-ft-staff-scale-meta.compact-meta,
  .mrtb-ft-staff-scale-list.one-screen-grid{
    grid-template-columns:1fr;
  }
}


/* ---------- v11: πραγματικά όλα στην ίδια οθόνη ---------- */

.mrtb-app[data-scene="t2-triads-in-scales"] .mrtb-scroll-spacer{
  min-height:760px !important;
}

.mrtb-ft-finder-topline{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,.8fr);
  align-items:center;
  gap:16px;
  padding:12px 16px;
  border:1px solid rgba(255,255,255,.78);
  border-radius:20px;
  background:rgba(255,255,255,.90);
  box-shadow:0 12px 28px rgba(44,86,108,.11);
}

.mrtb-ft-finder-topline h2{
  margin:6px 0 0;
  color:#273247;
  font-size:22px;
  line-height:1.1;
  font-weight:1000;
}

.mrtb-ft-finder-topline p{
  margin:0;
  color:#617087;
  font-size:12px;
  line-height:1.42;
  font-weight:800;
}

.mrtb-ft-overview-card{
  overflow:hidden;
  height:515px;
  padding:8px;
  border:1px solid rgba(38,48,68,.10);
  border-radius:24px;
  background:rgba(255,255,255,.94);
  box-shadow:0 16px 38px rgba(44,86,108,.12);
}

.mrtb-ft-overview-svg{
  display:block;
  width:100%;
  height:100%;
}

.mrtb-ft-finder-chord-bg{
  fill:#fff9e8;
  stroke:#ffd264;
  stroke-width:2.5;
}

.mrtb-ft-finder-chord-kicker{
  fill:#a47700;
  font-size:13px;
  font-weight:1000;
  letter-spacing:.08em;
}

.mrtb-ft-finder-chord-title{
  fill:#273247;
  font-size:34px;
  font-weight:1000;
}

.mrtb-ft-finder-chord-sub{
  fill:#69788e;
  font-size:18px;
  font-weight:900;
}

.mrtb-ft-finder-chord-note{
  fill:#ffcb39;
  stroke:#263044;
  stroke-width:3;
}

.mrtb-ft-finder-chord-stem{
  stroke:#263044;
  stroke-width:4;
  stroke-linecap:round;
}

.mrtb-ft-finder-staff-line,
.mrtb-ft-finder-ledger{
  stroke:#303b50;
  stroke-width:2.4;
  stroke-linecap:round;
}

.mrtb-ft-finder-panel-bg{
  fill:#ffffff;
  stroke:rgba(38,48,68,.12);
  stroke-width:2;
}

.mrtb-ft-finder-panel.blue .mrtb-ft-finder-panel-bg{ fill:#f2f8ff; stroke:#b8d2ff; }
.mrtb-ft-finder-panel.cyan .mrtb-ft-finder-panel-bg{ fill:#f1fcff; stroke:#a6e0e8; }
.mrtb-ft-finder-panel.gold .mrtb-ft-finder-panel-bg{ fill:#fffaf0; stroke:#f0d58d; }

.mrtb-ft-finder-panel-badge{
  fill:#4b91ff;
}

.mrtb-ft-finder-panel.cyan .mrtb-ft-finder-panel-badge{ fill:#31c3d5; }
.mrtb-ft-finder-panel.gold .mrtb-ft-finder-panel-badge{ fill:#ffbd2e; }

.mrtb-ft-finder-panel-badge-text{
  fill:#fff;
  font-size:20px;
  font-weight:1000;
}

.mrtb-ft-finder-panel.gold .mrtb-ft-finder-panel-badge-text{ fill:#5c4600; }

.mrtb-ft-finder-panel-title{
  fill:#273247;
  font-size:22px;
  font-weight:1000;
}

.mrtb-ft-finder-panel-meta{
  fill:#718096;
  font-size:12px;
  font-weight:850;
}

.mrtb-ft-finder-notehead{
  fill:#46536a;
  stroke:#263044;
  stroke-width:2.5;
}

.mrtb-ft-finder-notehead.active{
  fill:#ffcb39;
  stroke:#b77500;
  stroke-width:3;
}

.mrtb-ft-finder-stem{
  stroke:#263044;
  stroke-width:3.3;
  stroke-linecap:round;
}

.mrtb-ft-finder-stem.active{
  stroke:#b77500;
}

.mrtb-ft-finder-degree-pill{
  fill:#edf3f8;
  stroke:#d9e3ec;
  stroke-width:1.2;
}

.mrtb-ft-finder-degree-pill.active{
  fill:#46aef1;
  stroke:none;
}

.mrtb-ft-finder-degree-text{
  fill:#607087;
  font-size:11px;
  font-weight:1000;
}

.mrtb-ft-finder-degree-text.active{
  fill:#fff;
}

.mrtb-ft-finder-note-name{
  fill:#273247;
  font-size:15px;
  font-weight:1000;
}

.mrtb-ft-finder-note-name.active{
  fill:#b77500;
}

.mrtb-ft-finder-note-gr{
  fill:#8492a5;
  font-size:10px;
  font-weight:850;
}

.mrtb-ft-finder-note-gr.active{
  fill:#b77500;
}

.mrtb-ft-finder-armature{
  font-family:"Apple Symbols","Noto Music","Segoe UI Symbol",serif;
  font-size:38px;
  font-weight:400;
}

.mrtb-ft-finder-armature.sharp{ fill:#2580ae; }
.mrtb-ft-finder-armature.flat{ fill:#ad7500; }

.mrtb-ft-finder-callout-bg{
  fill:#ffffff;
  stroke:rgba(38,48,68,.08);
  stroke-width:1.2;
}

.mrtb-ft-finder-callout{
  fill:#2e3a4e;
  font-size:13px;
  font-weight:1000;
}

.mrtb-ft-finder-reverse{
  fill:#65758b;
  font-size:12px;
  font-weight:850;
}

.mrtb-ft-finder-arrow{
  fill:none;
  stroke:#64bddb;
  stroke-width:3;
  stroke-linecap:round;
}

.mrtb-ft-finder-arrow-head{
  fill:#64bddb;
}

.mrtb-ft-finder-arrow-pill{
  fill:#4b91ff;
}

.mrtb-ft-finder-arrow-pill.cyan{ fill:#31c3d5; }
.mrtb-ft-finder-arrow-pill.gold{ fill:#ffbd2e; }

.mrtb-ft-finder-arrow-label{
  fill:#fff;
  font-size:14px;
  font-weight:1000;
}

.mrtb-ft-finder-arrow-pill.gold + .mrtb-ft-finder-arrow-label{
  fill:#5c4600;
}

@media (max-width:1200px){
  .mrtb-ft-finder-topline{
    grid-template-columns:1fr;
  }

  .mrtb-ft-overview-card{
    overflow-x:auto;
  }

  .mrtb-ft-overview-svg{
    min-width:1180px;
  }
}

/* =========================================================
   v12 · Παιχνίδι Εύρεση στις Ionian · 1–9 παίκτες
   ========================================================= */

.mrtb-app.mrtb-fysikes-triads-game-mode[data-scene="t2-triads-in-scales"] .mrtb-scroll-spacer{
  min-height:780px !important;
}

.mrtb-ft-game-scene{
  top:8px;
}

.mrtb-ft-game-shell{
  display:flex;
  flex-direction:column;
  gap:9px;
  width:100%;
  box-sizing:border-box;
  color:#263044;
}

/* ---------- Setup ---------- */

.mrtb-ft-game-setup-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  border:1px solid rgba(255,255,255,.82);
  border-radius:22px;
  background:rgba(255,255,255,.91);
  box-shadow:0 12px 32px rgba(45,89,112,.13);
}

.mrtb-ft-game-setup-hero span{
  color:#2573a4;
  font-size:10px;
  font-weight:1000;
  letter-spacing:.07em;
  text-transform:uppercase;
}

.mrtb-ft-game-setup-hero h2{
  margin:4px 0 3px;
  color:#263044;
  font-size:24px;
  line-height:1.08;
  font-weight:1000;
}

.mrtb-ft-game-setup-hero p{
  margin:0;
  color:#617087;
  font-size:11px;
  line-height:1.4;
  font-weight:800;
}

.mrtb-ft-game-quality-badges{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:6px;
  max-width:430px;
}

.mrtb-ft-game-quality-badges b{
  padding:7px 10px;
  border-radius:12px;
  color:#314057;
  background:linear-gradient(180deg,#fff,#edf5fb);
  border:1px solid rgba(38,48,68,.09);
  font-size:10px;
  font-weight:1000;
  white-space:nowrap;
}

.mrtb-ft-game-setup-grid{
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(280px,.62fr);
  gap:10px;
}

.mrtb-ft-game-setup-grid > section,
.mrtb-ft-game-setup-grid > aside{
  padding:14px;
  border:1px solid rgba(38,48,68,.09);
  border-radius:22px;
  background:rgba(255,255,255,.93);
  box-shadow:0 12px 30px rgba(44,86,108,.10);
}

.mrtb-ft-game-setup-grid h3{
  margin:0 0 8px;
  color:#334057;
  font-size:13px;
  font-weight:1000;
}

.mrtb-ft-game-count-buttons,
.mrtb-ft-game-round-buttons{
  display:grid;
  gap:6px;
}

.mrtb-ft-game-count-buttons{
  grid-template-columns:repeat(9,minmax(0,1fr));
  margin-bottom:13px;
}

.mrtb-ft-game-round-buttons{
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-bottom:11px;
}

.mrtb-ft-game-count-buttons button,
.mrtb-ft-game-round-buttons button{
  min-height:39px;
  padding:5px;
  border:1px solid rgba(38,48,68,.10);
  border-radius:12px;
  color:#596980;
  background:linear-gradient(180deg,#fff,#edf3f8);
  box-shadow:inset 0 -2px 0 rgba(38,48,68,.05);
  font-size:13px;
  font-weight:1000;
  cursor:pointer;
}

.mrtb-ft-game-count-buttons button.active,
.mrtb-ft-game-round-buttons button.active{
  color:#fff;
  border-color:transparent;
  background:linear-gradient(135deg,#438cff,#36c5d8);
  box-shadow:0 7px 15px rgba(66,136,215,.20);
}

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

.mrtb-ft-game-name-grid[data-count="1"],
.mrtb-ft-game-name-grid[data-count="2"]{
  grid-template-columns:repeat(var(--game-name-cols,2),minmax(0,1fr));
}

.mrtb-ft-game-name-grid[data-count="1"]{ --game-name-cols:1; }
.mrtb-ft-game-name-grid[data-count="2"]{ --game-name-cols:2; }

.mrtb-ft-game-name-grid label{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:7px;
  border-radius:13px;
  background:#f1f6fb;
}

.mrtb-ft-game-name-grid label span{
  color:#68788e;
  font-size:8px;
  line-height:1;
  font-weight:950;
  text-transform:uppercase;
}

.mrtb-ft-game-name-grid input{
  width:100%;
  min-height:34px;
  box-sizing:border-box;
  padding:6px 8px;
  border:1px solid rgba(38,48,68,.12);
  border-radius:10px;
  color:#263044;
  background:#fff;
  outline:none;
  font:inherit;
  font-size:11px;
  font-weight:900;
}

.mrtb-ft-game-name-grid input:focus{
  border-color:#4b91ff;
  box-shadow:0 0 0 3px rgba(75,145,255,.12);
}

.mrtb-ft-game-howto{
  margin-bottom:10px;
  padding:11px;
  border-radius:16px;
  color:#5d6c82;
  background:linear-gradient(145deg,#eef8ff,#fff9ea);
  border:1px solid rgba(75,145,255,.13);
}

.mrtb-ft-game-howto strong{
  display:block;
  margin-bottom:4px;
  color:#2d394e;
  font-size:12px;
  font-weight:1000;
}

.mrtb-ft-game-howto p{
  margin:4px 0 0;
  font-size:9px;
  line-height:1.45;
  font-weight:800;
}

.mrtb-ft-game-start,
.mrtb-ft-game-close-local{
  width:100%;
  min-height:42px;
  border:0;
  border-radius:13px;
  font-size:11px;
  font-weight:1000;
  cursor:pointer;
}

.mrtb-ft-game-start{
  color:#fff;
  background:linear-gradient(135deg,#438cff,#36c5d8);
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.10),0 9px 18px rgba(66,136,215,.21);
}

.mrtb-ft-game-close-local{
  margin-top:7px;
  color:#64748a;
  background:#edf3f8;
}

/* ---------- Κοινή ερώτηση ---------- */

.mrtb-ft-game-question{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(220px,.62fr) minmax(300px,1fr);
  align-items:center;
  gap:12px;
  min-height:94px;
  padding:10px 13px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.80);
  border-radius:20px;
  background:rgba(255,255,255,.94);
  box-shadow:0 12px 30px rgba(44,86,108,.11);
}

.mrtb-ft-game-question.major{
  background:linear-gradient(145deg,#fff9de,#fff 65%);
}

.mrtb-ft-game-question.minor{
  background:linear-gradient(145deg,#eef0ff,#fff 65%);
}

.mrtb-ft-game-question.halfdim{
  background:linear-gradient(145deg,#ffeaf0,#fff 65%);
}

.mrtb-ft-game-round-label{
  display:grid;
  place-items:center;
  min-width:86px;
  min-height:42px;
  padding:5px 8px;
  border-radius:13px;
  color:#fff;
  background:#263044;
  font-size:10px;
  line-height:1.1;
  font-weight:1000;
  text-align:center;
}

.mrtb-ft-game-chord-badge{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:3px 9px;
}

.mrtb-ft-game-chord-badge span{
  grid-row:1 / span 2;
  display:grid;
  place-items:center;
  min-width:62px;
  height:62px;
  padding:0 7px;
  border-radius:18px;
  color:#fff;
  background:linear-gradient(135deg,#4b91ff,#34c6d9);
  font-size:10px;
  font-weight:1000;
}

.mrtb-ft-game-question.major .mrtb-ft-game-chord-badge span{
  color:#584100;
  background:linear-gradient(135deg,#ffbd29,#ffd76c);
}

.mrtb-ft-game-question.minor .mrtb-ft-game-chord-badge span{
  background:linear-gradient(135deg,#7e85ff,#6269dc);
}

.mrtb-ft-game-question.halfdim .mrtb-ft-game-chord-badge span{
  background:linear-gradient(135deg,#ff7394,#db456f);
}

.mrtb-ft-game-chord-badge strong{
  color:#263044;
  font-size:24px;
  line-height:1;
  font-weight:1000;
}

.mrtb-ft-game-chord-badge small{
  color:#75849a;
  font-size:10px;
  line-height:1;
  font-weight:900;
}

.mrtb-ft-game-instruction{
  display:flex;
  flex-direction:column;
  gap:3px;
}

.mrtb-ft-game-instruction b{
  color:#2e3a4f;
  font-size:13px;
  line-height:1.25;
  font-weight:1000;
}

.mrtb-ft-game-instruction span{
  color:#6a788e;
  font-size:9px;
  line-height:1.35;
  font-weight:850;
}

.mrtb-ft-game-correct-banner{
  position:absolute;
  inset:0;
  z-index:4;
  display:grid;
  grid-template-columns:auto 1fr;
  align-content:center;
  gap:4px 12px;
  padding:12px 18px;
  color:#174b34;
  background:rgba(229,255,238,.97);
  backdrop-filter:blur(5px);
}

.mrtb-ft-game-correct-banner span{
  color:#2a8c5a;
  font-size:9px;
  font-weight:1000;
  letter-spacing:.07em;
  text-transform:uppercase;
}

.mrtb-ft-game-correct-banner strong{
  color:#174b34;
  font-size:17px;
  line-height:1.25;
  font-weight:1000;
}

.mrtb-ft-game-correct-banner i{
  position:absolute;
  left:0;
  bottom:0;
  height:5px;
  background:#36b874;
  animation:mrtb-ft-auto-next 3s linear forwards;
}

@keyframes mrtb-ft-auto-next{
  from{width:0;}
  to{width:100%;}
}

/* ---------- Παίκτες ---------- */

.mrtb-ft-game-players{
  display:grid;
  gap:8px;
  align-items:stretch;
}

.mrtb-ft-game-players[data-count="1"]{ grid-template-columns:1fr; }
.mrtb-ft-game-players[data-count="2"]{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.mrtb-ft-game-players[data-count="3"]{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.mrtb-ft-game-players[data-count="4"]{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.mrtb-ft-game-players[data-count="5"]{ grid-template-columns:repeat(6,minmax(0,1fr)); }
.mrtb-ft-game-players[data-count="5"] > article{ grid-column:span 2; }
.mrtb-ft-game-players[data-count="5"] > article:nth-child(4){ grid-column:2 / span 2; }
.mrtb-ft-game-players[data-count="5"] > article:nth-child(5){ grid-column:4 / span 2; }
.mrtb-ft-game-players[data-count="6"],
.mrtb-ft-game-players[data-count="9"]{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.mrtb-ft-game-players[data-count="7"],
.mrtb-ft-game-players[data-count="8"]{ grid-template-columns:repeat(4,minmax(0,1fr)); }

.mrtb-ft-game-player-card{
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:8px;
  border:1px solid rgba(38,48,68,.09);
  border-radius:17px;
  background:rgba(255,255,255,.95);
  box-shadow:0 8px 20px rgba(44,86,108,.09);
}

.mrtb-ft-game-player-card > header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:7px;
  min-height:25px;
  margin-bottom:4px;
}

.mrtb-ft-game-player-card > header strong{
  overflow:hidden;
  color:#2c384c;
  font-size:11px;
  line-height:1.1;
  font-weight:1000;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mrtb-ft-game-player-card > header span{
  flex:0 0 auto;
  padding:4px 7px;
  border-radius:9px;
  color:#fff;
  background:#263044;
  font-size:8px;
  line-height:1;
  font-weight:1000;
}

.mrtb-ft-game-selection-count{
  margin-bottom:4px;
  color:#75849a;
  font-size:7.5px;
  line-height:1;
  font-weight:900;
  text-align:center;
  text-transform:uppercase;
}

.mrtb-ft-game-answer-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:4px;
}

.mrtb-ft-game-answer-grid button{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-width:0;
  min-height:35px;
  padding:3px 2px;
  border:1px solid rgba(38,48,68,.10);
  border-radius:9px;
  color:#4e5d73;
  background:linear-gradient(180deg,#fff,#eef4f9);
  box-shadow:inset 0 -2px 0 rgba(38,48,68,.04);
  cursor:pointer;
}

.mrtb-ft-game-answer-grid button b{
  font-size:10px;
  line-height:1;
  font-weight:1000;
}

.mrtb-ft-game-answer-grid button span{
  overflow:hidden;
  width:100%;
  margin-top:2px;
  font-size:6px;
  line-height:1;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mrtb-ft-game-answer-grid button.selected{
  color:#fff;
  border-color:transparent;
  background:linear-gradient(135deg,#438cff,#36c5d8);
  box-shadow:0 5px 10px rgba(66,136,215,.18);
}

.mrtb-ft-game-answer-grid button.correct-option{
  color:#155d38 !important;
  border-color:#55cc87 !important;
  background:#dfffea !important;
  box-shadow:inset 0 0 0 1px rgba(43,166,92,.13) !important;
}

.mrtb-ft-game-answer-grid button.wrong-option{
  color:#9f2e35 !important;
  border-color:#ff7d83 !important;
  background:#ffe5e7 !important;
}

.mrtb-ft-game-answer-grid button:disabled{
  cursor:default;
  opacity:1;
}

.mrtb-ft-game-feedback{
  display:grid;
  place-items:center;
  min-height:25px;
  margin-top:5px;
  padding:3px 5px;
  border-radius:9px;
  font-size:7.5px;
  line-height:1.15;
  font-weight:1000;
  text-align:center;
}

.mrtb-ft-game-feedback.choosing{
  color:#607188;
  background:#edf3f8;
}

.mrtb-ft-game-feedback.locked{
  color:#256384;
  background:#e3f5ff;
}

.mrtb-ft-game-feedback.correct{
  color:#12653b;
  background:#dfffea;
}

.mrtb-ft-game-feedback.wrong{
  color:#a12c35;
  background:#ffe4e6;
}

.mrtb-ft-game-players[data-count="1"] .mrtb-ft-game-player-card,
.mrtb-ft-game-players[data-count="2"] .mrtb-ft-game-player-card{
  padding:12px;
}

.mrtb-ft-game-players[data-count="1"] .mrtb-ft-game-answer-grid button,
.mrtb-ft-game-players[data-count="2"] .mrtb-ft-game-answer-grid button{
  min-height:48px;
}

.mrtb-ft-game-players[data-count="7"] .mrtb-ft-game-player-card,
.mrtb-ft-game-players[data-count="8"] .mrtb-ft-game-player-card,
.mrtb-ft-game-players[data-count="9"] .mrtb-ft-game-player-card{
  padding:6px;
  border-radius:14px;
}

.mrtb-ft-game-players[data-count="7"] .mrtb-ft-game-answer-grid button,
.mrtb-ft-game-players[data-count="8"] .mrtb-ft-game-answer-grid button,
.mrtb-ft-game-players[data-count="9"] .mrtb-ft-game-answer-grid button{
  min-height:31px;
}

/* ---------- Τελικά αποτελέσματα ---------- */

.mrtb-ft-game-shell.results{
  display:grid;
  place-items:center;
  min-height:700px;
}

.mrtb-ft-game-results-card{
  width:min(720px,92%);
  padding:22px;
  border:1px solid rgba(255,255,255,.82);
  border-radius:28px;
  background:rgba(255,255,255,.95);
  box-shadow:0 22px 55px rgba(44,86,108,.18);
  text-align:center;
}

.mrtb-ft-game-trophy{
  font-size:54px;
  line-height:1;
}

.mrtb-ft-game-results-card > span{
  display:block;
  margin-top:5px;
  color:#6a7b91;
  font-size:10px;
  font-weight:1000;
  letter-spacing:.07em;
  text-transform:uppercase;
}

.mrtb-ft-game-results-card h2{
  margin:5px 0 2px;
  color:#263044;
  font-size:24px;
  font-weight:1000;
}

.mrtb-ft-game-results-card > p{
  margin:0 0 12px;
  color:#68778c;
  font-size:10px;
  font-weight:850;
}

.mrtb-ft-game-ranking{
  display:grid;
  gap:5px;
  text-align:left;
}

.mrtb-ft-game-ranking > div{
  display:grid;
  grid-template-columns:32px 1fr auto;
  align-items:center;
  gap:8px;
  padding:7px 9px;
  border-radius:12px;
  background:#edf3f8;
}

.mrtb-ft-game-ranking > div.winner{
  background:linear-gradient(145deg,#fff4b3,#ffd665);
}

.mrtb-ft-game-ranking span{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:9px;
  background:#fff;
  font-size:10px;
  font-weight:1000;
}

.mrtb-ft-game-ranking strong{
  font-size:11px;
  font-weight:1000;
}

.mrtb-ft-game-ranking small{
  min-width:58px;
  padding:5px 7px;
  border-radius:8px;
  color:#fff;
  background:#263044;
  font-size:9px;
  font-weight:1000;
  text-align:center;
}

.mrtb-ft-game-result-actions{
  display:grid;
  grid-template-columns:1.35fr .8fr .8fr;
  gap:7px;
  margin-top:12px;
}

.mrtb-ft-game-result-actions button{
  min-height:40px;
  padding:6px 8px;
  border:0;
  border-radius:12px;
  color:#fff;
  background:linear-gradient(135deg,#438cff,#36c5d8);
  font-size:9px;
  font-weight:1000;
  cursor:pointer;
}

.mrtb-ft-game-result-actions button:last-child{
  color:#607188;
  background:#edf3f8;
}

@media (max-width:1180px){
  .mrtb-ft-game-setup-grid{
    grid-template-columns:1fr;
  }

  .mrtb-ft-game-players[data-count="7"],
  .mrtb-ft-game-players[data-count="8"]{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:900px){
  .mrtb-ft-game-setup-hero,
  .mrtb-ft-game-question{
    grid-template-columns:1fr;
  }

  .mrtb-ft-game-quality-badges{
    justify-content:flex-start;
  }

  .mrtb-ft-game-name-grid,
  .mrtb-ft-game-players,
  .mrtb-ft-game-players[data-count]{
    grid-template-columns:1fr !important;
  }

  .mrtb-ft-game-players[data-count] > article{
    grid-column:auto !important;
  }

  .mrtb-ft-game-count-buttons{
    grid-template-columns:repeat(5,minmax(0,1fr));
  }

  .mrtb-ft-game-result-actions{
    grid-template-columns:1fr;
  }
}


/* =========================================================
   v13 · Ατομική συγχορδία ανά παίκτη · εντυπωσιακό arena
   ========================================================= */

.mrtb-app.mrtb-fysikes-triads-game-mode[data-scene="t2-triads-in-scales"] .mrtb-board-wrap{
  background:
    radial-gradient(circle at 8% 12%,rgba(99,205,255,.30),transparent 24%),
    radial-gradient(circle at 90% 8%,rgba(255,204,78,.24),transparent 22%),
    radial-gradient(circle at 50% 100%,rgba(117,100,255,.16),transparent 34%),
    linear-gradient(135deg,#c9f2ff 0%,#eafcff 45%,#efffd9 100%) !important;
}

.mrtb-ft-game-shell.playing.individual-questions{
  gap:10px;
}

.mrtb-ft-game-arena-head{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) minmax(190px,.28fr);
  align-items:center;
  gap:14px;
  min-height:88px;
  padding:11px 15px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.84);
  border-radius:22px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.96),rgba(240,249,255,.94));
  box-shadow:0 16px 36px rgba(36,78,108,.14);
}

.mrtb-ft-game-arena-head::before{
  content:"";
  position:absolute;
  top:-45px;
  right:22%;
  width:180px;
  height:180px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(68,151,255,.15),transparent 68%);
  pointer-events:none;
}

.mrtb-ft-game-arena-head.revealing{
  background:linear-gradient(135deg,rgba(231,255,240,.98),rgba(255,255,255,.96));
  box-shadow:0 16px 36px rgba(35,153,92,.14);
}

.mrtb-ft-game-round-orb{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:auto auto;
  grid-template-rows:auto 1fr;
  place-items:center;
  min-width:76px;
  min-height:68px;
  padding:6px 10px;
  border-radius:20px;
  color:#fff;
  background:linear-gradient(145deg,#263044,#45536d);
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.12),0 10px 20px rgba(38,48,68,.22);
}

.mrtb-ft-game-round-orb small{
  grid-column:1 / -1;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.mrtb-ft-game-round-orb strong{
  font-size:28px;
  line-height:1;
  font-weight:1000;
}

.mrtb-ft-game-round-orb span{
  align-self:end;
  padding-bottom:3px;
  font-size:10px;
  font-weight:900;
  opacity:.75;
}

.mrtb-ft-game-arena-copy{
  position:relative;
  z-index:1;
  min-width:0;
}

.mrtb-ft-game-arena-copy > span{
  color:#3284b5;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.13em;
}

.mrtb-ft-game-arena-copy h2{
  margin:3px 0 2px;
  color:#263044;
  font-size:20px;
  line-height:1.1;
  font-weight:1000;
}

.mrtb-ft-game-arena-copy p{
  margin:0;
  color:#64748a;
  font-size:10px;
  line-height:1.4;
  font-weight:800;
}

.mrtb-ft-game-live-status{
  position:relative;
  z-index:1;
  padding:9px 11px;
  border:1px solid rgba(38,48,68,.08);
  border-radius:16px;
  background:rgba(255,255,255,.78);
}

.mrtb-ft-game-live-status > div:first-child{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px;
}

.mrtb-ft-game-live-status strong{
  color:#28364b;
  font-size:17px;
  line-height:1;
  font-weight:1000;
}

.mrtb-ft-game-live-status span{
  color:#6f7f95;
  font-size:8px;
  font-weight:950;
  text-transform:uppercase;
}

.mrtb-ft-game-live-meter{
  overflow:hidden;
  height:6px;
  margin-top:7px;
  border-radius:999px;
  background:#e6edf4;
}

.mrtb-ft-game-live-meter i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#4b91ff,#32c6d8);
  transition:width .28s ease;
}

.mrtb-ft-game-auto-bar{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:5px;
  background:rgba(54,184,116,.14);
}

.mrtb-ft-game-auto-bar i{
  display:block;
  height:100%;
  background:#36b874;
  animation:mrtb-ft-auto-next 3s linear forwards;
}

.mrtb-ft-game-player-card{
  position:relative;
  overflow:hidden;
  padding:8px;
  border-radius:18px;
  background:rgba(255,255,255,.96);
  box-shadow:0 10px 24px rgba(44,86,108,.11);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}

.mrtb-ft-game-player-card::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:4px;
  background:linear-gradient(90deg,#ffbd29,#ffd76c);
}

.mrtb-ft-game-player-card.minor::before{
  background:linear-gradient(90deg,#7e85ff,#6269dc);
}

.mrtb-ft-game-player-card.halfdim::before{
  background:linear-gradient(90deg,#ff7394,#db456f);
}

.mrtb-ft-game-player-card:not(.locked):hover{
  transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(44,86,108,.16);
}

.mrtb-ft-game-player-card.locked{
  border-color:rgba(54,169,222,.35);
  box-shadow:0 10px 24px rgba(52,156,211,.13),inset 0 0 0 1px rgba(52,156,211,.08);
}

.mrtb-ft-game-player-card.is-correct{
  border-color:#59cc8a;
  box-shadow:0 12px 28px rgba(38,181,102,.18),inset 0 0 0 1px rgba(38,181,102,.10);
  animation:mrtb-ft-card-correct .42s ease both;
}

.mrtb-ft-game-player-card.is-wrong{
  border-color:#ff8b91;
  box-shadow:0 12px 28px rgba(231,74,84,.13);
  animation:mrtb-ft-card-wrong .36s ease both;
}

@keyframes mrtb-ft-card-correct{
  0%{transform:scale(.98);}
  55%{transform:scale(1.025);}
  100%{transform:scale(1);}
}

@keyframes mrtb-ft-card-wrong{
  0%,100%{transform:translateX(0);}
  30%{transform:translateX(-4px);}
  65%{transform:translateX(4px);}
}

.mrtb-ft-game-player-head{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  min-height:34px !important;
  margin:0 0 6px !important;
}

.mrtb-ft-game-player-avatar{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:10px;
  color:#fff;
  background:linear-gradient(145deg,#4b91ff,#34c6d9);
  font-size:11px;
  font-weight:1000;
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.09);
}

.mrtb-ft-game-player-name{
  min-width:0;
}

.mrtb-ft-game-player-name strong{
  display:block;
  overflow:hidden;
  color:#2c384c;
  font-size:11px;
  line-height:1.1;
  font-weight:1000;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mrtb-ft-game-player-name small{
  display:block;
  margin-top:2px;
  color:#8895a7;
  font-size:7px;
  line-height:1;
  font-weight:850;
  text-transform:uppercase;
}

.mrtb-ft-game-score{
  padding:5px 7px !important;
  border-radius:9px !important;
  color:#fff !important;
  background:#263044 !important;
  font-size:8px !important;
  line-height:1 !important;
  font-weight:1000 !important;
}

.mrtb-ft-game-personal-question{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  min-height:52px;
  margin-bottom:6px;
  padding:6px 7px;
  border-radius:14px;
  background:linear-gradient(145deg,#fff8dc,#fff);
  border:1px solid rgba(255,189,41,.20);
}

.mrtb-ft-game-personal-question.minor{
  background:linear-gradient(145deg,#eff0ff,#fff);
  border-color:rgba(126,133,255,.20);
}

.mrtb-ft-game-personal-question.halfdim{
  background:linear-gradient(145deg,#ffeaf0,#fff);
  border-color:rgba(255,115,148,.20);
}

.mrtb-ft-game-personal-quality{
  display:grid;
  place-items:center;
  min-width:43px;
  height:38px;
  padding:0 5px;
  border-radius:11px;
  color:#5d4600;
  background:linear-gradient(145deg,#ffbd29,#ffd76c);
  font-size:8px;
  font-weight:1000;
}

.mrtb-ft-game-personal-question.minor .mrtb-ft-game-personal-quality{
  color:#fff;
  background:linear-gradient(145deg,#7e85ff,#6269dc);
}

.mrtb-ft-game-personal-question.halfdim .mrtb-ft-game-personal-quality{
  color:#fff;
  background:linear-gradient(145deg,#ff7394,#db456f);
}

.mrtb-ft-game-personal-chord{
  min-width:0;
}

.mrtb-ft-game-personal-chord strong{
  display:block;
  overflow:hidden;
  color:#263044;
  font-size:17px;
  line-height:1;
  font-weight:1000;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mrtb-ft-game-personal-chord small{
  display:block;
  margin-top:3px;
  color:#75849a;
  font-size:8px;
  line-height:1;
  font-weight:900;
}

.mrtb-ft-game-personal-target{
  padding:5px 7px;
  border-radius:9px;
  color:#4f6077;
  background:rgba(255,255,255,.82);
  border:1px solid rgba(38,48,68,.07);
  font-size:7px;
  font-weight:1000;
  white-space:nowrap;
}

.mrtb-ft-game-personal-solution{
  margin-bottom:5px;
  padding:6px 7px;
  border-radius:11px;
  background:#e3fff0;
  border:1px solid rgba(51,185,109,.20);
}

.mrtb-ft-game-personal-solution.wrong{
  background:#fff1f2;
  border-color:rgba(232,81,90,.18);
}

.mrtb-ft-game-personal-solution span{
  display:block;
  color:#38825b;
  font-size:7px;
  font-weight:1000;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.mrtb-ft-game-personal-solution.wrong span{
  color:#b64a52;
}

.mrtb-ft-game-personal-solution strong{
  display:block;
  margin-top:2px;
  color:#195e3b;
  font-size:9px;
  line-height:1.25;
  font-weight:1000;
}

.mrtb-ft-game-personal-solution.wrong strong{
  color:#8f3038;
}

.mrtb-ft-game-selection-count{
  margin-bottom:5px;
  padding:4px 6px;
  border-radius:8px;
  color:#6d7c91;
  background:#eef4f8;
  font-size:7px;
  line-height:1;
  font-weight:1000;
  text-align:center;
}

.mrtb-ft-game-answer-grid button{
  transition:transform .12s ease,box-shadow .12s ease,background .12s ease;
}

.mrtb-ft-game-answer-grid button:not(:disabled):hover{
  transform:translateY(-1px);
  box-shadow:0 5px 12px rgba(66,136,215,.14);
}

.mrtb-ft-game-answer-grid button.selected{
  transform:translateY(-1px);
}

.mrtb-ft-game-players[data-count="1"] .mrtb-ft-game-player-card,
.mrtb-ft-game-players[data-count="2"] .mrtb-ft-game-player-card{
  padding:13px;
  border-radius:22px;
}

.mrtb-ft-game-players[data-count="1"] .mrtb-ft-game-personal-question,
.mrtb-ft-game-players[data-count="2"] .mrtb-ft-game-personal-question{
  min-height:68px;
  padding:9px 10px;
}

.mrtb-ft-game-players[data-count="1"] .mrtb-ft-game-personal-chord strong,
.mrtb-ft-game-players[data-count="2"] .mrtb-ft-game-personal-chord strong{
  font-size:25px;
}

.mrtb-ft-game-players[data-count="1"] .mrtb-ft-game-answer-grid button,
.mrtb-ft-game-players[data-count="2"] .mrtb-ft-game-answer-grid button{
  min-height:56px;
}

.mrtb-ft-game-players[data-count="7"] .mrtb-ft-game-personal-question,
.mrtb-ft-game-players[data-count="8"] .mrtb-ft-game-personal-question,
.mrtb-ft-game-players[data-count="9"] .mrtb-ft-game-personal-question{
  grid-template-columns:auto 1fr;
}

.mrtb-ft-game-players[data-count="7"] .mrtb-ft-game-personal-target,
.mrtb-ft-game-players[data-count="8"] .mrtb-ft-game-personal-target,
.mrtb-ft-game-players[data-count="9"] .mrtb-ft-game-personal-target{
  display:none;
}

/* setup polish */
.mrtb-ft-game-setup-hero{
  background:
    radial-gradient(circle at 90% 20%,rgba(75,145,255,.13),transparent 28%),
    linear-gradient(145deg,rgba(255,255,255,.96),rgba(238,249,255,.95));
}

.mrtb-ft-game-start{
  position:relative;
  overflow:hidden;
  min-height:48px;
  font-size:13px;
}

.mrtb-ft-game-start::after{
  content:"";
  position:absolute;
  top:-50%;
  left:-35%;
  width:24%;
  height:200%;
  transform:rotate(20deg);
  background:rgba(255,255,255,.28);
  animation:mrtb-ft-start-shine 2.6s ease-in-out infinite;
}

@keyframes mrtb-ft-start-shine{
  0%,55%{left:-35%;}
  100%{left:125%;}
}

@media (max-width:980px){
  .mrtb-ft-game-arena-head{
    grid-template-columns:auto 1fr;
  }

  .mrtb-ft-game-live-status{
    grid-column:1 / -1;
  }
}