/* ===================================================================
   NK-редизайн — интеграция нового дизайна на боевую разметку.
   Темы: html[data-nk-theme=tiffany|mono|red], акцент Mono — --nk-acc / --nk-acc-ink.
   Всё скоупом: #nkHome / #mobileTabbar / html[data-nk-theme] … — JS-логика сайта не тронута.
   =================================================================== */

/* ---------- новая главная ---------- */
/* Скролла на главной нет: контейнер = ровно экран, контент ужат clamp-ами под SE */
#nkHome{position:fixed;inset:0;z-index:10;overflow:hidden;overscroll-behavior-y:contain;background:#000}
#nkHome[hidden],#nkHome>section[hidden]{display:none!important}
#nkHome>section{height:100%}
html[data-nk-theme="mono"] #nkHome,#nkHome .nkh-mono{background:#EEEEEB}
html[data-nk-theme="red"] #nkHome,#nkHome .nkh-red{background:#050505}
html[data-nk-active] #home{display:none!important}
html[data-nk-active] .bg-layer{display:none!important}
#nkHome .nkh-tiff .app,#nkHome .nkh-mono .app,#nkHome .nkh-red .app{padding-bottom:calc(88px + env(safe-area-inset-bottom,0px))}
#nkHome .nkh-red .app{padding-bottom:calc(80px + env(safe-area-inset-bottom,0px))}
#nkHome .nkh-mono .sheet{z-index:2600;padding-bottom:calc(34px + env(safe-area-inset-bottom,0px))}
#nkHome .nkh-mono .scrim{z-index:2550}
#nkHome .nkh-mono .sw{background:none;border:0;padding:0;cursor:pointer;font:inherit}
#nkHome .nkh-red .vbg{background:#050505}
#nkHome [data-nk-go]{cursor:pointer;-webkit-user-select:none;user-select:none}
#nkHome canvas{display:block}

/* ---------- таббар: одна боевая разметка, вид по теме ---------- */
html[data-nk-theme] #mobileTabbar.mobile-tabbar{display:grid!important;align-items:center;justify-content:stretch;gap:0;padding:0;font-family:'JetBrains Mono',Menlo,monospace}
html[data-nk-theme] #mobileTabbar .tabbar-item{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;width:auto;height:100%;padding:0!important;margin:0;background:none!important;border:0!important;box-shadow:none!important;font-family:'JetBrains Mono',Menlo,monospace!important;font-size:8px!important;font-weight:400!important;letter-spacing:.1em!important;text-transform:uppercase;text-shadow:none!important;opacity:1!important;-webkit-tap-highlight-color:transparent}
html[data-nk-theme] #mobileTabbar .tabbar-item span:not(.tabbar-icon-wrap):not(.sonya-unread){font:inherit!important;letter-spacing:inherit!important;color:inherit!important;text-shadow:none!important;line-height:1.1;white-space:nowrap}
html[data-nk-theme] #mobileTabbar .tabbar-item svg{width:20px!important;height:20px!important;stroke-width:1.6;filter:none}
html[data-nk-theme] #mobileTabbar .tabbar-icon-wrap{position:relative;display:inline-flex}
html[data-nk-theme] #mobileTabbar .tabbar-chat{justify-self:center;display:grid!important;place-items:center;padding:0!important;border:0!important;cursor:pointer;-webkit-tap-highlight-color:transparent}
html[data-nk-theme] #mobileTabbar .tabbar-chat svg{width:22px!important;height:22px!important;transition:transform .6s}
html[data-nk-theme] #mobileTabbar .tabbar-chat:active svg{transform:rotate(180deg)}
/* пружинка центральной кнопки (как в макете): спин по клику + мягкий возврат */
#mobileTabbar .tabbar-chat svg.nk-spin{animation:nk_spin .62s cubic-bezier(.3,1.35,.45,1)}
@keyframes nk_spin{to{transform:rotate(180deg)}}

/* Tiffany: плавающая капсула, жёсткая розовая тень у центральной */
html[data-nk-theme="tiffany"] #mobileTabbar.mobile-tabbar{left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));margin:0 auto;max-width:406px;height:66px;border-radius:22px;grid-template-columns:1fr 1fr 70px 1fr 1fr;
  background:rgba(0,0,0,.82)!important;-webkit-backdrop-filter:blur(20px) saturate(150%)!important;backdrop-filter:blur(20px) saturate(150%)!important;border:1px solid rgba(243,246,255,.1)!important}
