.daggerheart.dialog.dh-style.views.group-roll-dialog {
    .initialization-container.active {
        display: flex;
        flex-direction: column;
        overflow: hidden;

        .main-roll {
            display: flex;
            flex-direction: column;
            text-align: center;
            padding-bottom: 4px;

            &.inactive {
                opacity: 0.4;
            }
        }

        .hint {
            color: var(--color-form-hint);
            line-height: 1;
            padding: var(--spacer-8) 0;
            font-family: var(--dh-font-body);
            font-size: var(--font-size-12);
            font-weight: 300;
        }

        .members-container {
            display: flex;
            flex-direction: column;
            gap: 8px;
            overflow-y: auto;

            .member-container {
                display: flex;
                position: relative;
                justify-content: center;
                height: unset;
                padding: 4px 8px;
                gap: var(--spacer-8);
                flex: 0 0 auto;

                &:not(.inactive) {
                    background: @golden-bg;
                }

                .name {
                    flex: 1;
                    color: light-dark(@dark, @beige);
                    font-weight: 500;
                    text-align: left;
                }
            }
        }

        footer {
            margin-top: 12px;
            display: flex;
            gap: 8px;

            button {
                flex: 1;
            }

            .finish-tools {
                flex: none;
                display: flex;
                align-items: center;
                gap: 4px;

                &.inactive {
                    opacity: 0.4;
                }
            }
        }
    }
}