/* DEVIL-DS · блок под иконку в строке списка: квадрат 36 со скруглением 10 (= радиус строки 16 − отступ 6).
   Круг — для нажимаемых кнопок; в строке иконка только подписывает смысл, поэтому квадрат. Цвет — только по смыслу. */
.dv-tile { --t-rgb: 255 255 255; flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; color: #F4F4F5;
  background: linear-gradient(rgb(var(--t-rgb) / var(--t-a, 6%)), rgb(var(--t-rgb) / var(--t-a, 6%))), rgb(0 0 0 / 45%);
  box-shadow: inset 0 0 0 1px rgb(var(--t-rgb) / 30%), inset 0 1px 0 rgb(255 255 255 / 22%), 0 0 2px 2px #000; }
.dv-tile .ic { width: 20px; height: 20px; stroke-width: 1.7; }
.dv-tile--green { --t-rgb: 34 197 94; --t-a: 16%; color: #4ADE80; }
.dv-tile--orange { --t-rgb: 249 115 22; --t-a: 16%; color: #FB923C; }
.dv-tile--red { --t-rgb: 239 68 68; --t-a: 16%; color: #F87171; }
.dv-tile--blue { --t-rgb: 59 130 246; --t-a: 16%; color: #60A5FA; }
.dv-tile--danger { --t-rgb: 239 68 68; --t-a: 16%; color: #EF4444; }
/* строки и карточки списков настроек — острее: 16 вместо 24 */
html .ak-row, html .a4-row, html .ms-row.a5-card, html .ak-card, html .a5-card { border-radius: 16px !important; }

/* заголовок группы: стеклянная капсула по центру, от неё в стороны тонкие линии */
html .dv-sect { display: flex !important; align-items: center; gap: 10px; margin: 18px 0 8px !important; padding: 0 !important; text-transform: none; letter-spacing: 0; }
html .dv-sect::before, html .dv-sect::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgb(255 255 255 / 22%)); }
html .dv-sect::after { background: linear-gradient(90deg, rgb(255 255 255 / 22%), transparent); }
html .dv-sect > span { flex: none; height: 26px; padding: 0 12px; border-radius: 13px; display: inline-flex; align-items: center;
  background: rgb(0 0 0 / 45%); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 28%), inset 0 1px 0 rgb(255 255 255 / 22%), 0 0 2px 2px #000;
  font: 600 12px/1 Oswald, Inter, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: #C7C7CC; }
html .dv-sect:first-child { margin-top: 4px !important; }

/* строка — всегда в одну линию: название слева, значение справа (без подписей под названием) */
html .a4-row__body, html .a5-txt { flex-direction: row !important; align-items: center; gap: 8px; min-width: 0; }
html .a4-row__t, html .a5-name, html .a5-lbl { flex: 0 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html .a4-row__m, html .a5-meta { flex: 0 1 auto; margin-left: auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: right; font: 400 14px/20px Inter, sans-serif !important; color: #8E8E93; }
html .a4-row { min-height: 48px !important; padding: 6px 6px 6px 6px !important; }
html .a4-note { display: none !important; }

/* экраны без шапки сверху: «назад» — внизу слева, кнопки экрана — справа от него */
body.a4-mode .screen { --p-content-top: calc(var(--p-status) + 30px) !important; --p-content-bottom: 120px !important; }
html .a4-back-bot { position: absolute; z-index: 13; left: 16px; bottom: var(--p-bottom-safe); }
html .a4-bottom { left: calc(16px + 48px + 8px) !important; }