body {
  margin: 0;
  background: #f4f6fb;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

#root {
  min-height: 100vh;
}

.admin-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 270px minmax(0, 1fr);
  position: relative;
}

.admin-sidebar {
  min-height: 100vh;
  position: sticky;
  top: 0;
  z-index: 1040;
}

.admin-main {
  min-width: 0;
}

.login-card {
  width: 100%;
  max-width: 430px;
}

.admin-sidebar-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
  border: 0;
  z-index: 1035;
}

.admin-modal {
  position: fixed;
  inset: 0;
  z-index: 1060;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.admin-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(17, 24, 39, 0.45);
}

.admin-modal__dialog {
  position: relative;
  width: min(100%, 640px);
  max-height: min(88vh, 820px);
  overflow: auto;
}

@media (max-width: 991.98px) {
  .admin-shell {
    grid-template-columns: 1fr;
  }

  .admin-sidebar {
    min-height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    width: min(86vw, 320px);
    transform: translateX(-100%);
    transition: transform 0.2s ease;
  }

  .admin-sidebar.is-open {
    transform: translateX(0);
  }

  .admin-main section {
    padding: 1rem !important;
  }
}

@media (max-width: 575.98px) {
  .admin-modal__dialog {
    width: 100%;
    max-height: 92vh;
  }
}