html[data-nk-theme="tiffany"] #mobileTabbar .tabbar-item{color:rgba(243,246,255,.3)!important}
html[data-nk-theme="tiffany"] #mobileTabbar .tabbar-item.is-active{color:#F3F6FF!important}
html[data-nk-theme="tiffany"] #mobileTabbar .tabbar-item.is-active svg{color:#7FE6DA;filter:drop-shadow(0 0 6px rgba(127,230,218,.8))}
html[data-nk-theme="tiffany"] #mobileTabbar .tabbar-chat{width:52px!important;height:52px!important;border-radius:16px!important;margin-top:-22px!important;color:#000!important;
  background:linear-gradient(135deg,#C2FFF6,#7FE6DA)!important;box-shadow:4px 4px 0 #FF9ECF,0 10px 30px -6px rgba(127,230,218,.7)!important;transition:transform .2s,box-shadow .2s}
html[data-nk-theme="tiffany"] #mobileTabbar .tabbar-chat:active{transform:translate(3px,3px);box-shadow:1px 1px 0 #FF9ECF!important}

/* Mono: светлая панель «железа», круглая кнопка в цвет акцента */
html[data-nk-theme="mono"] #mobileTabbar.mobile-tabbar{left:0;right:0;bottom:0;margin:0 auto;max-width:430px;height:calc(78px + env(safe-area-inset-bottom,0px));padding:0 10px calc(8px + env(safe-area-inset-bottom,0px))!important;grid-template-columns:1fr 1fr 72px 1fr 1fr;border-radius:0;
  background:rgba(238,238,235,.86)!important;-webkit-backdrop-filter:blur(16px)!important;backdrop-filter:blur(16px)!important;border:0!important;border-top:1px solid #DCDCD8!important}
html[data-nk-theme="mono"] #mobileTabbar .tabbar-item{color:#8A8A86!important;font-size:8.5px!important;letter-spacing:.04em!important;gap:6px}
html[data-nk-theme="mono"] #mobileTabbar .tabbar-item.is-active{color:#0B0B0B!important}
html[data-nk-theme="mono"] #mobileTabbar .tabbar-item.is-active svg{filter:drop-shadow(5px -2px 0 transparent)}
html[data-nk-theme="mono"] #mobileTabbar .tabbar-item.is-active>svg,html[data-nk-theme="mono"] #mobileTabbar .tabbar-item.is-active .tabbar-icon-wrap{position:relative}
html[data-nk-theme="mono"] #mobileTabbar .tabbar-item.is-active:before{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:var(--nk-acc,#E8478F);transform:translate(13px,-14px)}
html[data-nk-theme="mono"] #mobileTabbar .tabbar-item{position:relative}
html[data-nk-theme="mono"] #mobileTabbar .tabbar-chat{width:54px!important;height:54px!important;border-radius:50%!important;margin:0!important;background:var(--nk-acc,#E8478F)!important;color:var(--nk-acc-ink,#fff)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 8px 16px -8px rgba(0,0,0,.45)!important;transition:background .4s,transform .12s}
html[data-nk-theme="mono"] #mobileTabbar .tabbar-chat:active{transform:scale(.94)}

/* Red Room: чёрная полоса, красная кнопка со срезанным углом */
html[data-nk-theme="red"] #mobileTabbar.mobile-tabbar{left:0;right:0;bottom:0;margin:0 auto;max-width:430px;height:calc(72px + env(safe-area-inset-bottom,0px));padding:0 0 env(safe-area-inset-bottom,0px)!important;grid-template-columns:1fr 1fr 76px 1fr 1fr;border-radius:0;
  background:rgba(5,5,5,.92)!important;-webkit-backdrop-filter:blur(16px)!important;backdrop-filter:blur(16px)!important;border:0!important;border-top:1px solid rgba(245,243,240,.14)!important}
html[data-nk-theme="red"] #mobileTabbar .tabbar-item{color:#8A8784!important;font-size:8.5px!important;gap:6px}
html[data-nk-theme="red"] #mobileTabbar .tabbar-item svg{stroke-width:1.5}
html[data-nk-theme="red"] #mobileTabbar .tabbar-item.is-active{color:#FF2A1F!important}
html[data-nk-theme="red"] #mobileTabbar .tabbar-chat{width:auto!important;height:auto!important;justify-self:stretch!important;align-self:stretch;margin:8px 6px!important;border-radius:0!important;background:#E10600!important;color:#fff!important;box-shadow:none!important;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%)}
html[data-nk-theme="red"] #mobileTabbar .tabbar-chat svg{width:24px!important;height:24px!important}
/* шторка акцента Mono поверх таббара */
html.nk-sheet-open #mobileTabbar{transform:translateY(110%)!important;opacity:0!important;pointer-events:none!important}

