/* Навигация (assets/nav.js): нижняя панель вкладок на телефоне, счётчик на «Повторении», зоны нажатия ≥44px.
   Стиль сайта: бумага, контур тушью 2.5px, сплошная тень вместо свечения. Подключается последним из стилей. */

/* ---------- зоны нажатия не меньше 44px ---------- */
.top .nav a { display: inline-flex; align-items: center; min-height: 44px; padding-top: 0; padding-bottom: 0; }
.top .acc-btn { min-height: 44px; min-width: 44px; justify-content: center; }
.subnav a { display: inline-flex; align-items: center; min-height: 44px; padding-top: 0; padding-bottom: 0; }
a.back-link { min-height: 44px; }
@media (max-width: 760px) { .icon-btn { min-width: 44px; min-height: 44px; } }

/* ---------- счётчик «пора повторить» ---------- */
.nav-badge {
  display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 5px; box-sizing: border-box;
  margin-left: 7px; border-radius: 11px; border: 2px solid var(--ink, #2b2523);
  background: #c8402a; color: #fff8ee; /* темнее --shu комнаты: белая цифра читается (4.7:1) */ font: 800 12px/1 'Zen Kaku Gothic New', 'Manrope', system-ui, sans-serif;
  box-shadow: 0 2px 0 var(--ink, #2b2523); transform: rotate(4deg);
}
.nav-badge[hidden] { display: none; }
.nav-badge .vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }

/* ---------- нижняя панель (только телефон) ---------- */
.tabbar { display: none; }

@media (max-width: 760px) {
  /* верх: только логотип и аккаунт */
  body .top .nav { display: none; }
  body .top .acc-btn { margin-left: auto; }

  .tabbar {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 55; /* под выдвижной панелью тренажёра (60) */
    padding: 6px max(6px, env(safe-area-inset-left)) calc(6px + env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-right));
    background: var(--paper, #fbf6ec); border-top: 2.5px solid var(--ink, #2b2523);
    box-shadow: 0 -4px 0 rgba(43, 37, 35, .14);
  }
  .tabbar a {
    position: relative; min-height: 56px; min-width: 48px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
    padding: 4px 2px; border-radius: 10px 12px 9px 11px; border: 2.5px solid transparent;
    color: var(--ink, #2b2523); text-decoration: none; -webkit-tap-highlight-color: transparent;
    font: 700 12px/1.1 'Zen Kaku Gothic New', 'Manrope', system-ui, sans-serif; letter-spacing: -.01em;
    transition: transform .25s cubic-bezier(.3, 1.5, .5, 1);
  }
  .tabbar .tb-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  .tabbar .tb-ico { position: relative; display: grid; place-items: center; width: 30px; height: 28px; }
  .tabbar svg { display: block; }
  .tabbar svg .fill { fill: none; }
  .tabbar a:active { transform: translateY(2px); }
  .tabbar a[aria-current] { background: var(--n1, #ffe07a); border-color: var(--ink, #2b2523); box-shadow: 0 3px 0 var(--ink, #2b2523); transform: rotate(-2deg); }
  .tabbar a[aria-current] svg .fill { fill: #fff8ee; }
  .tabbar a:focus-visible { outline: 3px dashed var(--ink, #2b2523); outline-offset: 1px; }
  .tabbar .nav-badge { position: absolute; top: -6px; left: 19px; margin: 0; min-width: 20px; height: 20px; font-size: 11px; }

  /* место под панелью: подвал (последний блок страницы) продолжается под ней, ничего не прячется */
  body.has-tabbar > footer { padding-bottom: calc(40px + 74px + env(safe-area-inset-bottom)); }
  body.has-tabbar.page-room > footer { padding-bottom: calc(26px + 74px + env(safe-area-inset-bottom)); }
  body.has-tabbar:not(:has(> footer)) { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
  /* плавающие кнопка панели тренажёра и уведомления — над панелью */
  body.has-tabbar .side-toggle, body.has-tabbar .toast { bottom: calc(86px + env(safe-area-inset-bottom)); }
  /* карточка выбранного знака в таблице каны прилипает к низу экрана — над панелью, а не под ней */
  body.has-tabbar .table-layout .detail { bottom: calc(84px + env(safe-area-inset-bottom)); }
}
/* подменю затухает у края, только когда действительно не помещается (класс ставит nav.js) */
.subnav.fits { -webkit-mask-image: none; mask-image: none; }
@media (max-width: 760px) and (prefers-reduced-motion: reduce) {
  .tabbar a { transition: none; }
}
@media print { .tabbar { display: none; } }

/* план на сегодня сделан (html.day-done, common.js): счётчик повторения спокойный, не красный */
.day-done .nav-badge { background: var(--paper-2, #f3ead7); color: var(--ink-soft, #5d5047); box-shadow: none; transform: none; }

/* гость (вход обязателен, доска входа на главной — today.js body.guest): разделов и кнопки «Войти» не показываем — вход на доске */
body.guest :is(.top .nav, .acc-btn, .tabbar) { display: none !important; }
body.guest.has-tabbar > footer { padding-bottom: 40px; }