/* ─── База: шрифты, бумага, типографика, кнопки ─── */
/* font-weight: 400 700 обязателен и должен совпадать с индийскими довесками
   семьи ниже: при разных наборах весов внутри одной семьи Chrome на шаге
   подбора веса отбрасывает лица без дескриптора — кириллица/латиница молча
   падали на Comic Sans / Apple Chancery. */
@font-face {
  font-family: 'Neucha';
  font-weight: 400 700;
  src: url('../fonts/neucha-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
  font-display: swap;
}
@font-face {
  font-family: 'Neucha';
  font-weight: 400 700;
  src: url('../fonts/neucha-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+2000-206F, U+2070-209F, U+2190-21BB;
  font-display: swap;
}
@font-face {
  font-family: 'Caveat';
  font-weight: 400 700;
  src: url('../fonts/caveat-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
  font-display: swap;
}
@font-face {
  font-family: 'Caveat';
  font-weight: 400 700;
  src: url('../fonts/caveat-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  font-display: swap;
}

/* ── рукописные начертания для индийских письменностей (hi / ta / bn) ──
   В Caveat/Neucha нет этих глифов. Добавляем их к ТЕМ ЖЕ семействам через
   unicode-range — поэтому весь существующий CSS («Caveat»/«Neucha») работает
   без правок: латиница/кириллица остаются на Caveat/Neucha, а индийские
   символы подхватывают рукописные шрифты по-глифно.
   Kalam — деванагари (карандашный почерк), Kavivanar — тамильский (перо),
   Galada — бенгальский (кисть). Файлы 400; жирный синтезируется браузером. */
@font-face { /* деванагари (हिन्दी) → Kalam */
  font-family: 'Caveat'; font-weight: 400 700; font-display: swap;
  src: url('../fonts/kalam-devanagari.woff2') format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF;
}
@font-face { /* тамильский (தமிழ்) → Kavivanar */
  font-family: 'Caveat'; font-weight: 400 700; font-display: swap;
  src: url('../fonts/kavivanar-tamil.woff2') format('woff2');
  unicode-range: U+0964-0965, U+0B82-0BFA, U+200C-200D, U+20B9, U+25CC;
}
@font-face { /* бенгальский (বাংলা) → Galada */
  font-family: 'Caveat'; font-weight: 400 700; font-display: swap;
  src: url('../fonts/galada-bengali.woff2') format('woff2');
  unicode-range: U+0951-0952, U+0964-0965, U+0980-09FE, U+200C-200D, U+20B9, U+25CC, U+A8F1;
}
@font-face { /* деванагари → Kalam (для Neucha-контекстов: ввод, кнопки, текст) */
  font-family: 'Neucha'; font-weight: 400 700; font-display: swap;
  src: url('../fonts/kalam-devanagari.woff2') format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF;
}
@font-face { /* тамильский → Kavivanar */
  font-family: 'Neucha'; font-weight: 400 700; font-display: swap;
  src: url('../fonts/kavivanar-tamil.woff2') format('woff2');
  unicode-range: U+0964-0965, U+0B82-0BFA, U+200C-200D, U+20B9, U+25CC;
}
@font-face { /* бенгальский → Galada */
  font-family: 'Neucha'; font-weight: 400 700; font-display: swap;
  src: url('../fonts/galada-bengali.woff2') format('woff2');
  unicode-range: U+0951-0952, U+0964-0965, U+0980-09FE, U+200C-200D, U+20B9, U+25CC, U+A8F1;
}

*{box-sizing:border-box;margin:0;padding:0;}
/* overscroll-behavior-y:none — гасит iOS/WKWebView rubber-band bounce: без него
   протяжка вниз тянет весь webview и «плавит» fixed-хром (таб-бар/док уезжают).
   Пара к tg.disableVerticalSwipes() (js/boot.js) — та глушит Telegram-свайп. */
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%; text-size-adjust:100%; overscroll-behavior-y:none;}
[hidden]{display:none !important;}
body{
  font-family:'Neucha','Comic Sans MS',cursive;
  color:var(--graphite);
  background-color:var(--paper);
  background-image:radial-gradient(var(--paper-dot) 1.1px, transparent 1.3px);
  background-size:26px 26px;
  line-height:1.35;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  overscroll-behavior-y:none;   /* не тянуть webview за границей скролла (см. html) */
}
/* Пояс от горизонтального «уезда»: на iOS-WKWebView overflow-x:hidden у body НЕ
   клипает absolute-потомков (напр. карандашную обводку .sk-tabbar-bg svg, у неё
   max-width:none), поэтому редкая переразмеренная подложка распирала документ и
   весь app «уезжал». overflow-x:clip на корнях экранов режет по ширине экрана,
   не создавая скролл-контейнер (в отличие от hidden — overflow-y остаётся visible,
   sticky/скролл целы). Корень чинит грид-трек .list (minmax(0,1fr)); это страховка. */
#board, #calendar, #shelf, #profile{overflow-x:clip;}
/* Открытая модалка запирает скролл фона (scroll-through-фикс). Нативный
   <dialog>.showModal() на iOS-WKWebView НЕ запирает документ: тап-драг по
   ::backdrop / шапке / футеру / полю ввода модалки прокручивает #board под ней.
   Класс .dlg-lock вешает наблюдатель в js/modal.js (следит за [open] у всех
   <dialog>). Тот же проверенный приём, что body.ob-open (onboarding) и
   body.shelf-active. Скролл-зоны самих модалок (.m-body / .asst-log / .skm-body)
   — свои overflow-y:auto + overscroll-behavior:contain, ancestor-hidden их не
   трогает: драг ВНУТРИ модалки крутит её тело, драг по хрому/фону — ничего. */
html.dlg-lock, html.dlg-lock body{overflow:hidden;}
h1,h2,h3{font-family:'Caveat',cursive;}
img,svg{max-width:100%;}

.btn{
  font-family:'Neucha',cursive; font-size:.95rem;
  background:transparent; color:var(--graphite);
  border:none; padding:6px 15px; cursor:pointer;
  position:relative; transition:transform .12s ease;
}
.btn::before{
  content:""; position:absolute; inset:0;
  border:1.6px solid var(--graphite); border-radius:var(--r-pill);
  filter:url(#squiggle);
}
.btn:hover{transform:rotate(-1.2deg) scale(1.03);}
.btn:active{transform:scale(.97);}
.btn:focus-visible{outline:3px solid var(--ink-blue); outline-offset:3px; border-radius:14px;}
/* Мини-апп (iOS WebKit): :focus-visible срабатывает после ТАЧА, а не только с
   клавиатуры — стойкие синие обводки-мусор на крестиках/кнопках/полях. Tab-нав
   в TMA нет, фокус-обводки не нужны; !important перебивает #id-focus-visible. */
body.in-telegram :focus-visible{outline:none !important;}
.btn.icon{padding:6px 10px; font-size:1.05rem; line-height:1;}
.btn.red{color:var(--red);}
.btn.red::before{border-color:var(--red); border-style:dashed;}
.btn.primary{background:var(--graphite); color:#fff; border-radius:var(--r-pill);}
.btn.primary::before{border-color:var(--graphite);}

/* «Лёгкий режим»: squiggle-фильтр (feTurbulence+feDisplacementMap, ~45 мест)
   дорог на бюджетных GPU — каждый перерисованный элемент платит за смещение
   пикселей. Линии становятся прямыми, макет не меняется. Включается системным
   prefers-reduced-motion ИЛИ классом body.light-fx (автодетект слабого железа
   в app.js boot: deviceMemory/hardwareConcurrency). */
@media (prefers-reduced-motion:reduce){
  *{transition:none !important; animation:none !important;}
  *, *::before, *::after{filter:none !important;}
}
body.light-fx *, body.light-fx *::before, body.light-fx *::after{filter:none !important;}
