/* Платформа — мобильная вёрстка и совместимость браузеров.
   Подключается ПОСЛЕДНИМ (после app.css / admin.css / git.css / site.css), поэтому переопределяет их
   без правки исходных правил — так проще мержить ветки соседних экранов.

   Что здесь: безопасные зоны iPhone, динамическая высота (dvh с фолбэком на vh),
   нижняя навигация портала, доска/чат/мастер/код на телефоне, таблицы админки,
   лендинг и публичные страницы, тач-цели 44×44, фолбэки для старых движков.

   Опорные ширины: 360 · 390 (iPhone 14/15/16 Pro) · 414 · 768 (планшет) · 1280 (десктоп). */

/* ════════ 1. Общее для всех страниц ════════ */
:root{
  --safe-t:env(safe-area-inset-top,0px);
  --safe-b:env(safe-area-inset-bottom,0px);
  --safe-l:env(safe-area-inset-left,0px);
  --safe-r:env(safe-area-inset-right,0px);
  --tabh:0px;            /* высота нижней навигации портала; > 0 только на телефоне */
  --kb:0px;              /* высота экранной клавиатуры (ставит mobile.js по visualViewport) */
  --tap:44px;            /* минимальная тач-цель */
}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
/* страховка от горизонтального скролла: clip (в отличие от hidden) не ломает position:sticky */
body{overflow-x:clip}
img,video,canvas,svg,iframe{max-width:100%}
/* длинные ссылки/ключи/e-mail не распирают вёрстку */
.pre,.gclone,.gcrumb,code,.umenu .uh,.kvlist,.kv{overflow-wrap:anywhere}
/* элементы грид-раскладок не растягиваются содержимым (частая причина скролла вбок) */
.grid>*,.stats>*,.mkt>*,.plans>*,.steps>*,.assets>*,.gitgrid>*,.hero-grid>*{min-width:0}

/* таблицы никогда не ломают страницу: обёртка со своим горизонтальным скроллом */
.tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.md table,.doc table{max-width:100%}

/* ════════ 2. Каркас портала и админки ════════ */
/* 100dvh с фолбэком: сначала vh (понимают все), затем dvh (Safari 15.4+, Chrome 108+) */
.app{min-height:100vh;min-height:100dvh}
.nav{height:100vh;height:100dvh}
.authwrap{min-height:100vh;min-height:100dvh}

@media(max-width:900px){
  :root{--tabh:calc(58px + var(--safe-b))}
  html.kb-open{--tabh:0px}
  body.admin,body.site{--tabh:0px}      /* нижняя навигация есть только в портале */

  /* верхняя панель: учитывает «чёлку», тач-цели 44px */
  .top{height:auto;min-height:56px;padding:var(--safe-t) calc(12px + var(--safe-r)) 0 calc(12px + var(--safe-l));
    padding-bottom:0;align-items:center;gap:8px}
  .top>*{margin-top:0}
  .top .hello b{font-size:14px}
  .burger{width:var(--tap);height:var(--tap);flex:0 0 auto;font-size:20px}
  .ub{min-height:var(--tap);padding:5px 12px 5px 5px}
  .ub .av{width:30px;height:30px}
  .umenu{top:48px;min-width:230px}
  .umenu a,.umenu button{min-height:var(--tap);display:flex;align-items:center}

  /* боковое меню-шторка: во всю высоту с безопасными зонами */
  .nav{padding:calc(14px + var(--safe-t)) 12px calc(14px + var(--safe-b));overflow-y:auto;-webkit-overflow-scrolling:touch}
  .ni{min-height:var(--tap);font-size:14px;padding:10px 12px}
  .navclose{width:var(--tap);height:var(--tap)}

  /* контент: место под нижнюю навигацию и безопасные зоны */
  .view{padding:14px calc(14px + var(--safe-r)) calc(24px + var(--tabh)) calc(14px + var(--safe-l))}

  /* поля ввода — не меньше 16px, иначе iOS Safari зумит страницу при фокусе */
  input,select,textarea,button{font-size:16px}
  input.in,select.in,textarea.in{font-size:16px;padding:11px 12px;min-height:var(--tap)}
  select.in{padding-right:34px}
  textarea.in{min-height:120px}
  label.lbl{font-size:13px}
  .btn{min-height:var(--tap);padding:11px 16px;font-size:15px}
  .btn.sm{min-height:var(--tap);min-width:var(--tap);padding:9px 13px;font-size:14px}
  .chip{min-height:var(--tap);display:inline-flex;align-items:center}
  .chip.sm{min-height:var(--tap);padding:8px 13px}
  .catbtn,.qa,.tplcard{min-height:var(--tap)}
  .mtabs{gap:4px}
  .mtab{min-height:var(--tap);display:flex;align-items:center;justify-content:center;min-width:130px}
  .brand{min-height:var(--tap);align-items:center}
  /* длинные бейджи (ДЕМО-провайдер, «требует внешнего инструмента») переносим, а не распираем страницу */
  .badge{white-space:normal;max-width:100%}
  .tbl .badge,.tblwrap .badge{white-space:nowrap}
  /* больше воздуха между кликабельными элементами */
  .row{gap:10px}
  .chipset{gap:10px}
}