/* ===== раунд 4: кнопка таббара синхронна с большой кнопкой — во время поиска крутится и пульсирует ===== */
html[data-nk-search][data-nk-theme] #mobileTabbar .tabbar-chat svg{animation:nk_tbspin 1.1s linear infinite!important}
@keyframes nk_tbspin{to{transform:rotate(360deg)}}
/* кольцо-волна (::after) — box-shadow/background базы стоят с !important, поэтому анимируем псевдоэлемент */
html[data-nk-search][data-nk-theme] #mobileTabbar .tabbar-chat{position:relative;overflow:visible}
html[data-nk-search][data-nk-theme] #mobileTabbar .tabbar-chat:after{display:block!important;content:"";position:absolute;inset:-2px;border-radius:inherit;pointer-events:none;border:2px solid #FF9ECF;animation:nk_tbW 1.4s ease-out infinite}
html[data-nk-search][data-nk-theme="mono"] #mobileTabbar .tabbar-chat:after{border-color:var(--nk-acc,#E8478F)}
html[data-nk-search][data-nk-theme="red"] #mobileTabbar .tabbar-chat:after{display:none!important}
html[data-nk-search][data-nk-theme="red"] #mobileTabbar .tabbar-chat{animation:nk_tbR 1.2s ease-in-out infinite}
@keyframes nk_tbW{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.35)}}
@keyframes nk_tbR{50%{filter:brightness(1.35)}}

/* ===== nk-perf (02.10, аудит Блок 1 — одобрен владельцем) ===== */
/* Б1.2: блюры таббара на мобилках 20→14 / 16→12 (то же решение 26.09 для старого слоя).
   Стекло на глаз то же, GPU заметно легче — таббар висит над анимированным канвасом лого.
   Десктоп (>768px) не тронут. Откат = удалить блок. */
@media (max-width:768px){
  html[data-nk-theme="tiffany"] #mobileTabbar.mobile-tabbar{-webkit-backdrop-filter:blur(14px) saturate(150%)!important;backdrop-filter:blur(14px) saturate(150%)!important}
  html[data-nk-theme="mono"] #mobileTabbar.mobile-tabbar{-webkit-backdrop-filter:blur(12px)!important;backdrop-filter:blur(12px)!important}
  html[data-nk-theme="red"] #mobileTabbar.mobile-tabbar{-webkit-backdrop-filter:blur(12px)!important;backdrop-filter:blur(12px)!important}
}
/* Б1.1: профиль/чаты под открытой модалкой — nk-анимации панели на паузе
   (класс ставит nk-home.js sync; #aliceModal в #sidePanel не вложен — typing Сони не гасим) */
#sidePanel.nk-paused *,#sidePanel.nk-paused *::before,#sidePanel.nk-paused *::after{animation-play-state:paused!important}

/* ===== G (03.10, владелец): десктоп NK = та же мобильная вёрстка, чуть шире («как планшет»), по центру.
   Референс — старый слой (desktop.css: колонка --desk-col 540px + html{zoom:1.1}; #sidePanel, #aliceModal,
   модалки уже в колонке). Здесь доводим NK-оболочки с жёстким max-width 406/430px до той же колонки.
   Мобайл (≤768px) не затронут. Откат = удалить блок. ===== */
@media (min-width:769px) and (min-height:781px){
  #nkHome .nkh-tiff .app,#nkHome .nkh-mono .app,#nkHome .nkh-red .app,#nkHome .nkh-mono .sheet{max-width:var(--desk-col,540px)}
  html[data-nk-theme="tiffany"] #mobileTabbar.mobile-tabbar{max-width:calc(var(--desk-col,540px) - 24px)}
  html[data-nk-theme="mono"] #mobileTabbar.mobile-tabbar,html[data-nk-theme="red"] #mobileTabbar.mobile-tabbar{max-width:var(--desk-col,540px)}
}
@media (min-width:769px){
  /* «Чаты»: вкладка SONYA прижата к правому краю, как на телефоне (flex:1 центрировал её в пустоте) */
  html[data-nk-theme] #chatsFolderBar .folder-btn.folder-btn-sonya{flex:0 0 auto;margin-left:auto}
}
/* низкие окна ноутбука (1280×720, 1366×768): zoom 1.1 съедал ~70px высоты, а тиры @media(max-height)
   считаются по окну без зума → футер главной уходил под таббар. Здесь — без зума и с мобильной шириной
   главной (430): по высоте экран = телефон, тиры работают как на телефоне */
@media (min-width:769px) and (max-height:780px){html[data-nk-theme]{zoom:1}}
