/* Плашка «Технические работы» (static/maint.js): над основной панелью, в её же отступах, ничего не закрывает */
.maint {
  display: flex; align-items: flex-start; gap: 12px;
  margin: 8px 8px 0 calc(var(--side) + 16px); padding: 12px 12px 12px 16px;
  background: color-mix(in srgb, var(--close) 9%, var(--bg)); border: 1px solid color-mix(in srgb, var(--close) 30%, transparent);
  border-radius: var(--radius); color: var(--text); font-size: 14px; line-height: 1.45;
  animation: maint-in .25s ease-out;
}
.maint[data-kind="down"], .maint[data-kind="offline"] {
  background: color-mix(in srgb, var(--err) 8%, var(--bg)); border-color: color-mix(in srgb, var(--err) 28%, transparent);
}
.maint-ic { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: color-mix(in srgb, var(--close) 16%, transparent); color: var(--close); }
.maint[data-kind="down"] .maint-ic, .maint[data-kind="offline"] .maint-ic { background: var(--err-soft); color: var(--err); }
.maint-ic svg { width: 18px; height: 18px; }
.maint-txt { flex: 1; min-width: 0; padding-top: 5px; }
.maint-txt b { font-weight: 600; margin-right: 8px; }
.maint-since { color: var(--muted); font-size: 13px; }
.maint-msg { display: block; color: var(--muted); margin-top: 2px; overflow-wrap: anywhere; }
.maint-x {
  flex: none; display: grid; place-items: center; width: 32px; height: 32px; padding: 0;
  border: 0; border-radius: 10px; background: transparent; color: var(--muted); cursor: pointer;
}
.maint-x:hover { background: var(--glass); color: var(--text); }
.maint-x:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.maint-x svg { width: 16px; height: 16px; }
body.has-maint main { min-height: calc(100vh - 16px - 72px); }

@keyframes maint-in { from { opacity: 0; transform: translateY(-4px); } }
@media (prefers-reduced-motion: reduce) { .maint { animation: none; } }

@media (max-width: 700px) {
  .maint { margin: 6px 6px 0; padding: 10px 8px 10px 12px; font-size: 13px; }
  .maint-ic { width: 28px; height: 28px; }
  .maint-txt { padding-top: 3px; }
}
@media print { .maint { display: none; } }