/* ════════ 3. Нижняя навигация портала (вместо бокового меню на телефоне) ════════ */
.tabbar{display:none}
@media(max-width:900px){
  .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--card);
    border-top:1px solid var(--line);padding:4px calc(4px + var(--safe-l)) calc(2px + var(--safe-b)) calc(4px + var(--safe-r));
    box-shadow:0 -2px 12px rgba(20,24,40,.06)}
  .tabbar .tb{flex:1 1 0;min-width:0;min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:2px;padding:4px 2px;border:0;background:none;color:var(--mut);font-size:10.5px;font-weight:700;cursor:pointer;
    border-radius:10px;text-decoration:none;-webkit-tap-highlight-color:transparent}
  .tabbar .tb .ic{font-size:18px;line-height:1}
  .tabbar .tb span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
  .tabbar .tb.on{color:var(--acc)}
  .tabbar .tb.on .ic{transform:translateY(-1px)}
  body.admin .tabbar .tb.on{color:var(--acc2)}
  html.kb-open .tabbar{display:none}
  /* фон под открытой шторкой не прокручиваем жестом. overflow:hidden на html не годится:
     ломает position:sticky у верхней панели и в iOS Safari сбрасывает позицию прокрутки. */
  .navback.open{touch-action:none;overscroll-behavior:contain}
  #toasts{right:12px;left:12px;bottom:calc(12px + var(--tabh));max-width:none}
  .toast{font-size:14px}
}

/* ════════ 4. Экраны портала ════════ */
/* 4.1 дашборд и списки */
@media(max-width:640px){
  /* !important — часть экранов задаёт число колонок инлайновым style (подписки, финансы) */
  .stats{grid-template-columns:1fr 1fr!important;gap:10px}
  .stat{padding:11px 12px;min-height:68px}
  .stat .v{font-size:19px}
  .prod{grid-template-columns:1fr;gap:8px;padding:12px 14px}
  .prod .cost{text-align:left}
  .prod .bar{grid-column:auto}
  .pagehead{gap:8px}
  .pagehead h1{min-width:0;font-size:19px}
  .pagehead .btn{width:100%}
}
@media(max-width:390px){.stats{grid-template-columns:1fr!important}}
/* строки подписок, расходов и сотрудников: на телефоне в одну колонку, кнопки во всю ширину */
@media(max-width:640px){
  .subrow,.person{grid-template-columns:auto 1fr;gap:8px 10px;padding:12px 14px}
  .subrow .right,.person .right,.subrow>div:last-child,.person>div:last-child{grid-column:1/-1;text-align:left}
  .subrow .pr{text-align:left;font-size:15px}
  .subrow .btn,.person .btn{margin-top:8px}
  .spend .row{flex-wrap:wrap}
  .plan{padding:14px}
}

