.app-shell{
  height:100dvh;
  max-height:100dvh;
  display:grid;
  grid-template-rows:auto 1fr auto;
  gap:16px;
  padding:18px 18px calc(16px + env(safe-area-inset-bottom));
}
.topbar{
  display:block;
  min-height:8px;
}
.topbar--ghost{
  min-height:8px;
}
.app-main--tabs{
  display:block;
  min-height:0;
  height:calc(100dvh - 176px);
  overflow:hidden;
}
.tab-pane{
  display:none;
  height:100%;
  overflow:hidden;
  padding-bottom:120px;
}
.tab-pane--active{display:grid;gap:16px;align-content:start}
.bottom-nav{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  padding:10px;
  border:1px solid var(--stroke);
  border-radius:999px;
  background:rgba(0,0,0,.18);
  backdrop-filter:blur(14px);
  min-height:var(--nav-h);
}
.nav-item{
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--text-1);
  font-size:26px;
}
.nav-item--active{
  background:rgba(33,214,160,.16);
  color:var(--accent);
}


.tab-pane--scroll{
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}



html[data-cabinet-boot="booting"] .app-main,
html[data-cabinet-boot="booting"] .bottom-nav {
  visibility: hidden;
}

html[data-cabinet-boot="booting"] .app-shell::before {
  content: "Подготавливаем кабинет…";
  position: absolute;
  inset: 120px 24px auto 24px;
  display: block;
  padding: 28px 24px;
  border-radius: 30px;
  background: rgba(7, 36, 44, 0.88);
  border: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.92);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.01em;
  z-index: 5;
}

html[data-cabinet-boot="ready"] .app-main,
html[data-cabinet-boot="ready"] .bottom-nav,
html[data-cabinet-boot="failed"] .app-main,
html[data-cabinet-boot="failed"] .bottom-nav {
  visibility: visible;
}
\n\n
.boot-gate{
  position:fixed;
  inset:0;
  z-index:40;
  display:grid;
  place-items:center;
  pointer-events:none;
}

.boot-gate__card{
  min-width:220px;
  max-width:280px;
  padding:18px 20px;
  border-radius:999px;
  display:flex;
  align-items:center;
  gap:14px;
  background:linear-gradient(180deg, rgba(14,57,67,.90), rgba(8,35,44,.88));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 18px 40px rgba(0,0,0,.28);
  backdrop-filter:blur(18px);
  color:rgba(255,255,255,.96);
}

.boot-gate__icon{
  width:22px;
  height:22px;
  flex:0 0 22px;
  border-radius:50%;
  position:relative;
}

.boot-gate__text{
  font-size:15px;
  line-height:1.2;
  font-weight:700;
  letter-spacing:.01em;
}

.boot-gate[data-mode="booting"] .boot-gate__icon{
  border:2px solid rgba(255,255,255,.20);
  border-top-color:rgba(255,255,255,.92);
  animation:bootSpin .8s linear infinite;
}

.boot-gate[data-mode="success"] .boot-gate__icon{
  background:rgba(33,214,160,.20);
  border:1px solid rgba(33,214,160,.45);
}

.boot-gate[data-mode="success"] .boot-gate__icon::before{
  content:"";
  position:absolute;
  left:6px;
  top:3px;
  width:6px;
  height:11px;
  border-right:2px solid #21d6a0;
  border-bottom:2px solid #21d6a0;
  transform:rotate(45deg);
}

.boot-gate[data-mode="failed"] .boot-gate__icon{
  background:rgba(255,196,87,.18);
  border:1px solid rgba(255,196,87,.40);
}

.boot-gate[data-mode="failed"] .boot-gate__icon::before{
  content:"!";
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:#ffc457;
  font-weight:900;
  font-size:14px;
}

html[data-cabinet-boot="ready"] .boot-gate{
  opacity:0;
  transition:opacity .22s ease;
}

@keyframes bootSpin{
  to{transform:rotate(360deg)}
}
\n\n
/* palette-layout-bridge-v1 */
.app-main{
  background:transparent;
}

.tab-pane{
  background:transparent;
}

.topbar{
  background:linear-gradient(180deg, rgba(19,78,94,.92), rgba(19,78,94,.92));
  border-bottom:1px solid rgba(255,255,255,.05);
}

html, body{
  background:var(--bg-0);
  color:var(--text-1);
}


/* app-lock-v2:start */
html, body{
  overflow:hidden;
  overscroll-behavior:none;
  touch-action:manipulation;
}

body{
  position:fixed;
  width:100%;
  height:100%;
}

.app-shell,
.app-main,
.app-main--tabs,
.tab-pane{
  overflow:hidden;
  overscroll-behavior:none;
}

*{
  -webkit-tap-highlight-color:transparent;
}
/* app-lock-v2:end */


/* telegram-header-harmony-v1:start */
.topbar,
.topbar--ghost{
  display:none !important;
  min-height:0 !important;
  height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}

.app-shell{
  gap:10px;
  padding:12px 18px calc(16px + env(safe-area-inset-bottom));
}
/* telegram-header-harmony-v1:end */


/* nav-canon-v3:start */
.app-shell{
  gap:8px;
  padding:12px 16px calc(6px + env(safe-area-inset-bottom));
}

.bottom-nav{
  align-self:end;
  margin:0;
}
/* nav-canon-v3:end */


/* nav-competitor-v4:start */
.app-shell{
  gap:6px;
  padding:12px 16px calc(2px + env(safe-area-inset-bottom));
}

.bottom-nav{
  align-self:end;
  margin:0;
}
/* nav-competitor-v4:end */


/* nav-material3-expressive-v1:start */
.app-shell{
  gap:5px;
  padding:12px 16px calc(2px + env(safe-area-inset-bottom));
}

.bottom-nav{
  align-self:end;
  margin:0;
}
/* nav-material3-expressive-v1:end */