/* Адаптивность Инбокса (ADR 0011): iPhone · iPad · MacBook · широкие экраны (XREAL 1S).
   Классы ширины окна — по Material 3 window size classes (600 / 840 / 1200 / 1600), поведение — как NavigationSplitView:
   компакт — стек, шире — рейка + список + панель справа.

   • < 600           телефон — как было, этот файл ничего не меняет;
   • 600…839         iPad вертикально: колонка по центру (≤ 760), шторки по центру, нижнее меню на ширине ≤ 560;
   • ≥ 840           MacBook, iPad горизонтально: рейка слева вместо нижнего меню, карточка задачи и чат —
                     панель справа (список остаётся виден), заметка — окно по центру. Только при высоте ≥ 480:
                     iPhone в ландшафте (844×390) остаётся телефоном;
   • ≥ 1200          «Сегодня» в две колонки;
   • ≥ 1600          широкий экран / очки: крупнее интерфейс (zoom), шире колонки.
   Окно виджета — iframe Element или PWA: media-запросы считаются по размеру самого окна.

   Про zoom (≥ 1600): единицы vh/dvh/vw под zoom в WebKit и Chromium ведут себя по-разному (там «логические», тут
   физические), поэтому высоты окон — через fixed + top/bottom и проценты, а не через dvh/vh; px-пороги — логические. */

:root{ --rail:0px; --panel:0px; --col:760px; --ui-zoom:1; --fab-r:18px }   /* --fab-r/--fab-b: кнопка с микрофоном и её веер (style.css .fm-items) сдвигаются вместе */

/* ═══ ≥ 600: колонка по центру ═══ */
@media (min-width:600px){
  main > section{max-width:var(--col);margin-inline:auto}   /* по ширине самого main: рядом может быть панель */
  .sheet{max-width:560px;margin-inline:auto}
  .asheet{max-width:none;margin-inline:0}               /* экран сессии — на всю ширину (внутри — колонка ниже) */
  .tabbar{padding-inline:max(8px, calc((100% - 560px) / 2))}
  :root{--fab-r:max(18px, calc((100% - var(--col)) / 2 + 14px))}
  .micfab,.fm-items{right:var(--fab-r)}
  /* заметка и чат: лента и шапка — колонкой, а не строкой на весь экран; двойной класс — чат подключает свой css позже */
  .nscreen .nc-viewport, .asheet .ic-viewport, .nscreen .ic-viewport{padding-inline:max(14px, calc((100% - var(--col)) / 2))}
  .asheet .ic-head, .nscreen .ic-head, .nscreen .nc-head{padding-inline:max(12px, calc((100% - var(--col)) / 2 + 2px))}
  /* экран обещания (тикет 14) — текст колонкой; правка поля — лист по ширине нижнего меню */
  .pscreen .ps-main{padding-inline:max(20px, calc((100% - var(--col)) / 2))}
  .pscreen .ps-top{padding-inline:max(4px, calc((100% - var(--col)) / 2 - 16px)) max(10px, calc((100% - var(--col)) / 2 - 10px))}
  .pe-sheet{max-width:560px;margin-inline:auto}
}