/* 4.2 мастер «от идеи»: шаги по одному, крупные поля, кнопка «Далее» всегда видна */
@media(max-width:900px){
  .steps{gap:6px;font-size:11px;margin-bottom:12px;overflow-x:auto;flex-wrap:nowrap;
    scrollbar-width:none;padding-bottom:2px}
  .steps::-webkit-scrollbar{display:none}
  .steps .s{flex:0 0 auto}
  .steps .sep{width:14px;flex:0 0 auto}
  /* .win с overflow:hidden ломает sticky — у окон мастера и чата разрешаем вылет */
  .win.wzwin,.win.chatwin{overflow:visible}
  .win.wzwin>.wt,.win.chatwin>.wt{border-radius:var(--r2) var(--r2) 0 0}
  .wzgo{position:sticky;bottom:calc(var(--tabh) + var(--kb));z-index:6;flex-wrap:wrap;
    margin:14px -16px -14px;padding:10px 16px calc(10px + var(--safe-b));
    background:var(--card);border-top:1px solid var(--line);border-radius:0 0 var(--r2) var(--r2);
    box-shadow:0 -4px 14px rgba(20,24,40,.07)}
  .wzgo>.btn{flex:1 1 auto;min-width:0;min-height:48px;font-size:15px;white-space:normal;text-align:center}
  .wzgo>.btn.sec{flex:0 0 auto;min-width:104px}
  .wzgo>span,.wzgo>.sm{display:none}
  .tplcard{padding:14px}
  .tplcard .n{font-size:15px}
  .roleRow{padding:12px 14px}
  .catbtn{min-height:var(--tap)}
  .gstage{grid-template-columns:24px 1fr}
  .gstage .ctl{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between;gap:10px}
  .gstage .ctl select.in{min-height:38px;font-size:14px}
  .genlog{max-height:120px}
}

