/* Цвет здесь не заводится: файл подключается на каждой странице, а темы
   объявлены в `tokens.css`, который целиком пишет разносчик. Свой hex переживал
   смену темы молча — тёмная его не переопределяла нигде, и кнопка
   «поправить» оставалась белой плашкой под почти белой надписью, а рамка
   листа была светлее пузыря и светилась. Правка 2026-09-15.

   Радиусы 6 и 10 и поля кнопки оставлены числами намеренно. В банке
   радиус один и он крупный (16): подстановка сменила бы вид кнопки и
   листа, а раскладку переносит задача по макетам, а не эта уборка. */

/* Формула стоит отдельной строкой, а не в потоке слов. Выкладка бывает
   в три этажа, и вклиненная в предложение она рвёт его пополам — это
   видно сразу, как только посмотреть на пузырь глазами. В тетради
   выкладку тоже пишут с новой строки. Исключение — запись в строке `{…}`
   учебника (DK-341, слово Марии 2026-10-20): это не картинка, а разметка
   сервера в два этажа (`.к-запись-в-строке`, components.css). */
.formula { display: flex; align-items: center; gap: 10px;
           flex-wrap: wrap; margin: 8px 0; }

/* Ширину и высоту в логических пикселях ставит сервер атрибутами:
   картинка нарисована втрое крупнее, чтобы не мылилась, и без этих
   чисел браузер вывел бы её втрое больше. height:auto нужен только на
   узком экране, где max-width их ужимает. */
.formula img { max-width: 100%; height: auto; border-radius: 6px; }

/* Из картинки текст не выделишь, поэтому кнопка — единственный способ
   взять формулу в правку. */
/* `color` названа отдельно, потому что `font: inherit` цвет не переносит:
   без неё надпись красит браузер своим `buttontext`, и в тёмной теме
   выходит чёрное по тёмному. Поймано живым просмотром 2026-09-15 — до
   правки фон был сырым белым, и чёрная надпись на нём случайно читалась. */
.copycanon { font: inherit; font-size: 0.9em; padding: 2px 10px;
             border: 1px solid var(--line); border-radius: 6px;
             color: var(--ink); background: var(--card); cursor: pointer; }
.copycanon:hover { background: var(--plate); }

/* Строка списка с листом: у неё нет второй половины, поэтому картинка
   прижимается влево, а не растягивается по ширине строки. */
.sheet-row { justify-content: flex-start; }

/* Лист из портфеля: страница учебника или запись в тетради. Занимает
   пузырь целиком — это не вставка в реплику, а отдельная бумажка, и
   рамка нужна, чтобы белый лист не сливался с белым пузырём. */
.sheet { display: block; max-width: 100%; height: auto;
         border: 1px solid var(--rule); border-radius: 10px; }