/* M15: same player controls across widths; existing tools panel remains unchanged. */
body.nr-site.player-layout:not(.stage-view):not(.note-reading-active) .page-control :is(#prev,#next,#pageLabel){display:none!important}
body.nr-site.player-layout:not(.stage-view):not(.note-reading-active) #portraitPageStrip{display:inline-flex!important;direction:ltr;overflow:hidden;flex:none;vertical-align:middle;touch-action:pan-y}
body.nr-site.player-layout #portraitPageTrack{display:flex;align-items:center;gap:2px;width:max-content;will-change:transform;transition:transform .52s cubic-bezier(.22,1,.36,1)}
body.nr-site.player-layout #portraitPageStrip .portrait-page-number{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;flex:0 0 30px;width:30px!important;min-width:30px!important;height:34px!important;min-height:34px!important;margin:0!important;padding:2px!important;border:1px solid #57b2e9!important;border-radius:7px!important;background:#eef8ff!important;color:#0889d2!important;font-size:14px!important;font-weight:700;line-height:1}
body.nr-site.player-layout #portraitPageStrip .portrait-page-number[aria-current=page]{background:#128de0!important;color:#fff!important;border-color:#128de0!important;box-shadow:0 2px 5px #0876bd35}
body.nr-site.dark.player-layout #portraitPageStrip .portrait-page-number{background:#173a54!important;color:#b6e7ff!important}
body.nr-site.dark.player-layout #portraitPageStrip .portrait-page-number[aria-current=page]{background:#087cca!important;color:#fff!important}
body.nr-site.player-layout #portraitPageStrip .portrait-page-number:focus-visible{outline:2px solid #f5ad35;outline-offset:-3px}
@media(prefers-reduced-motion:reduce){body.nr-site.player-layout #portraitPageTrack{transition:none}}
@media(max-width:650px) and (orientation:portrait){
 body.nr-site.player-layout:not(.stage-view):not(.note-reading-active) #player>.score-tools{grid-template-columns:minmax(82px,1fr) minmax(56px,.65fr) minmax(140px,1.35fr)!important;grid-template-areas:"pages meter reading"!important;direction:ltr}
 body.nr-site.player-layout #player>.score-tools>.time-readout{grid-area:meter;justify-self:center!important;text-align:center;white-space:nowrap}
 body.nr-site.player-layout #player>.score-tools>.page-control{grid-area:pages;justify-self:start!important}
 body.nr-site.player-layout #player>.score-tools>#practiceModePair{grid-area:reading;justify-self:end!important;width:100%;margin:0!important}
 body.nr-site.player-layout #practiceFooter #playerVersionsDirect{display:inline-flex!important}
}
@media(max-width:350px) and (orientation:portrait){
 body.nr-site.player-layout:not(.stage-view):not(.note-reading-active) #player>.score-tools{grid-template-columns:84px minmax(50px,1fr) minmax(134px,1.4fr)!important;padding-inline:4px!important}
 body.nr-site.player-layout #player>.score-tools #practiceModePair{gap:3px}
}
body.nr-site.player-layout #playerVersionsDialog{width:min(680px,calc(100vw - 24px));max-width:680px;max-height:calc(100dvh - 24px);padding:20px;background:linear-gradient(155deg,var(--nr-surface,var(--card)),var(--nr-bg,var(--bg)));border:1px solid var(--nr-border,var(--line));border-radius:20px;color:var(--nr-text,var(--text));box-shadow:0 24px 70px #071f3d55}
#playerVersionsDialog{width:min(680px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:20px;border:1px solid var(--nr-border,var(--line));border-radius:20px;background:linear-gradient(155deg,var(--nr-surface,var(--card)),var(--nr-bg,var(--bg)));color:var(--nr-text,var(--text));box-shadow:0 24px 70px #071f3d55}
#playerVersionsDialog::backdrop{background:#071f3d99;backdrop-filter:blur(4px)}
#playerVersionsDialog header{display:flex;align-items:center;justify-content:space-between;gap:10px}
#playerVersionsDialog header h2{margin:0;font-size:18px}
#playerVersionsDialog header button{width:38px;min-width:38px;height:38px;min-height:38px;border-radius:11px}
#playerVersionsDialog .version-dialog-hint{margin:7px 0 0;color:var(--nr-muted,var(--muted));font-size:12px}
#playerVersionsDialog .version-dialog-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));direction:rtl;align-items:end;gap:10px;min-height:220px;padding:24px 0 10px}
#playerVersionsDialog .version-level{display:flex;flex-direction:column;gap:10px;min-width:0;min-height:160px;margin:0;padding:14px 10px;border:1px solid;border-radius:16px;box-shadow:inset 0 1px #ffffff9c,0 8px 24px #173b5b15}
#playerVersionsDialog .version-level[data-level=easy]{transform:translateY(18px);background:#e8f7e9;border-color:#85c58c;color:#286a34}
#playerVersionsDialog .version-level[data-level=medium]{background:#fff6da;border-color:#e0bc62;color:#846009}
#playerVersionsDialog .version-level[data-level=hard]{transform:translateY(-18px);background:#fde9e6;border-color:#d99085;color:#993c32}
#playerVersionsDialog .version-level.unavailable{background:#edf0f2!important;border-color:#c9d0d4!important;color:#74828b!important;opacity:.75}
#playerVersionsDialog .version-level>strong{display:block;margin:0;text-align:center;font-size:15px;font-weight:850}
#playerVersionsDialog .version-level>small{margin:auto;text-align:center;font-size:11px}
#playerVersionsDialog .version-choices{display:flex;flex-direction:column;gap:6px;min-width:0;margin:0}
#playerVersionsDialog .version-chip{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;width:100%;min-height:50px;padding:6px;border:1px solid currentColor;border-radius:11px;background:#ffffffc9;color:inherit;font-size:11px;font-weight:700;line-height:1.4;white-space:normal;text-align:center}
#playerVersionsDialog .version-chip.selected{outline:3px solid currentColor;outline-offset:1px;background:#fff}
#playerVersionsDialog .version-current{font-size:9px;font-weight:700}
#playerVersionsDialog .version-chip:focus-visible{outline:3px solid #157bd0;outline-offset:2px}
@media(max-width:420px){#playerVersionsDialog{padding:14px}#playerVersionsDialog .version-dialog-steps{gap:5px;min-height:185px;padding-top:20px}#playerVersionsDialog .version-level{padding:10px 5px;min-height:145px}#playerVersionsDialog .version-chip{font-size:10px;min-height:46px}}
/* Tablet: move both practice modes below the score, retaining the same 44px controls. */
body.nr-site.player-layout.practice-tablet-footer:not(.stage-view):not(.note-reading-active) #player>.score-tools{display:none!important}
body.nr-site.player-layout.practice-tablet-footer:not(.stage-view):not(.note-reading-active) #practiceFooter{display:flex!important;flex-direction:column!important;align-items:center;justify-content:center;gap:2px;min-height:94px;padding:2px 8px}
body.nr-site.player-layout.practice-tablet-footer #desktopPracticeActions,body.nr-site.player-layout.practice-tablet-footer #practicePrimaryControls{display:flex!important;align-items:center;justify-content:center;width:100%;gap:4px}
body.nr-site.player-layout.practice-tablet-footer #desktopPracticeActions{order:0}
body.nr-site.player-layout.practice-tablet-footer #practicePrimaryControls{order:1}
body.nr-site.player-layout.practice-desktop-footer #practicePrimaryControls{display:flex!important;align-items:center;justify-content:center;gap:4px;direction:rtl;flex:none}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls :is(#playerQuickControls,#playerDock){display:contents!important}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls :is(#stop,#playerMoreButton,#seek){display:none!important}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls #loading:not(:empty){position:absolute;bottom:100%;right:8px;z-index:5}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls :is(.practice-hand-chip,#handCoordinationToggle,#metro,#play,#playerSpeed,#playerSettingsButton,#playerPedalToggle,#playerVersionsDirect){box-sizing:border-box;display:inline-flex!important;align-items:center;justify-content:center;flex:0 0 auto;height:44px!important;min-height:44px!important;min-width:40px!important;width:40px!important;margin:0!important;padding:5px!important;border-radius:11px!important}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls .practice-hand-chip:has(#right){order:1}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls #handCoordinationToggle{order:2}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls .practice-hand-chip:has(#left){order:3}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls #play{order:4;background:#176db0!important;color:white!important}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls #metro{order:5}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls #playerSpeed{order:6;width:66px!important;min-width:66px!important;direction:ltr}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls #playerSettingsButton{order:7}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls #playerPedalControl{display:contents!important}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls #playerPedalToggle{order:8}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls #playerVersionsDirect{order:9;display:inline-flex!important;width:82px!important;min-width:82px!important;font-size:10px;font-weight:700;white-space:normal;text-align:center;color:var(--nr-primary,#176db0)}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls :is(#handCoordinationToggle,#playerPedalToggle,#playerSettingsButton) span{display:none!important}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practicePrimaryControls :is(.ui-icon,.icon,.practice-hand-icon){width:20px;height:20px;flex:none}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #desktopPracticeActions #practiceModePair{display:flex;width:auto!important;max-width:none!important;margin:0!important;gap:5px;align-items:center;direction:rtl}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #desktopPracticeActions #practiceModePair>button{flex:0 0 106px!important;width:106px!important;min-width:106px!important;max-width:106px!important;height:40px!important;min-height:40px!important}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #desktopPracticePages{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:0;width:auto;margin:0!important;flex:none}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #desktopPracticePages .time-readout{display:flex;align-items:center;justify-content:center;margin:0!important;font-size:10px}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #desktopPracticePages #timeNow{display:none}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #desktopPracticePages .page-control{display:flex;align-items:center;justify-content:center;margin:0!important;gap:0;direction:ltr}
body.nr-site.player-layout.practice-desktop-footer:not(.stage-view):not(.note-reading-active) #practiceFooter{display:flex!important;flex-direction:row!important;direction:rtl;justify-content:center!important;align-items:center;gap:clamp(14px,4vw,70px);min-height:52px;padding:2px 12px}
body.nr-site.player-layout.practice-desktop-footer #desktopPracticeActions{display:flex!important;align-items:center;justify-content:center;order:2;flex:none}
body.nr-site.player-layout.practice-desktop-footer #practicePrimaryControls{order:1}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #practiceFooter>#desktopPracticePages{display:none!important}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #player>.player-title :is(#focus,#guidePlayer,#download,#scoreLike){display:inline-flex}
@media(min-width:650px) and (max-width:800px){body.nr-site.player-layout.practice-tablet-footer #practicePrimaryControls{gap:2px}body.nr-site.player-layout.practice-tablet-footer #practicePrimaryControls :is(.practice-hand-chip,#handCoordinationToggle,#metro,#play,#playerSettingsButton,#playerPedalToggle){width:38px!important;min-width:38px!important}}
@media(max-width:1100px){#playerTempo[open]{right:auto!important;inset-inline-start:auto!important;transform:none!important;margin:0!important}}

@media(min-width:1101px) and (min-height:651px){
 #playerTempo[open]{
   position:fixed!important;margin:0!important;width:158px!important;max-width:158px!important;
   min-height:0;max-height:calc(100dvh - 16px);padding:10px!important;border-radius:18px;
   overflow:visible;background:var(--nr-surface,var(--card));box-shadow:0 12px 34px #15344c45;
 }
 #playerTempo[open]::after{content:'';position:absolute;top:100%;left:calc(var(--tempo-tail-x,79px) - 7px);border:7px solid transparent;border-top-color:var(--nr-surface,var(--card))}
 #playerTempo header{padding-bottom:3px}
 #playerTempo h2{font-size:12px;font-weight:800}
 #playerTempo header button{width:28px;height:28px;min-width:28px!important;min-height:28px!important;padding:4px}
 #playerTempo .panel-content{position:relative;display:flex;flex-direction:column;align-items:center;padding:0}
 #playerTempo .tempo-controls{display:flex!important;flex-direction:column;align-items:center;width:100%;height:214px;padding:0!important;gap:0}
 #playerTempo .tempo-equation{order:0;width:100%;height:29px;display:flex;justify-content:center;gap:3px;font-size:9px}
 #playerTempo .tempo-equation #unitBtn,#playerTempo .tempo-equation #resetTempo{width:28px;min-width:28px;min-height:28px;height:28px;padding:3px}
 #playerTempo .tempo-equation #tempoWord,#playerTempo .tempo-equation>span{display:none}
 #playerTempo #speed{
   order:1;display:block;writing-mode:vertical-lr;direction:rtl;appearance:slider-vertical;
   width:28px!important;min-width:28px!important;max-width:28px;height:171px!important;min-height:171px;
   margin:3px 0 7px -35px!important;flex:none;accent-color:#078de1;touch-action:none;
 }
 #playerTempo #portraitTempoTicks{display:block!important;position:absolute;left:68px;top:35px;width:48px;height:165px;pointer-events:none}
 #playerTempo #portraitTempoTicks span{position:absolute;left:0;transform:translateY(-50%);font-size:10px;color:var(--nr-muted,var(--muted));white-space:nowrap}
 #playerTempo #portraitTempoTicks span::before{content:'—';margin-right:3px;color:#aacbdd}
 #playerTempo #portraitTempoSteps{display:flex!important;direction:ltr;justify-content:space-between;align-items:center;gap:3px;width:116px;margin-top:2px}
 #playerTempo #portraitTempoSteps button{width:29px;min-width:29px!important;height:30px;min-height:30px!important;padding:0;border-radius:50%;font-size:16px}
 #playerTempo #bpm{position:absolute;top:216px;left:50%;transform:translateX(-50%);z-index:2;
   width:48px;min-width:48px;height:34px;margin:0;padding:2px;border:1px solid #aacfe5;border-radius:8px;
   background:var(--nr-surface,var(--card));color:var(--nr-text,var(--text));font-size:17px;font-weight:700;text-align:center;
 }
 #playerTempo #bpm::-webkit-inner-spin-button,#playerTempo #bpm::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
 #playerTempo #unitOptions:not([hidden]){position:absolute;top:25px;left:0;right:0;z-index:3;display:flex;flex-wrap:wrap;background:var(--nr-surface,var(--card));box-shadow:0 4px 14px #1234}
}
#playerTempo[open]{right:auto!important;inset-inline-start:auto!important;transform:none!important;margin:0!important}
body.nr-site.player-layout.practice-desktop-footer #desktopPracticePages #portraitPageStrip .portrait-page-number{width:30px!important;min-width:30px!important;max-width:30px!important}
/* Keep page numbers visually distinct from the musical measure readout. */
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #desktopPracticePages{display:grid!important;grid-template-columns:max-content 48px;grid-template-rows:12px 34px;column-gap:6px;align-items:center;justify-items:center;direction:ltr}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #desktopPracticePages::before{content:'صفحه';grid-column:1;grid-row:1;align-self:end;font-size:10px;font-weight:750;line-height:1;color:var(--nr-muted,var(--muted))}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #desktopPracticePages .page-control{grid-column:1;grid-row:2}
body.nr-site.player-layout:is(.practice-tablet-footer,.practice-desktop-footer) #desktopPracticePages .time-readout{grid-column:2;grid-row:2;box-sizing:border-box;min-width:46px;min-height:28px;padding:2px 3px!important;border:1px solid var(--nr-border,var(--line));border-radius:8px;background:var(--nr-surface,var(--card));font-size:10px!important;line-height:1.2;text-align:center}
@media(max-width:650px) and (orientation:portrait){
 body.nr-site.player-layout:not(.stage-view):not(.note-reading-active) #player>.score-tools{grid-template-columns:minmax(120px,1fr) minmax(48px,.5fr) minmax(132px,1.35fr)!important}
 body.nr-site.player-layout #player>.score-tools>.page-control{display:flex!important;align-items:center;gap:3px}
 body.nr-site.player-layout #player>.score-tools>.page-control::before{content:'صفحه';font-size:9px;font-weight:750;color:var(--nr-muted,var(--muted));white-space:nowrap}
}
@media(orientation:landscape) and (max-width:1100px) and (max-height:650px){
 body.nr-site.player-layout #practiceFooter .page-control::before{content:'صفحه';margin-inline-end:3px;font-size:9px;font-weight:750;color:var(--nr-muted,var(--muted));white-space:nowrap}
}