/* 4.3 доска проекта: этапы вертикальным списком, без горизонтального скролла */
@media(max-width:768px){.stagegrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){
  .stagegrid{grid-template-columns:1fr;gap:8px;margin:12px 0}
  .stg{min-height:auto;padding:11px 13px;gap:6px}
  .stg .t{font-size:14px;align-items:center}
  .stg .t span:not(.num){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .stg .p{font-size:12px}
  .bhead{flex-direction:column;align-items:stretch;gap:10px}
  .bhead .right{text-align:left}
  /* «Итого / смета / себестоимость» в шапке доски — с .nowrap распирает 360px */
  .bhead .nowrap,.card>.nowrap,.bhead h1{white-space:normal;overflow-wrap:anywhere}
  .bhead .row .btn{flex:1 1 auto}
  .gatebox .row .btn{flex:1 1 auto}
}
/* карточка артефакта и просмотр результата: читаемый шрифт, перенос, таблицы в скролле */
@media(max-width:900px){
  .artbox{flex-direction:column;align-items:stretch;gap:10px}
  .artbox .row{width:100%}
  .artbox .row .btn{flex:1 1 auto}
  .preview{max-height:none;font-size:14px;padding:12px}
  .preview pre{font-size:13px;line-height:1.5}
  .preview iframe{height:60vh;height:60dvh;min-height:320px}
  .md{font-size:14px}
  .md pre{font-size:12.5px}
  .md table{display:block;width:max-content;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .meta{font-size:13px}
  .mediabox .mh{flex-direction:column;align-items:flex-start;gap:4px}
}

/* 4.4 чат: лента растягивается, поле ввода закреплено над клавиатурой */
@media(max-width:900px){
  .chatwin .wb{display:flex;flex-direction:column;height:auto;min-height:0;padding-bottom:0}
  .roles{overflow-x:auto;flex-wrap:nowrap;gap:8px;scrollbar-width:none;padding-bottom:2px;margin-bottom:8px}
  .roles::-webkit-scrollbar{display:none}
  .roles .chip{flex:0 0 auto}
  /* flex:none — иначе .msgs{flex:1} из app.css растягивает ленту по всей переписке и поле ввода уезжает */
  .msgs{flex:none;height:calc(100vh - 330px);height:calc(100dvh - 330px);max-height:none;min-height:200px;
    overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding-bottom:6px}
  html.kb-open .msgs{height:calc(100dvh - var(--kb) - 210px);min-height:120px}
  .msg{max-width:94%;font-size:14px}
  .sendrow{position:sticky;bottom:calc(var(--tabh) + var(--kb));z-index:6;gap:8px;
    margin:0 -16px;padding:10px 16px calc(10px + var(--safe-b));
    background:var(--card);border-top:1px solid var(--line);border-radius:0 0 var(--r2) var(--r2)}
  .sendrow input.in{min-height:46px}
  .sendrow .btn{min-height:46px;padding:0 16px}
  #chatHint{display:none}
  .qa{min-height:var(--tap);font-size:14px;padding:11px 13px}
  #chatProj{max-width:100%!important;width:100%}
}

/* 4.5 файлы проекта (медиа): плитки и плееры */
@media(max-width:640px){
  .assets{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
  .asset img,.asset video{max-height:220px}
  .asset figcaption{font-size:11.5px}
  .quota .qb{height:12px}
}
@media(max-width:390px){.assets{grid-template-columns:1fr 1fr}}

/* 4.6 код проекта (git.js): дерево сверху, код с переносом и залипающими номерами строк */
@media(max-width:900px){
  .gitbar{gap:8px}
  .gitbar>*{flex:1 1 auto;min-width:0}
  .gitbar .grow,.gitbar select.in{flex:1 1 100%;min-width:160px}
  .gitbar select.in{min-height:var(--tap)}
  .gitbar .btn{flex:1 1 auto}
  .gitgrid{grid-template-columns:1fr;gap:10px}
  .gtree{max-height:38vh;max-height:38dvh}
  .gtree .it{min-height:40px;font-size:14px;padding:8px}
  .gcode,.gdiff{max-height:60vh;max-height:60dvh}
  .gcode table{font-size:12.5px;line-height:1.6}
  .gcode td.ln{padding:0 8px;font-size:11px}
  .gcode td.cd{padding:0 10px}
  .glog .c{padding:11px 2px}
  .gclone{font-size:11.5px}
}

/* 4.7 вход / регистрация */
@media(max-width:640px){
  .authwrap{align-items:flex-start;padding:calc(16px + var(--safe-t)) 14px calc(16px + var(--safe-b))}
  .authcard{padding:20px 16px 18px;border-radius:16px}
  .authcard h1{font-size:19px}
  .authtabs a{min-height:var(--tap);display:flex;align-items:center;justify-content:center}
  .check{font-size:13px}
  .check input{width:20px;height:20px}
}

/* ════════ 5. Админка ════════ */
@media(max-width:900px){
  body.admin .top .tr{gap:8px}
  body.admin .top .tr #topHealth{display:none}
  body.admin .top .hello b{font-size:13.5px}
  .frm{grid-template-columns:1fr 1fr;gap:10px}
  .frm input.in,.frm select.in{padding:10px 11px;min-height:var(--tap)}
  /* .stickywin ставит mobile.js: у .win{overflow:hidden} липкая панель не работала бы */
  .win.stickywin{overflow:visible}
  .win.stickywin>.wt{border-radius:var(--r2) var(--r2) 0 0}
  .stickybar{position:sticky;bottom:calc(var(--tabh) + var(--kb));background:var(--card);z-index:6;
    margin:14px 0 0;padding:10px 0 calc(10px + var(--safe-b));max-width:100%;
    box-shadow:0 -4px 14px rgba(20,24,40,.07)}
  .win .stickybar{margin:14px -16px -14px;padding-left:16px;padding-right:16px;
    border-radius:0 0 var(--r2) var(--r2)}
  .stickybar .btn{flex:1 1 auto}
  .stickybar .in{max-width:100%!important;width:100%}
  .stickybar label.sm{flex:1 1 100%}
  /* вкладки разделов — скроллящейся лентой, а не переносом в 4 ряда */
  .tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;
    gap:8px;padding-bottom:4px;margin:0 -14px 12px;padding-left:14px;padding-right:14px;
    scroll-snap-type:x proximity}
  .tabs::-webkit-scrollbar{display:none}
  .tabs>*{flex:0 0 auto}
  .tabs .chip{scroll-snap-align:start}
  /* выбор ревизии на экране «Код»: инлайновый style задаёт 12px — перебиваем, иначе iOS зумит */
  .tabs select.in,.chipset select.in{min-width:190px;max-width:100%;min-height:var(--tap);
    font-size:16px!important;padding:9px 32px 9px 12px!important}
  .subcard{padding:12px}
  .subcard .hd{flex-wrap:wrap}
  .hl{flex-wrap:wrap}
  .pre{max-height:44vh;max-height:44dvh;font-size:11.5px}
  .ver{flex-wrap:wrap}
  .toggle{min-height:var(--tap);min-width:var(--tap);justify-content:center}
  .toggle input{width:44px;height:26px;flex:0 0 auto}
  .toggle input:after{width:22px;height:22px}
  .toggle input:checked:after{left:20px}
}
@media(max-width:600px){.frm{grid-template-columns:1fr}}
@media(max-width:480px){
  /* шапка админки: имя и кнопка «Портал» есть в шторке меню — в узкой шапке они мешают */
  body.admin .top .tr #topWho{display:none}
  body.admin .top .tr .btn.sec{display:none}
}

/* 5.1 таблицы на телефоне.
   mobile.js помечает каждую таблицу: простую (без полей ввода) — как карточки `.tbl.cards`,
   таблицу с формами — оборачивает в `.tblwrap` с залипающей первой колонкой. */
@media(max-width:700px){
  .tblwrap{margin:0 -2px}
  .tblwrap>.tbl{min-width:560px}
  .tblwrap>.tbl th:first-child,.tblwrap>.tbl td:first-child{position:sticky;left:0;z-index:1;
    background:var(--card);box-shadow:1px 0 0 var(--soft2)}
  .tblwrap>.tbl th:first-child{background:var(--soft)}
  .tblwrap .in{min-height:var(--tap);font-size:15px}
  .tblwrap .btn.sm{min-height:var(--tap)}
  .tbl td>input[type=checkbox]{width:22px;height:22px}
  .tblwrap[data-scroll="1"]:after{content:"→ таблица листается вбок";display:block;font-size:11px;
    color:var(--mut);padding:4px 2px 0}

  .tblwrap>.tbl.cards{min-width:0}
  .tbl.cards{display:block;min-width:0;font-size:14px}
  .tbl.cards thead,.tbl.cards tr.thead{display:none}
  .tbl.cards tbody,.tbl.cards tr,.tbl.cards td{display:block;width:auto}
  .tbl.cards tr{border:1px solid var(--line);border-radius:10px;background:var(--card);
    padding:8px 12px;margin-bottom:8px}
  .tbl.cards tr:last-child{margin-bottom:0}
  .tbl.cards td{border:0;padding:5px 0;display:flex;gap:12px;align-items:baseline;justify-content:space-between;
    text-align:right;min-width:0}
  .tbl.cards td:before{content:attr(data-l);flex:0 0 42%;text-align:left;color:var(--mut);
    font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.3px}
  .tbl.cards td[data-l=""]:before{content:none}
  .tbl.cards td.num{white-space:normal}
  .tbl.cards td>*{min-width:0}
  .tbl.cards td.act{justify-content:flex-end;flex-wrap:wrap;gap:8px}
}

/* ════════ 6. Диалоги и тосты ════════ */
@media(max-width:640px){
  dialog{width:100%;max-width:100%;margin:auto 0 0;border-radius:16px 16px 0 0;border-bottom:0;
    max-height:92vh;max-height:92dvh}
  dialog[open]{display:flex;flex-direction:column}
  dialog .dh{font-size:15px;padding:14px 16px}
  dialog .db{overflow:auto;-webkit-overflow-scrolling:touch;flex:1;min-height:0}
  dialog .df{flex-wrap:wrap;padding-bottom:calc(12px + var(--safe-b))}
  dialog .df .btn{flex:1 1 auto;min-height:var(--tap)}
}
/* фолбэк для браузеров без <dialog> (Safari < 15.4, Firefox < 98): mobile.js ставит .dlgfb */
dialog.dlgfb{display:none;position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:80;
  width:min(620px,94vw);max-height:90vh;max-height:90dvh;overflow:auto;background:var(--card);
  border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 60px rgba(20,24,40,.25)}
dialog.dlgfb[open]{display:block}
.dlgback{position:fixed;inset:0;background:rgba(20,24,40,.45);z-index:79}
@media(max-width:640px){
  dialog.dlgfb[open]{display:flex;flex-direction:column;left:0;top:auto;bottom:0;transform:none;
    width:100%;max-width:100%;border-radius:16px 16px 0 0}
}

/* ════════ 7. Лендинг и публичные страницы ════════ */
body.site{overflow-x:clip}
@supports not ((backdrop-filter:blur(8px)) or (-webkit-backdrop-filter:blur(8px))){
  .hdr{background:#fff}
}
@media(max-width:900px){
  .hdr{padding-top:var(--safe-t)}
  .wrap{padding-left:calc(20px + var(--safe-l));padding-right:calc(20px + var(--safe-r))}
  .menu{top:calc(64px + var(--safe-t))}
  .burger{width:var(--tap);height:var(--tap)}
  .menu a{min-height:var(--tap);display:flex;align-items:center}
  .hdr .btn.sm{min-height:var(--tap)}
  body.site input,body.site select,body.site textarea{font-size:16px}
  /* публичные страницы (условия/конфиденциальность/тарифы): шапка переносится, а не распирает экран */
  .doc-hdr .wrap{flex-wrap:wrap;height:auto;min-height:56px;padding-top:8px;padding-bottom:8px;row-gap:8px}
  .doc-hdr .menu.static{order:3;flex:1 1 100%;margin-left:0}
  .doc-hdr .hbtns{gap:8px}
}
@media(max-width:600px){
  .doc-hdr .hbtns{flex:1 1 auto}
  .doc-hdr .hbtns .btn{flex:1 1 auto}
}
@media(max-width:600px){
  h1{font-size:clamp(24px,7.2vw,30px);letter-spacing:-.2px;overflow-wrap:break-word}
  h2{font-size:clamp(19px,5.6vw,24px);overflow-wrap:break-word}
  .hero{padding:26px 0 26px}
  .lead{font-size:16px;max-width:none}
  .sub{font-size:15px}
  .wrap{padding-left:calc(16px + var(--safe-l));padding-right:calc(16px + var(--safe-r))}
  /* .btn{white-space:nowrap}: длинный CTA «Зарегистрироваться — описать идею» задавал
     min-content колонки hero и распирал страницу до 380px при ширине 360 */
  .ctas{flex-direction:column;align-items:stretch}
  .ctas .btn,.blk .btn,.cta-band .btn{white-space:normal;text-align:center;max-width:100%}
  .ctas .btn.lg{width:100%;min-height:50px}
  .trust{gap:8px 14px;font-size:12.5px}
  .win .wt .ttl{font-size:11.5px}
  .stg{flex-wrap:wrap;gap:6px 10px}
  .stg .r{flex:1 1 auto;min-width:0}
  .stg .p{white-space:normal;flex:0 0 auto}
  .tot{gap:10px}
  .step{padding:16px}
  .plan{padding:16px}
  .plan .pr{font-size:23px}
  details{padding:0 14px}
  summary{min-height:var(--tap);align-items:center}
  .cta-band{padding:32px 0}
  .cta-band .ctas .btn{width:100%}
  .ftr{padding:18px 0 calc(18px + var(--safe-b))}
  .ftr .links{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:8px}
  .ftr .links a{margin:0}
  .doc{font-size:15.5px}
  .doc h1{font-size:25px}
  .doc h2{font-size:19px}
  .doc table{display:block;width:max-content;max-width:100%;overflow-x:auto}
  .mcard .hd{height:auto;min-height:72px}
}

/* ════════ 8. Совместимость и мелкие фолбэки ════════ */
/* iOS Safari: собственная отрисовка полей даты/времени и чисел — выравниваем под остальные поля */
input[type=date].in,input[type=datetime-local].in,input[type=time].in,input[type=month].in{
  -webkit-appearance:none;appearance:none;min-height:40px;line-height:1.2;display:block;text-align:left}
input[type=number].in{-moz-appearance:textfield}
/* ползунки/скролл в WebKit: не перехватываем жесты браузера (pull-to-refresh остаётся рабочим) */
.msgs,.gtree,.gcode,.gdiff,.preview,.pre,.tblwrap,.tabs,.roles,.steps{overscroll-behavior-x:contain}
/* тач-подсветка только там, где она уместна */
a,button,.chip,.tile.click,.prod,.stg,.tplcard,.qa,.catbtn{-webkit-tap-highlight-color:rgba(79,107,255,.14)}
/* Firefox/Edge: у select.in фон-стрелка рисуется картинкой — не даём ей налезать на текст */
select.in{background-clip:padding-box}
/* печать: без навигации */
@media print{.nav,.tabbar,.top,.navback,#toasts{display:none!important}.view{padding:0}}
/* пользователь просил меньше анимации */
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ════════ 9. Скелетоны загрузки (вместо пустого экрана) ════════ */
.sk{background:linear-gradient(90deg,var(--soft) 25%,var(--soft2) 37%,var(--soft) 63%);
  background-size:400% 100%;animation:skl 1.3s ease-in-out infinite;border-radius:8px;height:14px}
@keyframes skl{0%{background-position:100% 50%}100%{background-position:0 50%}}
.skbox{display:flex;flex-direction:column;gap:10px}
.skrow{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.skrow>.sk{height:74px;border-radius:var(--r)}
.skcard{height:170px;border-radius:var(--r2)}
@media(max-width:1100px){.skrow{grid-template-columns:repeat(2,1fr)}}
@media(max-width:390px){.skrow{grid-template-columns:1fr}}