/* «Повторение» (review.html) в бумажной теме: счётчик-стикер, разделы, ошибки, прогноз (тренажёры — в practice.html). */
.page-review #app { display: grid; gap: 22px; }
.page-review #app > h1 { margin-bottom: 0; }
.page-review #app > .lead { margin: -8px 0 0; }
.page-review h2 { margin: 0 0 10px; }

/* главный блок: большое число на жёлтом стикере и одна кнопка */
.rv-hero { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 20px; align-items: center; padding: 22px 24px; }
.rv-count { min-width: 110px; padding: 10px 16px; text-align: center; font: 900 64px/1 var(--font-display); background: var(--n1); border: 2.5px solid var(--ink); border-radius: 6px 10px 5px 9px; box-shadow: 0 4px 0 var(--ink); transform: rotate(-2deg); }
.rv-hero.empty .rv-count { background: var(--leaf); }
.rv-text { display: grid; gap: 4px; }
.rv-text b { font: 700 22px/1.2 var(--font-display); }
.rv-text .muted { font: 18px/1.3 var(--font-hand); }

/* разделы */
.rv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.rv-type-text small { white-space: nowrap; }
.rv-type { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 12px; border: 2px solid var(--ink); border-radius: 12px; background: #fffdf7; }
.rv-type:not(.has) { background: var(--paper-2); }
.rv-type:not(.has) .rv-icon { background: var(--paper); color: #a8998a; }
.rv-type-text { display: grid; line-height: 1.25; }
.rv-type-text small { font: 16px var(--font-hand); }
.rv-icon { width: 42px; height: 42px; display: grid; place-items: center; font: 600 22px var(--font-kana); border: 2.5px solid var(--ink); border-radius: 50% 46% 52% 48%; background: var(--n3); }
.rv-type.has .rv-icon { background: var(--n1); }

/* ошибки и прогноз — два листа рядом */
.rv-two { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 22px; align-items: start; }
.rv-weak .hard-list { display: flex; flex-wrap: wrap; gap: 8px; }
.rv-weak .hard-list a { padding: 4px 10px; border: 2px solid var(--ink); border-radius: 8px; background: var(--n2); color: var(--ink); text-decoration: none; font: 500 14px var(--font-ui); box-shadow: 0 2px 0 var(--ink); }
.rv-weak .hard-list a:nth-child(3n) { transform: rotate(-1deg); } .rv-weak .hard-list a:nth-child(3n+1) { transform: rotate(.8deg); }
.rv-weak .hard-list a:hover { background: #ffc6da; }
.rv-bars { display: flex; align-items: flex-end; gap: 10px; height: 150px; padding-top: 4px; }
.rv-bar { flex: 1; height: 100%; display: grid; grid-template-rows: auto 1fr auto; justify-items: center; align-items: end; gap: 4px; }
.rv-bar u { display: block; width: 100%; min-height: 3px; background: var(--n3); border: 2px solid var(--ink); border-radius: 5px 5px 0 0; text-decoration: none; }
.rv-bar.today u { background: var(--shu); }
.rv-bar small { font: 700 13px var(--font-ui); }
.rv-bar span { font: 16px var(--font-hand); color: var(--ink-soft); }

/* ссылка на свободную тренировку («Практика» в «Курсе») */
.rv-free { margin: 0; font: 17px/1.35 var(--font-hand); }
.rv-free a { font-weight: 700; }

@media (max-width: 760px) {
  .rv-hero { grid-template-columns: auto minmax(0, 1fr); padding: 16px; }
  .rv-hero .btn { grid-column: 1 / -1; width: 100%; }
  .rv-count { min-width: 84px; font-size: 48px; }
  .rv-two { grid-template-columns: 1fr; }
  .rv-bars { height: 120px; gap: 6px; }
}

/* ---- лист повторения на стекле окна (координаты сцены; на телефоне — блоком под сценой) ---- */
.review-sheet { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; gap: 16px 18px; padding: 24px 22px 20px; align-content: start; }
.rs-big { width: 176px; height: 150px; display: grid; place-content: center; text-align: center; background: var(--n1); border: 2.5px solid var(--ink); border-radius: 5px 9px 6px 8px; box-shadow: 0 5px 0 var(--ink); transform: rotate(-3deg); }
.rs-big.empty { background: var(--leaf); }
.rs-big b { font: 900 68px/1 var(--font-display); } .rs-big span { font: 20px/1.1 var(--font-hand); }
.rs-side { display: grid; align-content: center; gap: 12px; }
.rs-note { margin: 0; font: 17px/1.25 var(--font-hand); color: var(--ink-soft); }
.rs-go { justify-self: start; padding: 11px 18px; border-radius: 12px; font: 700 16px var(--font-display); color: #fff8ee; background: var(--shu); border: 3px solid var(--ink); box-shadow: 0 5px 0 var(--ink), inset 0 -4px 0 var(--shu-2); cursor: pointer; transition: transform .25s var(--spring); }
.rs-go:hover { transform: translateY(-2px); } .rs-go:active { transform: translateY(4px); box-shadow: 0 1px 0 var(--ink); }
.rs-types { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.rs-type { display: grid; grid-template-columns: auto auto; grid-template-rows: auto auto; column-gap: 8px; align-items: center; justify-content: start; padding: 8px 10px; border: 2.5px solid var(--ink); border-radius: 6px 9px 5px 8px; color: var(--ink); font: inherit; text-align: left; background: var(--paper-2); }
.rs-type i { grid-row: span 2; font: 600 22px var(--font-kana); font-style: normal; }
.rs-type b { font: 900 22px/1 var(--font-display); } .rs-type span { font: 14px/1 var(--font-hand); }
.rs-type.has { cursor: pointer; box-shadow: 0 4px 0 var(--ink); transition: transform .25s var(--spring); }
.rs-type.has:hover { transform: translateY(-3px) rotate(0) !important; }
.rs-type.has.t0 { background: var(--n2); transform: rotate(1.5deg); } .rs-type.has.t1 { background: var(--n3); transform: rotate(-1.5deg); } .rs-type.has.t2 { background: #c9f0b0; transform: rotate(1deg); }
.rs-type.has.t3 { background: #ffd2a6; transform: rotate(-1deg); } .rs-type.has.t4 { background: var(--n1); transform: rotate(1.2deg); } .rs-type.has.t5 { background: #e5d4ff; transform: rotate(-.8deg); }
.rs-type:not(.has) { opacity: .7; }
#sheet-slot:empty { display: none; }
body.mobile #sheet-slot { margin: 6px 0 18px; }
body.mobile .review-sheet { grid-template-columns: auto minmax(0, 1fr); padding: 20px 14px 16px; }
body.mobile .rs-big { width: 120px; height: 110px; } body.mobile .rs-big b { font-size: 50px; }
body.mobile .rs-types { grid-template-columns: repeat(2, 1fr); }

/* страница review.html: лист не шире разумного; на телефоне — две колонки разделов, без выхода за край */
.page-review .review-sheet { max-width: 780px; }
.page-review .rs-types { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.page-review .rs-type { min-width: 0; }
.page-review .rs-type span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.page-review .rs-go { white-space: nowrap; }
@media (max-width: 760px) {
  .page-review .review-sheet { grid-template-columns: auto minmax(0, 1fr); gap: 14px 14px; padding: 18px 12px 14px; }
  .page-review .rs-big { width: 118px; height: 108px; } .page-review .rs-big b { font-size: 50px; } .page-review .rs-big span { font-size: 17px; }
  .page-review .rs-go { padding: 11px 14px; }
  .page-review .rs-types { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* карточки разделов — ссылки, но без подчёркивания (это кнопки-стикеры) */
a.rs-type, a.rs-type:hover { text-decoration: none; color: var(--ink); }
