/* VAINBLADE UI · view-specific */

.footer { display: flex; }
@media (max-width: 900px) { .footer { display: none; } .container { padding-bottom: 120px; } }
body { padding-bottom: var(--footer-h); }
@media (max-width: 900px) { body { padding-bottom: 0; } }

/* профиль-dl */
.profile-dl { display: grid; grid-template-columns: 120px 1fr; gap: 8px 14px; margin: 0; font-size: var(--fs-sm); }
.profile-dl dt { font: var(--fs-xs)/1.6 var(--mono); color: var(--fg-3); text-transform: uppercase; letter-spacing: .08em; }
.profile-dl dd { margin: 0; word-break: break-word; }

/* QR */
#subQr canvas, #subQr img { margin: 0 auto; image-rendering: pixelated; }
#qrBox { min-width: 180px; }


/* library item */
.item .item-title .spacer { flex: 1; }
.slot:empty { display: none; }

/* input-row select в nodes */
.item-actions .select { width: auto; min-width: 150px; }

/* статус: job строки плотнее */
#stSched .item, #stGates .item { padding: 8px 0; }

/* mobile nav: 5 плиток вправо не уезжают */
@media (max-width: 420px) {
  .mtab { min-width: 64px; }
  .mtab span:last-child { font-size: 10px; }
}

/* hero pipeline на среднем */
@media (max-width: 700px) { .pipeline .pipe-node { border-right-width: 1px; } }

/* chip-clickable */
.chip-clickable { cursor: pointer; }

/* details legend колонки на мобиле */
@media (max-width: 640px) { .code-legend { grid-template-columns: 1fr 1fr; } }

/* кнопка копирования у sub на мобиле — в две строки */
@media (max-width: 640px) {
  #subPanel .input-row { flex-wrap: wrap; }
  #subPanel .input-row .input { flex-basis: 100%; order: -1; }
  #subPanel .input-row .btn { flex: 1; }
}

/* skeleton для списка */
#nodesList .item { animation: rise-in .2s var(--eo) backwards; }
#nodesList .item:nth-child(2) { animation-delay: .03s; }
#nodesList .item:nth-child(3) { animation-delay: .06s; }

/* уровни: на десктопе таблица, на мобиле — карточки */
#levelsCards { display: none; }
@media (max-width: 700px) {
  #levelsTable { min-width: 0; }
  .table-wrap { display: none; }
  #levelsCards { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap); padding: 12px; }
  #levelsCards .stat { padding: 12px; }
  #levelsCards .stat .v { font-size: var(--fs-md); }
}
.lv-card-you { border-color: var(--fg-3) !important; box-shadow: inset 2px 0 0 var(--white); }
@media (min-width: 701px) {
  #levelsTable { min-width: 0; }
}