/* IAM — «Подложка-меню» (09.11.2026, макет ~/mac-dashboard/design/iam-tray/, вариант 8).
   Только «Новый» дизайн на ПК (на телефоне — iam-mnav-on — не трогаем). Включает 40-tray.js классом html.iam-tray.
   Экран — тёмная карточка, под ней светлая подложка: дата слева, разделы иконками по центру (у активного — подпись),
   справа поиск, уведомления, аватар. Подложку тянут вверх (профиль и настройки) и вниз (экран на всё окно).
   Левое меню (#app-sidebar) остаётся в DOM и спрятано: подложка нажимает его кнопки. */

:root{ --iam-round:'Nunito',ui-rounded,system-ui,sans-serif; --tv2-h:var(--iam-round); --trb:52px; --trr:22px; --tr-up:520px;
  --tr-bg:#e4e4df; --tr-ink:#1d1d20; }

html.iam-tray #app-sidebar,
html.iam-tray .rail-handle, html.iam-tray #iam-rail-handle, html.iam-tray .sh-rail-handle { display:none!important; }

/* экран над подложкой */
:root[data-design="shtab"].iam-tray.iam-tray:not([data-_a]):not([data-_b]):not([data-_c]) body:not(.pane2) :is(#app-sheet#app-sheet, .main-area) { left:0!important; right:0!important; bottom:var(--trlb,52px)!important; }
:root[data-design="shtab"].iam-tray.iam-tray:not([data-_a]):not([data-_b]):not([data-_c]) body.pane2 :is(#app-sheet#app-sheet, .main-area) { bottom:var(--trlb,52px)!important; }

/* «губа» — нижний край тёмной карточки со скруглением поверх подложки */
#iam-tray-lip { position:fixed; left:0; right:0; bottom:var(--trb); height:28px; z-index:940; pointer-events:none;
  background:var(--sh-canvas,#141416); border-radius:0 0 var(--trr) var(--trr); box-shadow:0 18px 30px -14px rgba(0,0,0,.55); display:none; }
html.iam-tray #iam-tray-lip { display:none; }

/* подложка */
#iam-tray { position:fixed; left:0; right:0; top:calc(100vh - 80px); height:calc(var(--tr-up) + 36px); z-index:1240; display:none;
  color:var(--tr-ink); font:400 13px var(--font-ui); touch-action:none; user-select:none; will-change:transform; transform:translate3d(0,0,0);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
#iam-tray .tr-body { position:absolute; inset:28px 0 0 0; background:var(--tr-bg); }   /* 10.11: светлое — только под краем экрана */
/* край экрана над подложкой: прозрачный (видно содержимое до самого шва), светлые только уголки за скруглением.
   Раньше край был залит тёмным и закрывал последние 28 px любого экрана (10.11, владелец: «чёрного места быть не должно») */
#iam-tray .tr-lip { position:relative; z-index:2; height:28px; background:transparent; border-radius:0 0 22px 22px; box-shadow:0 16px 26px -14px rgba(0,0,0,.55); pointer-events:none; }
#iam-tray .tr-lip::before, #iam-tray .tr-lip::after { content:''; position:absolute; bottom:0; width:22px; height:22px; }
#iam-tray .tr-lip::before { left:0; background:radial-gradient(circle at 100% 0, transparent 21.5px, var(--tr-bg) 22px); }
#iam-tray .tr-lip::after { right:0; background:radial-gradient(circle at 0 0, transparent 21.5px, var(--tr-bg) 22px); }
#iam-tray .tr-panel { z-index:1; } #iam-tray .tr-strip { z-index:3; }   /* полоска выше края карточки — подсказки разделов видны над ней */
html.iam-tray #iam-tray { display:block; }
#iam-tray .tr-strip { position:relative; height:52px; display:flex; align-items:center; gap:4px; padding:0 14px 0 20px; cursor:grab; }
#iam-tray .tr-strip:active { cursor:grabbing; }
#iam-tray .tr-grab { position:absolute; left:50%; top:-2px; width:56px; height:4px; margin-left:-28px; border-radius:2px; background:#8d8d92; box-shadow:0 1px 2px rgba(0,0,0,.3);
  opacity:0; transition:opacity .2s, width .2s cubic-bezier(.2,.9,.25,1.1), margin .2s cubic-bezier(.2,.9,.25,1.1), background .15s; }   /* 09.11, вариант F макета iam-grab: ручка на шве; видна при наведении, когда тянут и когда поднят профиль */
#iam-tray .tr-strip:hover .tr-grab, #iam-tray .tr-strip:active .tr-grab, html.tr-up #iam-tray .tr-grab { opacity:1; }
#iam-tray .tr-strip:hover .tr-grab { width:64px; margin-left:-32px; background:#a4a4aa; }
#iam-tray .tr-ctx { display:flex; align-items:baseline; gap:10px; white-space:nowrap; }
#iam-tray .tr-ctx b { font:800 17px var(--iam-round); letter-spacing:-.01em; }
#iam-tray .tr-ctx span { font:600 12.5px var(--iam-round); color:#7a7a7e; font-variant-numeric:tabular-nums; }
#iam-tray .tr-nav { position:absolute; left:50%; top:8px; height:36px; transform:translateX(-50%);   /* left ставит 40-tray.js в целых пикселях */ display:flex; gap:4px; justify-content:flex-start; contain:layout style; }
#iam-tray .tr-ind { position:absolute; top:0; left:0; width:40px; height:36px; border-radius:12px; background:#161618; box-shadow:none; z-index:2; overflow:hidden; pointer-events:none; will-change:transform; }
#iam-tray .tr-ind-in { position:absolute; left:0; top:0; display:flex; gap:4px; color:#f4f4f2; will-change:transform; }
#iam-tray .tr-ind-in span { width:40px; height:36px; display:grid; place-items:center; flex:none; }
#iam-tray .tr-ind-in svg { width:22px; height:22px; }
#iam-tray .tr-nb { all:unset; position:relative; cursor:pointer; height:36px; width:40px; box-sizing:border-box; justify-content:center; padding:0; border-radius:12px; display:flex; align-items:center;
  color:#3a3a3e; font:700 14px var(--iam-round); transition:background .15s; }
#iam-tray .tr-nb:hover { background:rgba(0,0,0,.06); }
#iam-tray .tr-nb.on { background:transparent; }   /* белая иконка — копия внутри плашки (.tr-ind-in) */
#iam-tray .tr-nb svg { width:22px; height:22px; flex:none; }   /* 10.11, владелец: иконки крупнее */
#iam-tray .tr-nb .lb { display:none; }   /* 09.11: только иконки; название — подсказкой при наведении */
#iam-tray .tr-nb .dt { position:absolute; top:6px; right:8px; width:6px; height:6px; border-radius:50%; background:#5aa416; z-index:3; }
#iam-tray .tr-nb.on .dt { top:5px; right:5px; background:#b9f36c; box-shadow:0 0 6px #b9f36c; }   /* 10.11, вариант E макета iam-pill: точка целиком внутри плашки */
#iam-tray .tr-nb[data-tip]:hover::before { content:attr(data-tip); position:absolute; bottom:48px; left:50%; transform:translateX(-50%); padding:5px 10px; border-radius:9px;
  background:#f4f4f1; color:#1d1d20; box-shadow:0 8px 20px -8px rgba(0,0,0,.6); font:600 12px var(--iam-round); white-space:nowrap; pointer-events:none; }
#iam-tray .tr-sp { flex:1; }
#iam-tray .tr-ib { all:unset; cursor:pointer; width:36px; height:36px; border-radius:12px; display:grid; place-items:center; color:#3a3a3e; position:relative; }
#iam-tray .tr-ib:hover { background:rgba(0,0,0,.06); }
#iam-tray .tr-ib svg { width:19px; height:19px; }
#iam-tray .tr-ib .dt { position:absolute; top:7px; right:7px; width:7px; height:7px; border-radius:50%; background:#5aa416; box-shadow:0 0 0 2px var(--tr-bg); }
#iam-tray .tr-ava { all:unset; cursor:pointer; width:32px; height:32px; border-radius:50%; overflow:hidden; margin-left:4px; display:grid; place-items:center;
  background:linear-gradient(135deg,#8796ee,#b9f36c); box-shadow:0 0 0 3px rgba(0,0,0,.06); font:800 14px var(--iam-round); color:#1c2410; }
#iam-tray .tr-ava img, #iam-tray .tr-ava .iam-ava { width:100%; height:100%; object-fit:cover; }
/* панель профиля под полоской */
#iam-tray .tr-panel { position:absolute; left:16px; right:16px; top:80px; height:calc(var(--tr-up) - 60px); border-radius:22px; overflow:auto; scrollbar-width:none;
  background:var(--sh-canvas,#141416); color:var(--text,#f4f4f2); opacity:0; pointer-events:none; will-change:opacity,transform; -webkit-font-smoothing:auto; }
#iam-tray .tr-panel::-webkit-scrollbar { display:none; }
#iam-tray .tr-panel #profile-content { padding:8px 0 20px; }

/* всплывающие над подложкой: проекты и «ещё» */
.tr-pop { -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; position:fixed; bottom:calc(var(--trb) + 10px); z-index:1300; min-width:260px; max-height:60vh; overflow:auto; padding:8px; border-radius:18px;
  background:#f4f4f1; color:#1d1d20; box-shadow:0 24px 50px -16px rgba(0,0,0,.6), 0 0 0 1px rgba(0,0,0,.06); font:400 13px var(--font-ui);
  transform-origin:bottom center; animation:trPop .32s cubic-bezier(.2,.9,.25,1.15); }
@keyframes trPop { from { opacity:0; transform:translateY(8px) scale(.96); } }
.tr-pop h6 { font:700 10.5px var(--iam-round); letter-spacing:.14em; text-transform:uppercase; color:#8a8a8e; padding:8px 10px 6px; margin:0; }
.tr-pop .pi { display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:11px; cursor:pointer; font:700 14.5px var(--iam-round); }
.tr-pop .pi:hover { background:rgba(0,0,0,.06); }
.tr-pop .pi i { width:10px; height:10px; border-radius:50%; flex:none; }
.tr-pop .pi em { margin-left:auto; font-style:normal; color:#8a8a8e; font:700 13px var(--iam-round); font-variant-numeric:tabular-nums; }
.tr-pop .pi svg { width:17px; height:17px; flex:none; color:#55555a; }
.tr-pop .pi.on { background:rgba(0,0,0,.07); }
.tr-pop hr { border:0; border-top:1px solid rgba(0,0,0,.07); margin:6px 4px; }

/* весь экран: у нижнего края — подсказка, как вернуть подложку */
#iam-tray-edge { position:fixed; left:0; right:0; bottom:0; height:16px; z-index:1200; display:none; cursor:n-resize; }
html.iam-tray.tr-full #iam-tray-edge { display:block; }
#iam-tray-hint { -webkit-font-smoothing:antialiased; position:fixed; left:50%; bottom:12px; transform:translateX(-50%); z-index:1201; padding:6px 12px; border-radius:12px; background:rgba(255,255,255,.1);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); color:#c9c9cc; font:600 12px var(--iam-round); opacity:0; pointer-events:none; transition:opacity .25s; }
html.iam-tray.tr-full #iam-tray-hint.show { opacity:1; }

/* крупное — скруглённым шрифтом (SF Pro Rounded в IAM.app/Safari, Nunito — остальные) */
:root[data-design="shtab"] #iam-topbar :is(.tb-ttl, .tb-period) { font-family:var(--iam-round)!important; font-weight:700!important; }

/* колокольчик: список уведомлений — над подложкой у кнопки, а не в левом верхнем углу */
html.iam-tray #sh-bellpop { top:auto!important; left:auto!important; right:64px!important; bottom:calc(var(--trb) + 10px)!important; transform-origin:bottom right; }

/* 10.11, владелец: «чёрного места быть не должно» — содержимое доходит до самого края экрана над подложкой */
:root[data-design="shtab"].iam-tray body #app-sheet#app-sheet > .sheet-content { padding-bottom:0!important; margin-bottom:0!important; }
:root[data-design="shtab"].iam-tray body.sh-topbar.tb-cal-on #cal-a#cal-a[data-v] #cal-scroll#cal-scroll { height:calc(100vh - 44px - var(--trlb,52px))!important; }
:root[data-design="shtab"].iam-tray body.sh-topbar.tb-cal-on #cal-a#cal-a[data-v="day"]:has(.ca-strip) #cal-scroll#cal-scroll { height:calc(100vh - 104px - var(--trlb,52px))!important; }
:root[data-design="shtab"].iam-tray body #app-sheet#app-sheet > .bn-wrap { display:none!important; }   /* обёртка нижнего меню телефона: на ПК пустая, но съедала 8 px внизу экрана */
/* весь экран: краю со светлыми уголками внизу окна не место — экран от края до края (10.11) */
html.iam-tray.tr-full #iam-tray .tr-lip { visibility:hidden; }