/* Режим проверки уроков (review.js): ручки ✏️, окно замечания, «Мои замечания», шапка режима и карта курса.
   Отдельный файл — общий app.css правит другой экран (игры); цвета — переменные темы app.css (светлая и тёмная). */

/* ученические части главной и урока проверяющему не нужны: норма дня, «Повторить», закладка-снимок, «Сообщить об ошибке» */
html[data-review="1"] .today, html[data-review="1"] .rep, html[data-review="1"] #snap, html[data-review="1"] #rpt,
html[data-review="1"] .coach { display: none !important }

/* место, к которому можно оставить замечание */
[data-rv] { position: relative }
.theory [data-rv="card"], .q[data-rv], .vc[data-rv], .ex[data-rv] { padding-right: 44px }
h1[data-rv], h2[data-rv] { padding-right: 46px }
.rv-pen {
  position: absolute; top: 6px; right: 6px; z-index: 2; display: inline-flex; align-items: center; gap: 3px;
  min-width: 34px; height: 30px; padding: 0 7px; border-radius: 9px; border: 1px solid var(--line);
  background: var(--paper); color: var(--ink); font: 600 14px/1 var(--fb); cursor: pointer; opacity: .82;
}
.rv-pen:hover, .rv-pen:focus-visible { opacity: 1; border-color: var(--acc); outline: none }
.rv-pen.has { opacity: 1; border-color: var(--acc) }
.rv-pen b { font: 800 12px/1 var(--fb); color: var(--acc) }
h1[data-rv] .rv-pen, h2[data-rv] .rv-pen { top: 50%; margin-top: -15px; font-size: 14px }
.ex[data-rv] .rv-pen { top: 50%; margin-top: -15px }
.rv-hit { outline: 2px solid var(--acc); outline-offset: 3px; border-radius: 10px; transition: outline-color .4s }

/* внизу шага: общее замечание и оценка урока */
.rv-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: 22px 0 6px; padding-top: 14px; border-top: 1px dashed var(--line) }
.rv-foot .rv-gen { width: auto; min-height: 42px; padding: 0 16px }
.rv-stars { display: flex; align-items: center; gap: 2px }
.rv-stars span { margin-right: 6px; color: var(--mut); font-size: 13px; font-weight: 600 }
.rv-star { width: 34px; height: 34px; border: 0; background: none; color: var(--line); font-size: 24px; line-height: 1; cursor: pointer; padding: 0 }
.rv-star.on { color: #e8a93c }
.rv-star:focus-visible { outline: 2px solid var(--acc); border-radius: 8px }

/* «Замечание к выделенному» — над нижними вкладками, не мешает меню выделения системы */
.rv-sel { position: absolute; left: 50%; bottom: 96px; transform: translateX(-50%); z-index: 7; width: auto; min-height: 44px; padding: 0 18px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .22); white-space: nowrap }
:root[data-p="win"] .rv-sel { bottom: 28px }

/* окно замечания */
.rv-sheet .sh-box { max-height: 88%; overflow: auto }
.rv-sheet .rv-place { display: block; margin-bottom: 6px }
.rv-quote { margin: 6px 0 8px; padding: 8px 12px; border-left: 3px solid var(--acc); background: var(--card); border-radius: 0 10px 10px 0;
  font-size: 14px; color: var(--ink); overflow-wrap: anywhere }
.rv-list { list-style: none; margin: 6px 0; padding: 0 }
.rv-sheet .gbtn { display: flex; gap: 10px }

/* «Мои замечания» */
.rv-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px }
.rv-notes { list-style: none; margin: 0; padding: 0 }
.rv-n { padding: 12px 14px; margin-bottom: 10px; border: 1px solid var(--line); border-radius: 14px; background: var(--card); overflow-wrap: anywhere }
.rv-list .rv-n { padding: 9px 12px; margin-bottom: 8px }
.rv-n p { margin: 4px 0; font-size: 14.5px; white-space: pre-wrap }
.rv-n q { display: block; margin: 4px 0; color: var(--mut); font-size: 13.5px; font-style: italic }
.rv-where { display: block; color: var(--acc); font-weight: 700; font-size: 12.5px }
.rv-meta { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px }
.rv-st, .rv-q { font: 700 10.5px/1 var(--fb); letter-spacing: .05em; text-transform: uppercase; padding: 5px 8px; border-radius: 20px; border: 1px solid var(--line); color: var(--mut) }
.rv-n.fixed .rv-st { border-color: var(--g); color: var(--g) }
.rv-n.open .rv-st { border-color: var(--acc); color: var(--acc) }
.rv-q { border-style: dashed }
.rv-q.rv-bad { border-style: solid; border-color: var(--acc); color: var(--acc) }
.rv-reply { padding: 7px 10px; border-radius: 10px; background: var(--soft) }
.rv-acts { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 6px }
.rv-acts button { border: 0; background: none; padding: 4px 0; font: 700 13px var(--fb); color: var(--acc); cursor: pointer }
.rv-acts button.del { color: var(--mut) }
.rv-acts button.del.sure { color: #c8463d }

/* шапка режима проверки и карта курса */
.rv-ban { gap: 6px }
.rv-ban small { color: var(--mut); font-size: 12.5px }
.rv-ban .seg { align-self: flex-start; max-width: 100%; flex-wrap: wrap }
.rv-ban .lnk { align-self: flex-start }
.rv-mod { border: 1px solid var(--line); border-radius: 14px; background: color-mix(in srgb, var(--card) 94%, transparent); margin-bottom: 10px }
.rv-mod summary { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; cursor: pointer; list-style: none }
.rv-mod summary::-webkit-details-marker { display: none }
.rv-mod summary small { color: var(--mut); font-size: 12.5px }
.rv-mod .les { margin: 0 8px 10px }
.rv-l { cursor: pointer; color: var(--ink) !important }
.rv-l span { margin-left: auto; color: var(--mut); white-space: nowrap; font-size: 12px }