/* V3 is the existing Neon Cabinet, served with its complete original polish.
 * Only added controls and targeted interaction improvements belong here.
 * No palette, typography, CRT, lobby, highway or results-theme overrides.
 */
#m2-keep-pitch.kp3 .kp3-charge {
  display:flex;align-items:center;gap:12px;margin:-2px 0 10px;padding:0 4px;
  color:var(--accent);font:400 var(--kpp-px-micro)/1.7 var(--kpp-arcade);
}
#m2-keep-pitch.kp3 .kp3-chargeTrack {
  flex:1;min-width:24px;height:5px;border-radius:3px;overflow:hidden;
  background:rgba(255,0,255,.12);box-shadow:inset 0 0 0 1px rgba(255,0,255,.18);
}
#m2-keep-pitch.kp3 #kp3-chargeFill {
  display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:left;
  background:linear-gradient(90deg,var(--accent),var(--accent2));
  box-shadow:0 0 10px var(--accent2);transition:transform .1s linear;
}
#m2-keep-pitch.kp3 #kp3-chargeCount {color:var(--gold);min-width:62px;text-align:right}
#m2-keep-pitch.kp3 .kp3-pause {
  position:absolute;inset:0;z-index:40;display:flex;flex-direction:column;
  justify-content:center;align-items:center;gap:24px;
  background:rgba(0,4,8,.88);color:var(--accent);text-align:center;padding:24px;
}
#m2-keep-pitch.kp3 .kp3-pause[hidden] {display:none}
#m2-keep-pitch.kp3 .kp3-pause strong {
  font:400 var(--kpp-px-hero)/1.8 var(--kpp-arcade);text-shadow:0 0 18px var(--accent);
}
#m2-keep-pitch.kp3 :is(button,a,input):focus-visible {outline:2px solid var(--gold);outline-offset:4px}
#m2-keep-pitch.kp3 .m2-kp__resultsCtas {margin:18px 0!important}
#m2-keep-pitch.kp3 .m2-kp__ctrlBtn {touch-action:manipulation;min-width:44px;min-height:44px}
/* Keep occasional announcements off the middle of the singing lane. */
#m2-keep-pitch.kp3 .m2-kp__stageCommentator {
  top:12px;padding:7px 12px;max-width:calc(100% - 24px);
  font-size:clamp(.5rem,1.4vw,.68rem);
  transform:translateX(-50%) scale(.96);
}
#m2-keep-pitch.kp3 .m2-kp__stageCommentator.is-show {transform:translateX(-50%) scale(1)}
@media(max-width:480px) {
  #m2-keep-pitch.kp3 .kp3-charge {gap:8px;font-size:.43rem}
  #m2-keep-pitch.kp3 #kp3-chargeCount {min-width:48px}
}
@media(prefers-reduced-motion:reduce) {
  #m2-keep-pitch.kp3 #kp3-chargeFill {transition:none}
}

/* The embed window is already a cabinet. During practice, use its full
 * viewport instead of nesting a 1100px page and a padded card inside it.
 * The class is scoped to the two single-app shells inside M2 OS windows
 * and removed on exit. World embeds and standalone pages do not opt in.
 */
:is(#m2w-app-embed, #m2os-app-shell).kp3-embed-practice {
  display:block;justify-content:flex-start;
}
.kp3-embed-practice #m2-keep-pitch.kp3 {
  /* M2 OS injects #m2os-fit after load, including an !important 1180px
   * cap. Match importance and outrank it only for this active V3 screen. */
  box-sizing:border-box;width:100%!important;max-width:none!important;margin:0!important;
  height:100vh;height:100dvh;min-height:440px;padding:4px;
  display:flex;flex-direction:column;
}
.kp3-embed-practice #m2-keep-pitch.kp3 > .m2-kp__header {display:none}
.kp3-embed-practice #m2-keep-pitch.kp3 > .m2-kp__card {
  display:flex;flex:1;min-height:0;width:100%;margin:0;
  padding:0!important;border:0!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;
}
.kp3-embed-practice #m2-keep-pitch.kp3 > .m2-kp__card::before {display:none}
.kp3-embed-practice #m2-keep-pitch.kp3 [data-screen="practice"] {
  display:flex!important;flex-direction:column;flex:1;min-width:0;min-height:0;gap:6px;
}
.kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__practiceTop {
  flex-shrink:0;margin:0!important;padding:7px 10px!important;gap:10px!important;
}
.kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__practiceSong {min-width:0}
.kp3-embed-practice #m2-keep-pitch.kp3 .kp3-charge {
  flex-shrink:0;margin:0;padding:2px 4px;
}
.kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__canvasWrap {
  flex:1 0 180px;min-height:180px;
}
.kp3-embed-practice #m2-keep-pitch.kp3 #m2-kp-canvas {
  position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;
}
.kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__lyrics {flex-shrink:0}
.kp3-embed-practice #m2-keep-pitch.kp3 .kp3-stageFooter {
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:6px 12px;flex-shrink:0;
}
.kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__pitchMonitor {
  position:static;transform:none;flex:1 1 280px;min-width:0;max-width:100%;
  justify-content:center;flex-wrap:wrap;gap:8px!important;
  padding:6px 10px!important;border-radius:10px!important;box-shadow:none!important;
}
.kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__pitchMonitorNote {min-width:40px}
.kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__pitchMonitorMeta {display:flex!important}
.kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__pitchMonitorMetaItem {
  flex-direction:row;gap:6px;padding:4px 6px;border:0!important;background:none!important;
}
/* The note, cents and gauge give the live reading without a second Hz tile
 * and a sentence repeating the same deviation. Target stays visible. */
.kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__pitchMonitorMetaItem:last-child,
.kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__pitchMonitorStatus {display:none}
.kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__controls {
  flex:0 0 auto;max-width:100%;flex-wrap:wrap;justify-content:center;
  margin:0!important;padding:4px 6px!important;gap:8px!important;
  border:0;background:transparent;box-shadow:none;
}
.kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__ctrlBtn,
.kp3-embed-practice #m2-keep-pitch.kp3 #m2-kp-playPause {
  width:44px!important;height:44px!important;
}
@media(max-width:720px) {
  .kp3-embed-practice #m2-keep-pitch.kp3 {padding:4px}
  .kp3-embed-practice #m2-keep-pitch.kp3 .kp3-stageFooter {justify-content:center}
  .kp3-embed-practice #m2-keep-pitch.kp3 .m2-kp__pitchMonitor {flex-basis:100%}
}
