/* Вид «приложение»: нижняя панель, экраны на всю ширину, полоса плеера НАД
   панелью (а не поверх неё), шапка сжата. Как и в view-site.css, всё здесь
   решается ТОЛЬКО атрибутом [data-view=...] — разметка общая. */
[data-view="app"] .bottom-nav{display:flex}
/* Шапка сжата: меньше отступов и меньше буквы бренда, чем на сайте. */
[data-view="app"] header{padding:var(--s3) var(--s4)}
[data-view="app"] .brand{font-size:16px}
/* Снизу нужно место и под полосу плеера, и под нижнюю панель — это два
   разных фиксированных блока, панель ниже полосы. Обе высоты — переменные
   темы: раньше здесь стояли три несвязанных числа (150, 60 и 96 в
   view-site.css), и правка высоты панели в одном месте прятала бы текст под
   панель в другом. */
[data-view="app"] #screens{padding-bottom:calc(var(--nav-h) + var(--bar-h) + var(--s5))}
[data-view="app"] #bar{bottom:var(--nav-h)}
[data-view="app"] .wrap{max-width:100%}
[data-view="app"] .wrap.wrap-narrow{max-width:100%}
/* Ссылка «о методе» в шапке не нужна: в этом виде тот же переход даёт нижняя
   панель, и вторая кнопка в сжатой шапке лишняя. Правило до задачи 6 лежало
   в app.css (общем для обоих видов) — это было единственное место, где
   общий файл знал про вид; теперь оно там, где ему и место. */
[data-view="app"] #home-link,
[data-view="app"] #catalog-link,
[data-view="app"] #about-link{display:none}