%menu-panel { border: var(--decor-border-100); border-radius: var(--decor-radius-200); box-shadow: var(--decor-elevation-600); } %menu-panel > ul > li { list-style-type: none; } %menu-panel dt { font-weight: var(--typo-weight-bold); } %menu-panel dl, %menu-panel-header { @extend %p2; } %menu-panel-separator { @extend %p3; text-transform: uppercase; font-weight: var(--typo-weight-medium); } %menu-panel dt span { font-weight: var(--typo-weight-normal); } %menu-panel-header + ul, %menu-panel-separator:not(:first-child) { border-top: var(--decor-border-100); } %menu-panel .is-active > *::after { @extend %with-check-plain-mask, %as-pseudo; } %menu-panel { border-color: rgb(var(--tone-gray-300)); background-color: rgb(var(--tone-gray-000)); } %menu-panel dt, %menu-panel dd { color: rgb(var(--tone-gray-800)); } %menu-panel dt span { color: rgb(var(--tone-gray-600)); } %menu-panel-separator { color: rgb(var(--tone-gray-600)); } %menu-panel-header + ul, %menu-panel-separator:not(:first-child) { border-color: rgb(var(--tone-gray-300)); }