/* ═══ ≥ 840: рейка + список + панель ═══ */
@media (min-width:840px) and (min-height:480px){
  :root{--rail:84px; --panel:clamp(440px, 40vw, 680px); --col:720px}

  /* нижнее меню → рейка слева */
  .tabbar{top:0;right:auto;width:var(--rail);flex-direction:column;justify-content:flex-start;align-items:stretch;gap:8px;
    padding:max(16px, env(safe-area-inset-top)) 6px 16px;border-top:none;border-right:1px solid var(--ds-line);
    background:var(--ds-surface)}
  .tab{flex:none;gap:4px;padding:10px 0;border-radius:var(--ds-r-md);font-size:var(--ds-fs-label);transition:background .15s}
  .tab:hover{background:color-mix(in srgb,var(--ds-text) 4%,transparent)}
  .tab.on{background:color-mix(in srgb,var(--ds-accent) 10%,transparent)}
  .tab .badge{margin-left:20px}

  /* список — fixed между рейкой и панелью: без dvh, одинаково при любом zoom */
  main{position:fixed;top:0;bottom:0;left:var(--rail);right:0;height:auto;padding-bottom:48px;
    transition:right .3s cubic-bezier(.32,.72,.33,1)}
  :root{--fab-r:24px; --fab-b:24px}
  .micfab,.fm-items{right:var(--fab-r);bottom:var(--fab-b)}
  .fm-label{bottom:calc(var(--fab-b) + 29px + 150px)}   /* подпись веера — над дугой иконок */
  .toast{bottom:28px}

  /* карточка задачи и чат сессии — панель справа: открыта — список сдвигается и остаётся виден, фона-затемнения нет */
  .tsheet,.asheet{top:0;bottom:0;left:auto;right:0;width:var(--panel);max-width:none;margin:0;height:auto;max-height:none;
    border-radius:0;box-shadow:none;transform:translateX(100%)}
  .tsheet.on,.asheet.on{transform:none;box-shadow:var(--ds-shadow-1)}
  .tsheet{padding:max(16px, env(safe-area-inset-top)) 22px 24px}
  .tsheet .grab{display:none}
  .tsheet .nt-x{display:flex}   /* в панели нет затемнения, по которому тапают мимо */
  .tsheet .nt-body{position:relative;padding-top:44px}
  #tveil,#aveil{display:none}
  body:has(#tsheet.on, #asheet.on) main{right:var(--panel)}
  body:has(#tsheet.on, #asheet.on) .micfab{display:none}
  /* экран обещания (тикет 14) — та же панель справа: список виден и кликается, микроменю — внизу панели */
  .pscreen{left:auto;width:var(--panel);box-shadow:var(--ds-shadow-1)}
  .pscreen .ps-main{padding-inline:24px}
  .pscreen .ps-top{padding-inline:8px 14px}
  body:has(#pscreen.on, #notescr.on) main{right:var(--panel)}
  body:has(#pscreen.on, #notescr.on) .micfab{display:none}
  .pe-sheet{left:calc(50% + var(--rail) / 2 - 280px);right:auto;bottom:24px;width:560px;max-width:calc(100vw - var(--rail) - 32px);
    margin:0;border-radius:var(--ds-r-lg);padding-bottom:18px}
  .pi-sheet{top:0;left:auto;width:var(--panel);border-radius:0}   /* «О задаче» — поверх панели сессии, не на всё окно */
  /* внутри панели чат занимает её целиком — колонка не нужна */
  .asheet .ic-viewport{padding-inline:16px}
  .asheet .ic-head{padding-inline:12px}

  /* заметка и «ИИ-аналитика» — окно по центру; под ним — настоящая вуаль (рейка и список не кликаются) */
  .nscreen{inset:auto;top:50%;left:calc(50% + var(--rail) / 2);width:min(780px, calc(100vw - var(--rail) - 48px));
    height:92%;max-height:940px;transform:translate(-50%,-50%);border-radius:var(--ds-r-lg);overflow:hidden;
    box-shadow:var(--ds-shadow-2)}
  body.nlock::after{content:"";position:fixed;inset:0;z-index:39;background:var(--ds-scrim)}
  .nscreen .nc-viewport, .nscreen .ic-viewport, .nscreen .ic-head, .nscreen .nc-head{padding-inline:20px}

  /* «Перенести», «ИИ-сессии» — листы по центру окна и поверх панели (вуаль и лист выше неё) */
  .msheet,.lsheet{border-radius:var(--ds-r-lg);bottom:24px;left:calc(50% + var(--rail) / 2 - 280px);right:auto;width:560px;margin:0;
    max-width:calc(100vw - var(--rail) - 32px);transform:translateY(130%)}
  #mveil{z-index:24} .msheet{z-index:25}   /* выше панелей: лист задачи 21, экран обещания 22 */
  .ss-menu{margin:auto;border-radius:var(--ds-r-lg);padding-bottom:8px}   /* нативный dialog: по центру, не листом снизу */
}

/* ═══ ≥ 1200: «Сегодня» в две колонки ═══ */
@media (min-width:1200px) and (min-height:480px){
  :root{--col:1180px}
  #view-commit,#view-notes,#view-ai{max-width:760px;margin-inline:auto}   /* списки — читаемой строкой, шире не нужно */
  #view-today{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:0 28px;align-items:start}
  .today-l,.today-r{min-width:0}
  .today-r{padding-top:6px}
  .sprints{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));margin:0 0 12px;padding:0;overflow:visible}
  /* с открытой панелью места меньше — «Сегодня» в одну колонку */
  body:has(#tsheet.on, #asheet.on, #pscreen.on, #notescr.on) #view-today{grid-template-columns:minmax(0,1fr)}
}

/* ═══ ≥ 1600: широкий экран, очки — крупнее интерфейс и шире панель ═══ */
@media (min-width:1600px) and (min-height:480px){
  :root{--panel:640px; --col:1400px; --ui-zoom:1.18}   /* 640 — логические px: после zoom та же доля экрана на любом движке */
  html{zoom:var(--ui-zoom)}
  #view-today{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:0 36px}
  .tab{font-size:var(--ds-fs-caption)}
  /* панель открыта — список прижат к рейке (мастер-деталь), а не плавает между рейкой и панелью */
  body:has(#tsheet.on, #asheet.on, #pscreen.on, #notescr.on) main > section{margin-left:24px;margin-right:auto}
}
@media (min-width:2200px) and (min-height:480px){ :root{--ui-zoom:1.3; --col:1600px} }   /* XREAL 2560×1080 */
@media (min-width:3200px) and (min-height:480px){ :root{--ui-zoom:1.6} }                  /* 3840×1080 (32:9) */