:root {
 --transition-speed: 0.15s ease;
 --category-box-width: 300px;
 --base-left: 12px;
 --indent-unit: 20px;
}
.category-card {
 width: var(--category-box-width);
 max-width: calc(100% - 32px);
 background: #181c1f;
 border-radius: 12px;
 overflow: hidden;
 display: flex;
 flex-direction: column;
 box-shadow: 0 10px 30px rgba(0,0,0,0.45);
 font-size: 14px;
 border: 1px solid rgba(255,255,255,0.02);
 font-family: classy;
 box-sizing: border-box;
 margin: 0 auto;
}
.category-scroll {
 padding: 12px;
 overflow: auto;
 -webkit-overflow-scrolling: touch;
}
.category-group, .nav-item-group {
 position: relative;
 display: flex;
 flex-direction: column;
 border-top: 1px solid rgba(255,255,255,0.02);
}
.category-group.has-line::before, .nav-item-group.has-line::before {
 content: '';
 position: absolute;
 left: var(--vline-left, 0);
 top: var(--line-top, 0);
 bottom: 0;
 width: 1px;
 background: rgba(255,255,255,0.10);
 z-index: 0;
}
.category-header, .nav-toggle {
 background: transparent;
 border: 0;
 color: #cacaca;
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 10px 12px;
 cursor: pointer;
 font-weight: 700;
 width: 100%;
 text-align: left;
 z-index: 1;
}
.left {
 display: flex;
 align-items: center;
 gap: 10px;
}
.label {
 color: #cacaca;
 font-weight: 400;
}
.chevron {
 display: inline-block;
 transform-origin: center;
 transition: transform var(--transition-speed);
 color: #cacaca;
}
.category-group.open > .category-header .chevron, .nav-item-group.open > .nav-toggle .chevron {
 transform: rotate(180deg);
}
.category-content, .sub-list {
 height: 0;
 overflow: hidden;
 transition: height var(--transition-speed);
 position: relative;
 outline: 0;
}
.sub-item {
 padding: 10px 12px;
 display: flex;
 align-items: center;
 gap: 10px;
 color: #cacaca;
 background: transparent;
 width: 100%;
 border: 0;
 cursor: pointer;
 z-index: 1;
 outline: 0;
}
.category-card .material-symbols-rounded {
 position: relative !important;
 display: inline-flex !important;
 padding: 0 !important;
 margin: 0 !important;
 vertical-align: middle !important;
 font-size: 17px !important;
 width: 20px !important;
 height: 20px !important;
 color: #cacaca !important;
 line-height: 1 !important;
 top: auto !important;
 left: auto !important;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
 align-items: center;
 justify-content: center;
 transition: transform var(--transition-speed);
}
.category-card .chevron {
 margin-left: auto !important;
 font-size: 18px !important;
}
.category-card .label {
 font-size: 14px !important;
 color: #cacaca !important;
 padding-left: 0 !important;
}
.category-card button:hover, .category-card button:focus-visible {
 transform: none;
 box-shadow: none;
}