html {
  min-height: 100%;
  background: #050505;
  color: #f8fafc;
}

html[data-theme-resolved="light"] {
  background: #ebedef;
  color: #121417;
}

body {
  min-height: 100vh;
  margin: 0;
  background: inherit;
  color: inherit;
}

[hidden] {
  display: none !important;
}

.theme-svg {
  width: 16px;
  height: 16px;
  max-width: 16px;
  max-height: 16px;
}

.sidepanel-open-btn svg,
.menu-svg,
.tiona-brandword-o {
  width: 18px;
  height: 18px;
  max-width: 18px;
  max-height: 18px;
}

.sidepanel-open-btn svg,
.menu-svg,
.theme-svg {
  pointer-events: none;
}

.app-shell {
  position: relative;
}

.app-shell > .layout-container.app-grid {
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
}

.sidepanel-toggle {
  position: fixed;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
  pointer-events: none;
}

.side-panel-shell {
  position: fixed;
  left: 0;
  top: 52px;
  bottom: 0;
  z-index: 30;
  inline-size: 50px;
  max-inline-size: 50px;
  min-inline-size: 0;
  overflow: hidden;
  display: flex;
}

.side-panel {
  box-sizing: border-box;
  inline-size: 100%;
  min-block-size: 100%;
  margin: 0;
  padding: 4px;
  display: flex;
  flex-direction: column;
  background: #0f1115;
  border-right: 1px solid #273244;
}

.side-panel nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 2px;
}

.side-panel nav a {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  color: inherit;
  text-decoration: none;
}

.side-panel .menu-label,
.side-panel h3 {
  display: none;
}

.app-grid > .page-root {
  padding-left: 50px;
}